Problems with the starting position in the drag movement

[fernando-tiburcio]

Hello, I am using this library in a project with react js and I must say that it is fantastic, however, I am having a positioning problem when I zoom in the window or when the rectView is moved (pan), for some reason that I have not yet I understand the draggable element keeps the old coordinates and does not update them with its new position when starting a new drag. Could you please help me?

My code:

const svgPoint = (el, x, y) => { const pt = el.createSVGPoint (); pt.x = x; pt.y = y; return pt.matrixTransform (el.getScreenCTM (). inverse ()); };

const setArrows = (x, y, arrow) => ({ ... arrow, x: arrow.x + (x - body.x), y: arrow.y + (y - body.y), });

const setLines = (x, y, line) => ({ ... line, x1: line.x1 + (x - line.x), y1: line.y1 + (y - line.y), x2: line.x2 + (x - line.x), y2: line.y2 + (y - line.y), x, y, });

const bodyDrag = new window.PlainDraggable (bi, { onMove: (position) => { const {left, top} = position; const {x, y} = svgPoint (svg, left, top); const tx = (x - bi.getBBox (). x); const ty = y - (bi.getBBox (). y + bi.getBBox (). height); setTopArrow (setArrows (tx, ty, topArrow)); setRightArrow (setArrows (tx, ty, rightArrow)); setBottomArrow (setArrows (tx, ty, bottomArrow)); setLeftArrow (setArrows (tx, ty, leftArrow)); setTopLine (setLines (tx, ty, topLine)); setRightLine (setLines (tx, ty, rightLine)); setBottomLine (setLines (tx, ty, bottomLine)); setLeftLine (setLines (tx, ty, leftLine)); setBody ({ ... body, x: tx, y: ty, }); }, });

[anseki]

Hi @T1B4, thank you for the comment. The code that you indicated did not work because that is a part of something maybe. To reproduce that, could you show an example by using e.g. https://jsfiddle.net/ ?

[fernando-tiburcio]

Okay this code is really just a part of a system component, anyway, I managed to solve the position difference by adding the left and top difference that existed after the parent element panned. Still thanks a lot for the answer, keep up the great work!

[anseki]

:smile: