如何在Cesiumjs中为GeometryInstance或PolygonGeometry添加轮廓

时间:2018-11-14 20:01:09

标签: polygon cesium

我需要用以下代码绘制轮廓到多边形图元:

         scene.primitives.add( new Cesium.ClassificationPrimitive({
            geometryInstances : new Cesium.GeometryInstance({
                geometry : new Cesium.PolygonGeometry({
                    polygonHierarchy : new Cesium.PolygonHierarchy(
                        Cesium.Cartesian3.fromDegreesArray(coords)
                    ),
                    height : height
                }),
                attributes : {
                    color: color,
                },
                id : id,
                description : "Highlight Object",
            })
        }));

有什么办法可以将轮廓绘制到多边形图元上?我知道可以与Entities一起添加,但要求是使用基元。 非常感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

您可以将PolylineCollection用作大纲的单独基元。

我创建了一个显示此用例的demo in Sandcastle

var viewer = new Cesium.Viewer('cesiumContainer');

var coords = [
    -72.0, 40.0,
    -70.0, 35.0,
    -75.0, 30.0,
    -70.0, 30.0,
    -68.0, 40.0
];

var cartesian = Cesium.Cartesian3.fromDegreesArray(coords);

var color = Cesium.Color.DARKRED;
var outlineColor = Cesium.Color.GOLD;

var polygonPrimitive = new Cesium.Primitive({
    geometryInstances: new Cesium.GeometryInstance({
        id: 'polygon',
        geometry: Cesium.PolygonGeometry.createGeometry(
            new Cesium.PolygonGeometry({
                polygonHierarchy: new Cesium.PolygonHierarchy(cartesian)
            })
        )
    }),
    appearance: new Cesium.MaterialAppearance({
        material: new Cesium.Material.fromType('Color', {
            color: color
        })
    }),
    asynchronous: false
});

var polylinePrimitive = new Cesium.PolylineCollection();
polylinePrimitive.add({
    positions: cartesian,
    width: 3.0,
    loop: true,
    material: new Cesium.Material.fromType('Color', {
        color: outlineColor
    })
});

var primitives = viewer.scene.primitives;
primitives.add(polygonPrimitive);
primitives.add(polylinePrimitive);