Ceisum绘制雷达效果

在绘制圆锥的基础上加上Primitive的材质渲染(GLSL语言)。

	//初始化雷达波
		initRadarRiationWave() {
			// 雷达的高度
			let length = 40000;
			let centerOnEllipsoid = Cesium.Cartesian3.fromDegrees(110, 26, length * 0.5);
			this.map.camera.flyToBoundingSphere(new Cesium.BoundingSphere(centerOnEllipsoid, length));
			// 矩阵计算
			let modelMatrix = Cesium.Matrix4.multiplyByTranslation(
				Cesium.Transforms.eastNorthUpToFixedFrame(Cesium.Cartesian3.fromDegrees(110, 26)),
				new Cesium.Cartesian3(0.0, 0.0, length * 0.5), new Cesium.Matrix4()
			);
			let geometry = new Cesium.CylinderGeometry({
				length,
				topRadius: 0.0,
				bottomRadius: length * 0.3,
				vertexFormat: Cesium.MaterialAppearance.MaterialSupport.TEXTURED.vertexFormat
			});
			// 创建GeometryInstance
			let geometryInstances = new Cesium.GeometryInstance({
				geometry,
				modelMatrix,
			});
			// 创建雷达图Primitive
			let radar = viewer.scene.primitives.add(new Cesium.Primitive({
				geometryInstances,
				appearance: new Cesium.MaterialAppearance({
					material: new Cesium.Material({
						fabric: {
							uniforms: {
								color: new Cesium.Color.fromCssColorString("rgba(238, 85, 34, 1)"),
								rep: 15,
								offset: 0,
								thickness: 0.8,
							},
							source: `
                            uniform vec4 color;
                            uniform float rep;
                            uniform float offset;
                            uniform float thickness;
                            czm_material czm_getMaterial(czm_materialInput materialInput)
                            {
                                czm_material material = czm_getDefaultMaterial(materialInput);
                                float sp = 1.0/rep;
                                vec2 st = materialInput.st;
                                float dis = distance(st, vec2(0.5));
                                float m = mod(dis + offset, sp);
                                float a = step(sp*(1.0-thickness), m);
                                material.diffuse = color.rgb;
                                material.alpha = a * color.a * dis * 1.2;
                                return material;
                            }
                        `
						},
						translucent: false
					}),
					faceForward: false,
					closed: true
				}),
			}));
			// 动态修改雷达材质中的offset变量,实现动态效果。 
			viewer.scene.preUpdate.addEventListener(function () {
				let offset = radar.appearance.material.uniforms.offset;
				// 控制雷达波运动速度
				offset -= 0.001;
				if (offset > 1.0) {
					offset = 0.0;
				}
				radar.appearance.material.uniforms.offset = offset;
			});
		},