Question

我有一个管几何形状。 JSON文件中有18738个点。管道内置2000点（考虑每9点）。 Tube有2000个段（强制性），每个段有12个面，每个面都涂有颜色。

当我在桌面浏览器上使用THREE.WebGLRenderer呈现模型时，FPS介于54-60之间。当我在桌面浏览器上使用THREE.CanvasRenderer呈现相同的模型时，FPS为1-2。

我要在iPad上运行这个模型。所以我需要使用THREE.CanvasRenderer。如果我减少FPS将增加的段数，但必须要求2000段。

JSON文件具有以下结构：

{"id":"0",
"r30" :"5.247","r60" :"5.088","r90" :"4.77","r120" :"5.724","r150" :"5.83","r180" :"5.459","r210" :"5.194","r240" :"5.035","r270" :"5.247","r300" :"5.565","r330" :"5.618","md":"20","point" :new THREE.Vector3(0,0,20)}

类似地，我有18738分并且每隔9点绘制一个管子。

tubeMesh = new THREE.Mesh(tube, new THREE.MeshBasicMaterial({
    color: 0xffffff,
    shading: THREE.FlatShading,
    side: THREE.DoubleSide,
    wireframe: false,
    transparent: false,
    vertexColors: THREE.FaceColors,
    overdraw: false
}));

如何使用THREE.CanvasRenderer改善FPS的效果？

R53

Answer 1

可悲的是，CanvasRenderer无法处理此类数字。在iPad上更少。

three.js - 使用CanvasRenderer提高性能（FPS）

1 个答案: