Use Cesium's Material to draw the cordon

Directly upload the rendering

Insert picture description here

Go directly to the key code:

Because it is extracted from the SDK, it cannot be run directly. The key lies PolylineMaterialAppearancein new Materialthe configuration in:


var instance = new GeometryInstance({
    geometry: new GroundPolylineGeometry({
        width:5,
        positions: this.points
    }),
    attributes: {}
});

const materialOpts = {
    fabric:{
        type : 'PolylineDash',
        uniforms:{
            color:{
                red:1,
                green:1,
                blue:0,
                alpha:1
            },
            gapColor:{
                red:1,
                green:1,
                blue:1,
                alpha:1
            },
            dashLength:50
        }
    }
}

this._primitive = this.parent.add(new GroundPolylinePrimitive({
    asynchronous: false,
    geometryInstances: instance,
    appearance :new PolylineMaterialAppearance({
        material:new Material(materialOpts)
    })
    
}));

Parsing

Cesium's Materialclasses are a powerful feature. Contains a variety of material templates, each material template has a specific configuration. I use PolylineDashthis type here . All configurations are in the fabricattributes, and the typematerial type is identified by sub-attributes . This is all supported material types . Here you can find the internal uniformsconfiguration of each material type . On fabricofficial file in the example here .

Guess you like

Origin blog.csdn.net/qq_29722281/article/details/102461089