如何恰克形状的颜色与easeljs

function initCircles() { 
 
    circles = []; 
 
    for (var i = 0; i < 100; i++) { 
 
    var circle = new createjs.Shape(); 
 
    var r = 7; 
 
    var x = window.innerWidth * Math.random(); 
 
    var y = window.innerHeight * Math.random(); 
 
    var color = colors[Math.floor(i % colors.length)]; 
 
    var alpha = 0.2 + Math.random() * 0.5; 
 
    circle.alpha = alpha; 
 
    circle.radius = r; 
 
    circle.graphics.beginFill(color).drawCircle(0, 0, r); 
 
    circle.x = x; 
 
    circle.y = y; 
 
    circles.push(circle); 
 
    circle.movement = 'float'; 
 

 
    circle.addEventListener("mouseover", function(event) { 
 
     circle.graphics.clear().beginFill("red").drawRect(0, 0, 50, 60).endFill(); 
 
     stage.update(event); 
 
    }); 
 

 
    stage.addChild(circle); 
 

 
    } 
 
}

我想对小圆圈我在页面上创建添加鼠标悬停听者，我希望，一旦我把光标放在圆形，它变成一个矩形。然而，矩形总是出现在其他圆圈存在的地方，而不是我指向的圆圈。

来源

2017-06-12 Gannys

问题在于，您正在引用闭包中的可变变量。有几种方法可以解决这个问题。

1）要么以某种方式引用从事件变量的圆圈嵌套函数的内部（如果事件具有用于支持），或者

2）绑定另一个函数内的变量的值，例如：

function initCircles() { 
    circles = []; 
    for (var i = 0; i < 100; i++) { 
     var circle = new createjs.Shape(); 
     var r = 7; 
     var x = window.innerWidth * Math.random(); 
     var y = window.innerHeight * Math.random(); 
     var color = colors[Math.floor(i % colors.length)]; 
     var alpha = 0.2 + Math.random() * 0.5; 
     circle.alpha = alpha; 
     circle.radius = r; 
     circle.graphics.beginFill(color).drawCircle(0, 0, r); 
     circle.x = x; 
     circle.y = y; 
     circles.push(circle); 
     circle.movement = 'float'; 

     addEventListener(circle); 

     stage.addChild(circle); 
    } 
    function addEventListener(circle) { 
     circle.addEventListener("mouseover", function(event) { 
      circle.graphics.clear().beginFill("red").drawRect(0, 0, 50, 60).endFill(); 
      stage.update(event); 
     }); 
    } 
}

来源

2017-06-12 10:05:49 mmso

这是直到添加命令方法的正确方式（在此线程中回答）http://blog.createjs.com/new-command-approach-to-easeljs-graphics/ – Lanny

感谢您的第一个建议，我指的是这样的圆：\t \t event.target.graphics.clear（）。beginFill（event.target.color）.drawCircle（0,0,15）.endFill（）; – Gannys

保存beginFill命令，后来又更改：

// your other code above 
var fillCmd = circle.graphics.beginFill(color).command; // Note the .command at the end 
circle.graphics.drawCircle(0, 0, r); 
// your other code below 

// Later 
fillCmd.style = "ff0000";

这里是an article about it，这里是0123无可否认，这可以更好地记录下来。 :)

来源

2017-06-12 22:54:23 Lanny

谢谢，我已经解决了这个问题。但是现在我在鼠标事件发生时更新更新文本时遇到问题。你知道该怎么做吗？这里是这个问题的链接。 – Gannys

如何恰克形状的颜色与easeljs

回答

相关问题