Strange flickering when moving mesh with BABYLON.PlaneDragGizmo

Strange flickering when moving a mesh left and right using a BABYLON.PlaneDragGizmo. See PG https://playground.babylonjs.com/#XHXWAW#1

To repro: drag the box left to right and vice versa, when mouse is in between the squares a strange flickering happens. Why?

You are only checking the position on x but as soon as you move it down it will move closer to the cam I guess creating the flickering experience, either you need to lock the drag axis or you would need to use a range or any other techniques preventing the back and forth

1 Like

Yeah, expanding on Seb’s answer, what basically happens at the border is: you start moving the plane, it has a (x1,y1) position (I’ll ignore the z since it’s not that important here). The object’s position is updated to (x2,y2), but since x2 is greater/smaller than zero (this happens both ways), the object’s position is then updated to (x2,ground + 1), which also moves the drag plane, which produces yet another update on the object’s position, and will trigger the drag again. One solution to this is add g.dragBehavior.updateDragPlane = false; which makes it so the plane isn’t updated while dragging, just after it: Spotlight Not Blocked By Mesh | Babylon.js Playground (babylonjs.com)

2 Likes

Thanks, the updateDragPlane = false solves it. But I’m not sure I understand why moving the object would trigger a drag event, wouldn’t they be triggered only by mouse move events?