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

Question

这更像是一个方法问题，而不仅仅是技术问题。

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

现在最大的问题是如何在运行时根据地形类型将地形网格调整到每个六边形面，地形类型也可能在运行期间发生变化，例如变形。同时考虑六边形不完全正规或相等。

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

提前致谢！

下面的图片：

1. 最大放大

   

2. 缩小地图

Answer 1

几年前遇到类似的问题。我还注意到你有另一篇帖子询问same question

• 你可以纹理每个六边形，假设它们是＆＃34; Hex-Sphere＆＃34;的差异面。几何就像你做cube to make a dice

  一样

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

• 您可以calculating its UV Map纹理六边形面，因为从您的其他帖子看来它没有UV。

作为一种方法，我会这样做，类似于如何使用perlin noise通过将十六进制面部纹理插入到一起使其无缝并且更新 onThange of THREE.MultiMaterial 。在您的其他帖子中，您提到从 Blender 导入网格。这与我的做法正好相反，因为它会导致一系列恶意问题。

对于你来说，我希望你有另一种选择：

• 创建一个立方体（记住每个边实际上都是三角形多边形集）
• 转动cube into a sphere
• 拆分所有六个立方体面，直到所需的十六进制数
• 创建每个六边形纹理的六个切片为三角形
• 将数组中的纹理应用于每个伪六边形的 6个面，基本上为creating a group。这使得使用perlin噪声计算，纹理和镶嵌更加容易，同时仍然具有fly-weights的精彩
• 通过重复前面提到的步骤，创建另一个六边形球体后立方体（技术术语人员），它在纹理球体周围是透明的。在这个外球体上，您将顶点合并为新的面作为六边形（在您之前的纹理六边形的正上方），它将具有指向其纹理对应物（三角形面的数组）的指针。这将是玩家实际与之交互和点击的内容。

希望这有用。

最佳，

Endorox