在Three.js PointCloud中将正方形改为圆形

Change square to circle in Three.js PointCloud?

本文关键字:正方形 Three js PointCloud      更新时间:2023-09-26

我正在使用PLYLoader加载一个.ply文件,并使用PointCloud对象在three.js中渲染它。

var loader = new THREE.PLYLoader();
loader.addEventListener('load', function (event) {
    var geometry = event.content;
    var material = new THREE.PointCloudMaterial({ vertexColors: true, size: 0.01 });
    var mesh = new THREE.PointCloud(geometry, material);
    scene.add(mesh);
});
loader.load(file_url);

工作正常,点被正确渲染。然而,这些点被渲染成一个正方形。有可能把它们变成一个圆吗?如果有,怎么做?

我发现这个旧线程显示了一个3 .js样本的图片。我们可以清楚地看到这些圆圈。然而,今天同样的示例显示正方形(在他们将particlessystem更改为PointCloud之后)。

谢谢

有多种方法可以做到这一点:

  1. 使用像这样的圆形图像作为输入。
  2. 使用<canvas>作为输入(并在画布上画一个圆圈),像这样。
  3. 使用ShaderMaterial和GLSL画一个圆,像这样。

解决方案是将圆形图像关联到每个点云。

你能看一下这个例子吗?

https://threejs.org/examples/webgl_points_billboards

也许你有解决办法