创建大型 3D 对象并将其加载到 Cesium答案

【问题标题】：Creating and loading big 3D objects into Cesium创建大型 3D 对象并将其加载到 Cesium
【发布时间】：2019-04-19 14:54:33
【问题描述】：

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

我有在 THREEJS 中做这件事的经验。我读取 DXF 文件，将实体转换为 PostGIS 几何，三角测量（从高程数据创建表面），镶嵌几何并最终构建与 THREEJS 兼容的场景（使用 JSON 格式、Gzipped、THREE.BufferGeometry）。这很好用：加载成千上万的三角形/点没有问题。有时我使用 webworkers 只是为了请求和解析 JSON。

此外，我能够毫无问题地将相当大的 (40mb) geojson 加载到我的 OpenLayers 客户端应用程序中（地图和 WebGLMap）

但我什至无法将 20mb geojson（折线）加载到 cesium (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 服务器来创建 GLTF... 也许我可以使用 czml 加载复杂的几何图形，使用 polylines 等）？

【问题讨论】：

标签： 3d postgis cesium gltf czml

【解决方案1】：

这可能不是将表面模型放入 cesium 的最佳选择，但我设法通过 cesium 中的多边形实体来可视化表面模型。如果您使用 Delaunay Triangulation 和选项 2（即 TIN）创建曲面模型，您可以获得创建曲面的每个单独的三角形。只需转储构建三角形的所有点，您将获得适当的有序点来可视化表面。它的其余部分是循环通过点并创建多边形。假设您将 postgis 中的点导出为 geojson，那么您需要三三个点遍历您的点，因为一个三角形包含 3 个点；

我们可以通过 perPositionHeight 选项 true 在 cesium 中使用多边形实体。所以代码在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
    }
})

}

【讨论】：