在Cesium中创建大型3D对象并将其加载到

时间:2018-11-16 12:01:17

标签: 3d postgis cesium gltf czml

我正在尝试创建3D对象并将其加载到Cesium中。 我需要从各种来源以编程方式(通过使用某些导入转换服务,.NET平台)创建这些对象

我有使用THREEJS的经验。 我阅读了DXF文件,将实体转换为PostGIS几何形状,进行了三角剖分(从高程数据创建曲面),细分了几何形状,最后构造了 兼容THREEJS的场景(JSON格式,压缩后,使用THREE.BufferGeometry)。效果很好:加载成千上万个三角形/点的饥饿感没有问题。 有时,我只是使用Webworkers来请求和解析JSON。

此外,我能够将很大(40mb)的geojson加载到我的OpenLayers客户端应用程序中,而不会出现任何问题(地图和WebGLMap)

但是我什至无法将20mb geojson(折线)加载到铯(1.51.0)中!

viewer.dataSources.add(Cesium.GeoJsonDataSource.load('data/geojson/test1.geojson'));

给我

An error occurred while rendering. Rendering has stopped.
RangeError: Array buffer allocation failed
RangeError: Array buffer allocation failed
    at arrayBufferConstructor_DoNotInitialize (<anonymous>)
    at new Float64Array (<anonymous>)
    at Object.o.createTypedArray (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:227:18570)
    at H (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:230:21640)
    at j (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:230:22200)
    at ne (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:230:30083)
    at Object.ae.splitLongitude (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:231:7036)
    at v (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:231:10398)
    at Object.M.combineGeometry (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:231:13298)
    at r (http://localhost:9090/public/ThirdParty/Cesium/Workers/combineGeometry.js:231:18552)

那是为什么? 我能做什么? GLTF / GLB / 3D磁贴是非常复杂的格式。没有使用这些格式自定义/控制对象创建的丰富工具集。 我不想购买(真正)超级双面胶FME Server来创建GLTF ... 也许我可以使用czml来加载复杂的几何图形,使用polylines等)?

1 个答案:

答案 0 :(得分:1)

这可能不是将表面模型放入铯中的最佳选择,但是我借助铯中的多边形实体设法使表面模型可视化。如果使用带有选项2的Delaunay Triangulation(表示TIN)创建表面模型,则可以使每个单独的三角形创建表面。只需丢弃构建三角形的所有点,您将获得适当的有序点以使表面可视化。剩下的就是遍历各个点并创建多边形。假设您将postgis中的点导出为geojson,那么您需要三到三遍遍您的点,因为一个三角形包含3个点;

我们可以在铯中使用perPositionHeight选项为true的多边形实体。所以代码可能在JS中是这样的;

for (var i = 0; i < designSurface.coordinates.length; i += 4) {
viewer.entities.add({
    parent: design,
    name: 'Cyan vertical polygon with per-position heights and outline',
    polygon: {
        hierarchy: Cesium.Cartesian3.fromDegreesArrayHeights([
            ...designSurface.coordinates[i],
            ...designSurface.coordinates[i + 1],
            ...designSurface.coordinates[i + 2],
        ]),
        perPositionHeight: true,
        material: Cesium.Color.CYAN.withAlpha(0.5),
        outline: true,
        outlineColor: Cesium.Color.BLACK,
        heightReference: Cesium.HeightReference.RELATIVE_TO_GROUND
    }
})

}