Constraining drag not working correctly?
See original GitHub issueDescribe the bug
Using chart.js 3.7.0, dragdata 2.2.4 Drag constrained by “onDrag” does not work as intended. If dragging a point, the constraint works as expected DURING drag (point keeps glued to upper/lower limit), but on dragEnd - if the cursor is beyond a limit - the point suddenly jumps to a “forbidden” value
To Reproduce I have the code (line chart) in a public github Also on stackblitz
The constraint of the drag is done via (index.ts:403) :
onDrag: function (e, datasetIndex, index, value: number | Point) {
e.target.style.cursor = 'grabbing';
if (typeof value === 'number') {
return value >= 2 && value <= 19;
}
return value.y >= 2 && value.y <= 19;
},
Expected behavior
If beyond a limit point during drag, the point shall stay there, regardless if the cursor moved further beyond on dragEnd.
Issue Analytics
- State:
- Created 2 years ago
- Comments:8 (5 by maintainers)
Top Results From Across the Web
Solved: Constrain movement when dragging - 8190674
Solved: In other Adobe programs, holding down the Shift key while dragging an object will constrain the movement. This doesn't seem to work...
Read more >Constrain (shift key) doesn't work with Smart Guides turned on
When smart guides are on none of the constrain features (holding down shift) work properly, whether it's rotating, reflecting, etc.
Read more >"constrain" dragging - Dorico - Steinberg Forums
is there some way of always having dragging constrained to one direction? (ie: start dragging left, and it will not move up/down).
Read more >Give us back the shift-key constraining dragging objects ...
On the Mac, hold down Shift-Option-Command and drag and it will constrain the direction of the new object. I assume on Windows it...
Read more >Constraining Draggable area - dart - Stack Overflow
No. That's not the goal of Draggable widget. Instead, use a GestureDetector to detect drag. Then combine it with something like Align to ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Alright, I now made a minor change creating a deep copy of the original data object. That solves the bug on my end, would be nice if you could confirm! chartjs-plugin_dragdata-v2.2.5_beta.zip
Best Chris
The flat copy may have the benefit of not stripping any getters/setters from the original object. Not sure if it’s a common pattern to use them in this context but I guess it could be annoying if the plug-in would unintentionally remove those