EaselJS Drag Drop - With Drag Drop within Responsive Publish

Question

Software: Adobe Animate
Type: HTML5 Canvas
Publish Settings: JavaScript/HTML (Loop Timeline | Include hidden layers | Center Stage: Both | Make Responsive: Both | Scale to visible area: Fit in view)

I've created a circle and converted it to a Movie Clip. In frame one I've added the following Actions:

// Defines "circle" as the object named "circle" in the library.
var circle = this.addChild(new lib.circle());

circle.on("pressmove", function(evt) {
    evt.target.x = evt.stageX;
    evt.target.y = evt.stageY;
});
circle.on("pressup", function(evt) {
    console.log("up");
});

The problem appears when exporting to Responsive it seems the drag drop's offset. Does anyone know the reasoning behind this and a method to resolve it?

Answer 1

I believe this is because Animate's responsive export scales the stage. You may need to transform your coordinates.

Check out this answer to an earlier post.