three.js/webgl 展示城市建筑
本文简述如何在three.js中展示已有的城市建筑面数据。
一、城市建筑面数据格式
这里的城市建筑面数据指的是底部为任意多边形,包含高度属性的面数据,这里我们使用的数据源为geojson格式的面数据。
二、构建几何要素的顶点信息
我们根据基础面数据和高度,构建底部面、侧面以及顶部面,并使用earcut将底面、侧面、顶面切成一个个绘制需要的三角形。
三、侧面贴纹理
为侧面指定纹理和纹理坐标
四、效果图
本文简述如何在three.js中展示已有的城市建筑面数据。
一、城市建筑面数据格式
这里的城市建筑面数据指的是底部为任意多边形,包含高度属性的面数据,这里我们使用的数据源为geojson格式的面数据。
二、构建几何要素的顶点信息
我们根据基础面数据和高度,构建底部面、侧面以及顶部面,并使用earcut将底面、侧面、顶面切成一个个绘制需要的三角形。
三、侧面贴纹理
为侧面指定纹理和纹理坐标
四、效果图