javascript - Fabric.js 中的动画图像

Question

热爱 Fabric 并试图掌握这一切。

我的总体目标是展示正在钻探的井。我有很多问题，但第一个问题是“如何为图像对象设置动画？”

我有:

var drillBit = new fabric.Image.fromURL('assets/images/drillBit.jpg',function(img){
    img.scale(0.5).set({left:400, top:0});
    canvas.add(img);
});

然后我打电话:

(function animate() {
    canvas.item(9).top+=1;
    canvas.renderAll();
    fabric.util.requestAnimFrame(animate);
})();

如果我将项目索引替换为另一个项目索引，以便它代表文本或矩形，它可以正常工作，但当我选择图像时没有任何效果。有人可以解释一下吗？

谢谢

Answer 1

Kangax 在 Google 群组中回答了这个问题。

解决办法是:

var drillBit = new fabric.Image.fromURL('assets/images/drillBit.jpg',function(img){
img.scale(0.5).set({left:400, top:0});
canvas.add(img);
//animate the drill
(function animate() {
    img.top+=1;
    canvas.renderAll();
    fabric.util.requestAnimFrame(animate);
})();
});