let list = [0,45,90,135,180,225,270,315];
let colorList = ['#2D8CF0','#2F6CF0','#333666','#1F8CD0','#5e6C00','#112255','#999000','#452341','#999000'];
let radiusList = [1000,2000,1000,1000,1000,1000,1000,1000,1000,1000,1000];
//通过改变半径来显示当前扇形的样式
list.map((x,k)=>{
let pm = {
center:[120.11794,31.267144],
startAngle:x,
endAngle:x+45,
radius:radiusList[k],
color:colorList[k]
}
drawCircle (pm)
})
const drawCircle = (params) => {
let center = Cesium.Cartesian3.fromDegrees(Number(params.center[0]), Number(params.center[1]));
let radius = Number(params.radius);
let color = new Cesium.Color.fromCssColorString(params.color).withAlpha(0.5);
let positions = [];
positions.push(center);
for (var i = Number(params.startAngle); i <= Number(params.endAngle); i+=0.01) {
let angle = Cesium.Math.toRadians(i);
let position = new Cesium.Cartesian3(
center.x + radius * Math.cos(angle),
center.y + radius * Math.sin(angle),
center.z
);
positions.push(position);
}
let geometry = new Cesium.PolygonGeometry({
polygonHierarchy: new Cesium.PolygonHierarchy(positions),
vertexFormat: Cesium.VertexFormat.POSITION_ONLY,
extrudedHeight: 1000
});
let material = new Cesium.Material.fromType(Cesium.Material.ColorType);
material.uniforms.color = new Cesium.Color(1.0, 0.0, 0.0, 0.5);
let primitive = new Cesium.Primitive({
geometryInstances: new Cesium.GeometryInstance({
geometry: geometry,
attributes: { color: Cesium.ColorGeometryInstanceAttribute.fromColor(color) }
}),
appearance: new Cesium.PerInstanceColorAppearance({
flat: true
}),
asynchronous: false
});
viewer.scene.primitives.add(primitive);
};
Cesium绘制有高度的饼状图
最新推荐文章于 2024-06-30 22:46:02 发布