javascript - 脊柱多个动画

所以我有2个或更多的动画骨架（所以有2个或更多的json文件）。我希望他们在10秒后的同一时间播放另一个动画。

问题是只有一个动画正在播放，而第二个动画则没有显示。

我这样做的方式如下：

<canvas id="animationCanvas" width="240" height="240"></canvas>
<script>
    var first = true,
        rendererFirst = new spine.SkeletonRenderer('http://someurl.com/images/'),
        spineAFirst = /* My JSON Code */,
        parsedFirst = JSON.parse(spineAFirst);

    rendererFirst.scale = 0.2;
    rendererFirst.load(spineAFirst);
    rendererFirst.state.data.defaultMix = 1.0;

    for (var i in parsedFirst.animations) {
        if (first) {
            first = false;
            rendererFirst.state.setAnimationByName(0, i, true);
        } else {
            rendererFirst.state.addAnimationByName(0, i, true, 10);
        }
    }

    rendererFirst.skeleton.x = 120;
    rendererFirst.skeleton.y = 120;
    rendererFirst.animate('animationCanvas');
</script>

而且，当然，我要进行两次（或更多次）。我也尝试了一个SkeletonRenderer，只是根据需要加载（设置或添加）动画多次，但没有成功。

最佳答案

似乎渲染器每次都在清洁画布时，实现此效果的更好方法似乎是为每个动画创建一个画布，并将渲染器绑定到每个动画。