Pixi.js：动画圈（改善性能）

我想动画1000圈（位置，半径，alpha，填充，笔画）。我正在使用的当前方法涉及更新Graphics对象上的某些属性，但也清除并重新创建每个draw（）的圆。Pixi.js：动画圈（改善性能）

holder = new PIXI.Graphics(); 
holder.lineStyle(strokeWidth, strokeColor, strokeOpacity); 
holder.beginFill(color); 
holder.drawCircle(r, r, r); 
holder.endFill();

这是不幸的太贵了...有没有什么办法来避免清理圈或其他方法，可以加快这个渲染循环？

来源

2015-10-30 dani

如果您拥有可管理的圈子数量：例如笔画属性的组合，那么你可以使用精灵表。这比图形对象快得多。如果你需要不同的尺寸，你可以调整精神。 –

这应该是物种而不是spicies –

如果您在每个支架上持有一个参考（例如在一个阵列中），您可以在每个环路上更新其位置/着色等。

来源

2015-10-31 21:00:09

你可以尝试一些事情来提高性能：

确保您只使用一个PIXI.Graphics（或尽可能少的对象）对象，它是在初始化，而不是在每个animFrame创建。绘制该对象上的所有圆形并仅对其进行操作。
如果你不必在每一个圆上改变属性，尝试将相似的属性组合起来，你可以从它们生成纹理，然后仍然允许你操纵位置，大小和阿尔法。
尝试限制更新圈子，使其不会发生在每个平局上。你真的需要每秒60次更新吗？如果你这样做，尝试分组圈并更新例如在一个框架中的100个，在下一个框架中的下一个100等等......

我不确定你想用1000但是如果您在问题中添加示例，我可以通过优化提示更具体地了解。

来源

2015-11-02 09:38:35

Pixi.js：动画圈（改善性能）

回答

相关问题