cesium之添加Primitive大量长方体

cesium之添加Primitive大量长方体

 场景：

变成中发现页面用peimitive加载上万个长方体柱子会出现页面很卡的问题。

原因：

每创建一个长方体用viewer.scene.primitives.add(new Cesium.Primitive())加载一次。

解决方法：

将所有的柱子创建口，放在同一个geometryInstances中取加载。

代码：

// 创建长方体对象
            const extrudedPolygon = new Cesium.PolygonGeometry({
                polygonHierarchy: new Cesium.PolygonHierarchy(
                    Cesium.Cartesian3.fromDegreesArray([
                        112.41726298378288,23.290411251106182,113.67072522399741,23.560312361463682,
                        114.09370956893551,22.590768298743153,112.83803246418894,22.285610818885644,
                    ])
                ),
                extrudedHeight: 100000,
            })
            const instance = new Cesium.GeometryInstance({
                geometry: extrudedPolygon,
                id: 'box with height',
            })
            const extrudedPolygon2 = new Cesium.PolygonGeometry({
                polygonHierarchy: new Cesium.PolygonHierarchy(
                    Cesium.Cartesian3.fromDegreesArray([
                        114, 22,115,22,
                        115,23,114,23,
                    ])
                ),
                extrudedHeight: 100000,
            })
            const instance2 = new Cesium.GeometryInstance({
                geometry: extrudedPolygon2,
                id: 'box with height',
            })
            // 创建材质，在MaterialAppearance中若不添加基础材质，模型将会透明
            var material = new Cesium.Material.fromType("Color");
                material.uniforms.color =  Cesium.Color.WHITE;
            // 自定义材质
            const aper = new Cesium.MaterialAppearance({
                material: material,
                translucent: true,
                closed: true,
            })
            // 加载模型
            var p = viewer.scene.primitives.add(
                new Cesium.Primitive({
                    geometryInstances: [instance, instance2],
                    appearance: aper,
                    releaseGeometryInstances: false,
                    compressVertices: false,
                })
            )

 

 

钻研不易，转载请注明出处。。。。。。