我是Pixi的新手,正在考虑利用它来通过大量数据点和标签进行数据可视化。为了实验/开始,我创建了一个快速的应用程序,该应用程序渲染了100个带有标签的随机圆,并在mouseover / mouseout上包含了一些基本的交互性。我听说webgl可以让我渲染成千上万个节点而没有问题,但是如果我尝试将计数(在代码的第65行)设置为1000,我的浏览器几乎准备崩溃了-忘记了交互性。我的猜测是我需要开始考虑优化,但是作为一个新手,我真的不知道从哪里开始。有什么建议吗?

示例:https://www.pixiplayground.com/#/edit/WngviYj6fbBpNjqdqET5P

最佳答案

PIXI.ParticleContainer


  ParticleContainer类是Container的非常快速的版本
  专为提高速度而打造,因此在需要大量精灵或
  粒子。
  
  ParticleContainer的权衡是最先进的
  功能将不起作用。 ParticleContainer实现了基本的
  对象变换(位置,比例,旋转)和一些高级
  色彩等功能(自v4.5.6起)。
  
  其他更高级的功能,例如遮罩,子项,过滤器等
  不适用于此批处理中的sprite。


example演示10,000个Sprite。但是,您需要对示例进行一些重大更改:


将所有圆/标签放入单个ParticleContainer。
如果ParticleContainer内部不支持形状/文本,则必须将圆形/文本预渲染到纹理上。 (无论如何,这将比总是绘图要快。)
如果在ParticleContainer中不可能嵌套容器,则交互式调整大小逻辑将必须进行不同的处理。

09-19 19:57