javascript - 动画到特定点

Question

var stage = new Kinetic.Stage({
   container: 'container',
   width: 578,
   height: 200
});
var layer = new Kinetic.Layer();

var Circle = new Kinetic.Circle ({
     x: 100,
     y: 100,
     radius: 10,
     fill: 'green',
     stroke: 'black',
     strokeWidth: 5
});

layer.add(Circle);
stage.add(layer);

var a = 1;
var anim = new Kinetic.Animation(function(frame) {
     Circle.setX(frame.time * 350 / 1000 + 100);
 }, layer);


anim.start();

如何在特定点或坐标处停止动画？像动画到 x=700 然后停止。我想要一个能够用一个按钮动画的圆圈来协调 x=700，停止然后停止，然后再用另一个按钮返回或向下。

谢谢你。

Answer 1

有2种方式，
1。

var anim = new Kinetic.Animation(function(frame) {
    if(Circle.getX() < 700)
       Circle.setX(frame.time * 350 / 1000 + 100);
    else 
       this.stop();
}, layer);

或
2.Kinetic.Transition 在此处使用检查