Three.js在球形六边形网格地图上纹理地形

Question

这更像是一个方法问题,而不仅仅是技术问题.

我有一个生成的球体,分解为六边形作为一个网格.每个六边形瓷砖都是不同类型的地形,例如山脉,丘陵,海洋,飞机等.我想将3d中的每个地形类型绘制为一组多个网格,表示相应的地形类型.

现在最大的问题是如何在运行时根据地形类型将地形网格调整到每个六边形面,地形类型也可以在运行时更改,例如变形.同样考虑六边形不完全正规或相等.

最重要的是,我需要采用网格,表示地形类型并将其与六边形面完美对齐,表示球形地图上的图块.它甚至可能在three.js中吗？如果是,我应该使用什么技术来实现想要的结果？

提前致谢!

下图:

1. 最大放大

   

2. 缩小地图

Answer 1

几年前遇到过类似的问题。我还注意到你有另一个帖子问了同样的问题

• 您可以对每个六边形进行独特的纹理处理，假设它们是“六角球体”几何体的不同面，就像用立方体制作骰子一样

  hexSphere = new THREE.Mesh(
  myHexSphereGeometry,
  new THREE.MultiMaterial( materials ) );
  scene.add( hexSphere );
  

• 您可以通过计算其 UV 贴图来纹理六边形面，因为从您的其他帖子看来它没有 UV。

作为一种方法，我的做法类似于使用 柏林噪声开发景观的方式，通过将六角形面纹理插值在一起以使其无缝，并使其更新THREE.MultiMaterial 的 onChange。在您的另一篇文章中，您提到从Blender导入网格。这与我的做法相反，因为它可能会导致一系列恶意问题。

这是我希望适合您的另一种选择：

• 创建一个立方体（记住每条边实际上都是三角形多边形的集合）
• 把你的立方体变成一个球体
• 分割所有六个立方体面，直到获得所需六角形数量的六倍
• 将每个六边形纹理创建六片作为三角形
• 将数组集中的纹理应用到每个伪六边形的 6 个面中的每一个，本质上创建一个组。这使得使用柏林噪声进行计算、纹理和镶嵌更加容易，同时仍然具有飞行权重的强大功能
• 通过重复前面提到的步骤，创建另一个六边形球体后立方体物体（技术术语），它围绕纹理球体是透明的。在这个外球体上，您将把顶点合并到新的六边形面中（位于之前的纹理六边形的正上方），该六边形将具有指向其纹理对应部分（三角形面的数组）的指针。这将是玩家实际交互和点击的内容。

希望这有帮助。