three.js - 在 three.js 中显示数千张图片

Question

我在一个场景中有多达 200,000 张单独的图像(到目前为止使用 Sprite 完成)。我想看看这些 Sprite ，当我飞来飞去时，它们应该始终面对相机(就像 Sprite 一样)。我的问题是:我怎样才能实现 WebGL 方面的最佳性能？使用 useScreenCoordinates:false 的 Sprites 是否呈现为使用 GL_POINT？目前 fps 下降，图像数量已经非常低。到目前为止，我正在使用 mipmapping 和 Sprite 。因为他们需要转身面对我，所以我不想使用 BufferGeometry..

我非常感谢一些想法和意见 :) 谢谢!

PS:重点是您可以“飞”过 200,000 张图像并停止/选择您认为有趣的图像

Answer 1

我的团队也需要完成这项工作，遗憾的是，Doidel 的笔记在项目完成之前就消失了。我们开发了PixPlot , three.js 图像可视化层:

我整理了一篇博客文章，在此处概述了详细信息:http://douglasduhaime.com/posts/visualizing-tsne-maps-with-three-js.html

简而言之，如果其他人遇到这个问题，您将希望(理想情况下)使用一个大图像图集(一个大小为 2048 像素 x 2048 像素的 jpg 包含许多较小的图像)作为几何体的纹理来创建一个几何体.为每个要显示的小图像添加顶点、面和 vertexUV，并从图集纹理中拉出每个图像。