cesium使用PolygonGeometry多边形实现分层单体化

在cesium中单体化是一个常用的功能,简单点说就是在模型上贴一层膜,然后在点击的时候让膜显示,并展示数据。在单体化的时候一般是用BoxGeometry实现的,如下:

function t(e) { 
        var i = new Cesium.Cartesian3.fromDegrees(e.x, e.y, e.z),
            o = Cesium.Transforms.eastNorthUpToFixedFrame(i);
        d = Cesium.Matrix3.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Cesium.Math.toRadians(e.rx), 0, 0)), C = Cesium.Matrix4.fromRotationTranslation(d, new Cesium.Cartesian3(0, 0, 0)), Cesium.Matrix4.multiply(o, C, o);
        h.add(new Cesium.ClassificationPrimitive({
            geometryInstances: new Cesium.GeometryInstance({
                geometry: Cesium.BoxGeometry.fromDimensions({
                    vertexFormat: Cesium.PerInstanceColorAppearance.VERTEX_FORMAT,
                    dimensions: new Cesium.Cartesian3(e.long, e.width, e.height)
                }),
                modelMatrix: o,
                attributes: {
                    color: new Cesium.ColorGeometryInstanceAttribute(0, 0, 1, .5),

                    show: new Cesium.ShowGeometryInstanceAttribute(!0)
                },
                id: e.id
            }),
            classificationType: Cesium.ClassificationType.CESIUM_3D_TILE
        }))
    }

但是正方体的使用不怎么方便,毕竟不是所有建筑都是规律的,于是我就想使用多边形就是PolygonGeometry。
但是因为我是要做分层所以就有一个高度因素,但我按照文档上的参数设置extrudedHeight和height却没有效果,
cesium使用PolygonGeometry多边形实现分层单体化_第1张图片
cesium使用PolygonGeometry多边形实现分层单体化_第2张图片

就是这样高度设置没有效果,后来我去搜索都说分层使用BoxGeometry实现,但是我觉得不好用,就自己在cesium沙箱中试出来了使用多边形做分层。

let primitive = new Cesium.ClassificationPrimitive({
        geometryInstances: new Cesium.GeometryInstance({
            geometry: new Cesium.PolygonGeometry({
                polygonHierarchy: new Cesium.PolygonHierarchy(
                    Cesium.Cartesian3.fromDegreesArray(e.coordinates),
                ),
                extrudedHeight: e.extrudedHeight,//分层顶部海拔
                height: e.height,//分层底部海拔
            }),
            attributes: {
                color: new Cesium.ColorGeometryInstanceAttribute(0, 0, 1, 0.5),
            }
        }),
        classificationType: Cesium.ClassificationType.CESIUM_3D_TILE,

    });
    viewer.scene.primitives.add(primitive);

重点是使用ClassificationPrimitive这样extrudedHeight和height就有效了。

你可能感兴趣的:(cesium,cesium)