In three.js, when we need PointCloud.sortParticles enabled?

梦想的初衷 提交于 2019-12-23 16:09:27

问题


I found some of the examples enable this property, but there're not enough comments to make me understand what it matters. Could you please tell me what's the best practice of this property?


回答1:


EDIT: PointCloud is now Points, and the .sortParticles property has been removed. That means the points are rendererd in the order they exist in the buffer. The answer below is outdated. three.js r.73


This is a perfect example of why it is important to understand at least the basic concepts of webGL if you are using three.js. (See this SO post.)

You need to set PointCloud.sortParticles = true if the rendering order matters.

Here is an example where the rendering order matters:

var material = new THREE.PointCloudMaterial( {
    map: texture, // has transparent areas
    transparent: true
} );

var pointCloud = new THREE.PointCloud( geometry, material );
pointCloud.sortParticles = true; // the default is false

In this case, the renderer will sort the points by depth, so points further from the camera are rendered first, and show through the transparent areas of the closer ones.

Here is an example where rendering order does not matter:

var material = new THREE.PointCloudMaterial( {
    map: texture,
    blending: THREE.AdditiveBlending,
    depthTest: false,
    transparent: true
} );

// point cloud
var pointCloud = new THREE.PointCloud( geometry, material );

Since sorting occurs on the CPU-side, it is best to choose your material settings wisely, so you can avoid the overhead -- especially for large systems.

I suggest you build a testbed and experiment. There are many, many possible cases to consider.

three.js r.69



来源:https://stackoverflow.com/questions/17764866/in-three-js-when-we-need-pointcloud-sortparticles-enabled

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!