使用Three.js创建类似屋顶的结构

时间:2013-03-06 12:00:51

标签: three.js

我目前正试图围绕一种在Three.js中的挤压形状顶部创建屋顶状结构的方法。在没有深入研究straight skeletons的情况下,我能想到的最简单的方法是挤出并缩放挤压网格的顶面以使其看起来像屋顶一样,或者在顶部创建一个形状看起来像屋顶的新网格。

如果应用于拉伸矩形(立方体),这是我所追求的最基本的样式: enter image description here

屋顶的阴影区域高于非阴影区域。

相同的样式,如果应用于更复杂的拉伸形状: enter image description here

我无法解决的是如何创建这样的屋顶结构,尤其是对于像第二个例子那样的复杂形状。我有建筑物“足迹”的顶点,但我不知道如何在缩放顶面时给它们挤出它们以给出倾斜的边。

我绝对可以计算出缩放的顶点位置,但是我不知道如何将顶部(缩放的)面连接到底面(即如何制作侧面)的另一个问题。

有什么想法吗?

2 个答案:

答案 0 :(得分:2)

听起来你想在ExtrudeGeometry中试验斜角参数。 https://github.com/mrdoob/three.js/blob/master/src/extras/geometries/ExtrudeGeometry.js

答案 1 :(得分:0)

由于顶部屋顶多边形将具有与底部屋顶多边形相同数量的顶点,这不仅仅是循环每个顶部屋顶多边形顶点并将其连接到它的底部屋顶多边形顶点的情况吗?

并且,顶部屋顶多边形上的任何两个顶点以及底部屋顶多边形上的相关顶点将为您提供侧面的所有顶点。