Question

Fabricjs：我有一些圆圈，超出画布层（顶部：-300），它们有坐标，但是当我为指定位置设置动画时，它们只是出现在指定持续时间的屏幕上没有任何动画。为什么他们这样做以及实现这个的方法是什么？

animateCircle(ind, co, shift = -300, ca) {
    co.animate('top', shift, {
        duration: 1000,
        onChange: ind !== null && ++ind === ca.length ? this.c.renderAll.bind(this.c): undefined,
        easing: fabric.util.ease[0]
    });
}

Answer 1

如果您使用的是最新的fabricjs，则可以使用参数来跳过屏幕外对象的绘制。您有两种方法可以为屏幕外对象设置动画：

1）在画布上禁用skipOffscreen检查设置skipOffscreen为false，或者仅为动画持续时间。

2）在动画期间计算动画对象的obj.setCoords（）。

animateCircle(ind, co, shift = -300, ca) {
    co.animate('top', shift, {
        duration: 1000,
        onChange: ind !== null && ++ind === ca.length ? 
        function() {
          this.c.renderAll();
          co.setCoords();
        } : undefined,
        easing: fabric.util.ease[0]
    });
}

为什么画布之外的元素没有动画（fabricjs）？

1 个答案: