Question

我正在尝试从高度图创建一个带有“封闭”底部的地形，请参见此处的示例：

http://demos.playfuljs.com/terrain/

我的地形生成功能如下：

var img = document.getElementById("landscape-image");
var numSegments = img.width - 1; // We have one less vertex than pixel

var geometry = new THREE.PlaneGeometry(2400, 2400, numSegments, numSegments);

var material = new THREE.MeshLambertMaterial({
    color: 0xccccff,
    wireframe: false
});
plane = new THREE.Mesh(geometry, material);
plane.name = 'Terrain';
// set height of vertices
for (var i = 0; i < plane.geometry.vertices.length; i++) {
    plane.geometry.vertices[i].z = (terrain[i]/255) * height;
}

geometry.computeFaceNormals();
geometry.computeVertexNormals();

plane.position.x = 0;
plane.rotation.x = 0;
plane.position.y = -10;

我遇到的问题是如何使用THREE.PlaneGeometry创建连接的地形底部。我无法挤出：

如果我挤出它的底部必须是扁平的，就像它一样颠簸地形。
Extrude采用Shape对象，而不是Geometry对象。

在此之前，任何人都真的在摸不着头脑。

编辑：也许我可以使用两架飞机并合并它们，但我如何将侧面合并为一块Geometery？

P.S。该示例直接绘制到画布

Answer 1

为每一面创建一个平面，其宽度为1，高度为1。它们根据您的高度图设置顶部顶点

类似这样的事情

var geometry_l = new THREE.PlaneGeometry(2400, 0, numSegments, 1);
plane_l = new THREE.Mesh(geometry_l, material);

for (var i = 0; i < numSegments; i++) {
     plane_l.geometry_l.vertices[i].z = (Terrain[0][i]/255) * height;
}
//Offset to the edge of your main plane

您可能希望将地形阵列更改为二维。所以你总能看到你想要的那一行。

我如何在Three.js

1 个答案: