Dessiner un cercle déplaçable avec les informations de centre modifiées dynamiquement en utilisant easeljs

Question

J'essaie d'afficher les coordonnées du cercle qui est créé en double-cliquant dans le canevas. Je pourrais faire cette tâche mais quand je fais glisser le cercle, je veux que les informations de coordonnées soient changées. Cette information a été changée mais les informations de coordonnées qui étaient affichées auparavant sont toujours là. Comment afficher uniquement les informations actuelles S'il vous plaît aider. Vous pouvez le vérifier en direct sur: http://codepen.io/bsubba/pen/rxXXMa

function createCircle(x,y,r,stroke,id){ 
    var circle = new createjs.Shape(); 
    circle.graphics.setStrokeStyle(4).beginStroke(stroke).drawCircle(0, 0, r); 
    circle.x = x; 
    circle.y = y; 
    circle.name = "circle"; 
    circle.id = id; 
    circle.on("pressmove",drag); 
    var text = new createjs.Text("("+x+","+y+")","13px Arial","#000000"); 
    text.name = "coordinate"; 
    text.textAlign = "center"; 
    text.textBaseline = "middle"; 
    text.x = x; 
    text.y = y-25; 
    stage.addChild(circle, text); 

} 

//display co-ordiates of the circle 
function displayText(x,y,str){ 

    var text = new createjs.Text(str, "13px Arial", "#000000"); 
    text.name = "coordinate"; 
    text.textAlign = "center"; 
    text.textBaseline = "middle"; 
    text.x = x; 
    text.y = y-25; 
    text.name = "labels"; 

    stage.addChild(text); 
} 

//Drag function 
function drag(evt) { 
    evt.target.x = evt.stageX; 
    evt.target.y = evt.stageY; 
    displayText(evt.stageX,evt.stageY,"("+evt.stageX+","+evt.stageY+")"); 
    stage.update(); 
} 

Answer 1

Vous pouvez modifier le texte via la propriété text sur l'objet createjs.Text existant. Par exemple:

// save a reference to the text object on your circle object 
circle.textObj = text; 

//... 

function drag(evt) { 
    evt.target.x = evt.stageX; 
    evt.target.y = evt.stageY; 

    // get the existing text object and do some stuff with it 
    var textObj = evt.target.textObj; 

    textObj.text = str; 
    textObj.x = x; 
    textObj.y = y - 20; 
}