Easeljs: l'objet ajouté à la scène lors du clic n'a pas de valeur X

Question

Essaie de suivre l'exemple de http://www.createjs.com/tutorials/Mouse%20Interaction/, qui montre comment faire glisser et déposer une forme. Quelque chose ne va pas pour moi. J'ajoute un cercle quand on clique sur la scène, puis j'essaie d'obtenir son emplacement x ... mon alerte montre un 0, mais le cercle apparaît au bon endroit. Ensuite, j'essaie de faire glisser, et le cercle se déplace, mais à une distance du pointeur de la souris.

var stage = new createjs.Stage("demoCanvas")  
stage.on("stagemousedown", function(evt) { 
    var corn = new createjs.Shape() 
    corn.graphics.beginFill('white').drawCircle(evt.stageX, evt.stageY, 20).endFill() 
    stage.addChild(corn) 
    stage.update() 
    alert(corn.x) 

    corn.on("pressmove", function(dragEvent) { 
     dragEvent.target.x = dragEvent.stageX; 
     dragEvent.target.y = dragEvent.stageY; 
     stage.update() 
    }); 
}) 

Answer 1

Vous confondez la position de forme x/y avec les coordonnées graphiques. La forme est à [0,0], puisque vous n'avez pas changé sa position x ou y.

Au lieu de cela, tracez le cercle à [0,0] et déplacez-le à la position de la souris.

var corn = new createjs.Shape() 
    .set({x:evt.stageX, y:evt.stageY}); 
corn.graphics.beginFill('green').drawCircle(0,0,20).endFill(); 

Voici un violon rapide: http://jsfiddle.net/xnn803sx/