cesium绘制json后无法操作outline粗细与颜色问题的解决方案 基于vue-cli
加载了一份json数据(如下)但是发现绘制出来的图形无法直接通过参数中的属性修改边界线的颜色
1.cesium提供的加载json边界线的方法
let lineShow= Cesium.GeoJsonDataSource.load(
"../../static/你的json文件.json",
{
stroke: Cesium.Color.AQUA,
fill: Cesium.Color.YELLOW.withAlpha(0),
strokeWidth: 12,
}
);
但是发现在这里无法直接修改线条的属性
2.使用 entity.polygon.hierarchy._value.positions设置线条的颜色 完整方法如下
加载边界线方法() {
map.map3D.removeAllDataSource(); //加载前清除上一张
let lineShow= Cesium.GeoJsonDataSource.load(
"../../static/xxx.json",
{ //这里配置失败无法直接操作边界线属性
stroke: Cesium.Color.AQUA,
fill: Cesium.Color.YELLOW.withAlpha(0),
strokeWidth: 12,
}
);
lineShow.then(dataSource => {
map.map3D.dataSources.add(dataSource);
var entities = dataSource.entities.values;
for (let i = 0; i < entities.length; i++) {
let entity = entities[i];
let polyPositions = entity.polygon.hierarchy.getValue(
Cesium.JulianDate.now()
).positions;
//单独设置线条样式
var positions = entity.polygon.hierarchy._value.positions;
entity.polyline = {
positions: positions,
width: 2,
material: Cesium.Color.fromBytes(96, 200, 250)
};
}
});
},
通过.then进一步获取entity中的属性数据,然后对其进行逐一修改