Search code examples
drag-and-dropkineticjs

KineticJS 5.1 after dragmove can't drag objects in another stage

I am using two canvases in my project, synchronizing moving objects in the two containers. The challenge is after moving one object, I can't drag any object in the second container. I am using:

 blueLine2.on('dragmove', function () {
            circle2.x(blueLine2.x() + blueLine2.points()[0]);
            blueLine1.setPosition({ x: blueLine2.x() * 2, y: blueLine2.y() * 2 });
            circle1.x(blueLine1.x() + blueLine1.points()[0]);
            guides2.draw();
            guides1.draw();
        });

Here is the complete code: http://jsfiddle.net/user373721/6f1e0c1p/

Would appreciate your suggestions.

Solution

  • For performance reasons KineticJS is not drawing hit canvas while dragging. So you have to update hit canvas after dragend:

        greenLine1.on('dragend', function() {
        guides2.draw();
    });

    http://jsfiddle.net/6f1e0c1p/1/