Comment animer paperjs onMouseEnter/Leave?

Question

Tous les exemples que je vois de paperjs impliquant le mouvement, se passe à l'intérieur de onFrame, mais comment animer sur les événements de la souris?

var circle1 = new Shape.Circle(new Point(80, 50), 30); 

circle1.strokeColor = 'green'; 
circle1.fillColor = 'green'; 

circle1.onMouseEnter = function (event) { 

    circle1.scale(1.2); 

} 

Cela fonctionne, mais il n'anime pas.

Answer 1

Vous pouvez faire une animation avec setInterval comme ci-dessous le code.

var circle1 = new Shape.Circle(new Point(80, 50), 30); 
circle1.strokeColor = 'green'; 
circle1.fillColor = 'green'; 
circle1.onMouseEnter = function (event) { 
    var totalScale = 1 
    var id = setInterval(function(){ 
     var scale = 1.01 
     totalScale *= scale; 
     if(totalScale > 2){ 
      clearInterval(id) 
     } 
     circle1.scale(scale); 
    } , 50) 
} 

Ajouter: [onFrame] version, c'est ce que vous voulez?

var circle1 = new Shape.Circle(new Point(80, 50), 30); 
circle1.strokeColor = 'green'; 
circle1.fillColor = 'green'; 
circle1.onMouseEnter = function (event) { 
    circle1.onFrame = function(){ 
     circle1.scale(1.01) 
    } 
} 
circle1.onMouseLeave = function (event) { 
    circle1.onFrame = null 
}