网站开发搜索功能创意网站交互

需求

Cesium 加载 geojson 文件并对文件中的属性值进行颜色设置

分析

在搜寻多种解决方案后，最后总结出 自己的解决方案

• 方案一，没看懂

var geojsonOptions = {clampToGround : true //使数据贴地};var entities;promise =Cesium.GeoJsonDataSource.load('数据.geojson', geojsonOptions);promise.then(function (dataSource) {viewer.dataSources.add(dataSource);entities =dataSource.entities.values;var colorHash = {};for (var i = 0; i < entities.length; i++) {var entity = entities[i]; // 赋随机颜色var name = entity.name;var color = colorHash[name];if (!color) {color = Cesium.Color.fromRandom({red: 1,maximumGreen: 1,maximumBlue: 1,alpha : 1.0});colorHash[name] = color;}entity.polygon.material = color;entity.polygon.outline = false;            entity.polygon.extrudedHeight =5000.0;}});viewer.flyTo(promise);

• 参考烦方案二：https://blog.csdn.net/qq_41553157/article/details/91040920

• 参考方案三：https://blog.csdn.net/weixin_45782925/article/details/123873146

• 参考方案四：https://blog.csdn.net/weixin_40187450/article/details/113446962

• 参考方案六：https://blog.csdn.net/Enbir/article/details/122597412

• 参考方案七：http://www.taodudu.cc/news/show-6244709.html?action=onClick

• 最后总结出了自己的解决方案如下

解决

可以遍历 GeoJSON 中的每个要素

// 加载 geojson 文件并添加至 Cesium 的 dataSource 上
promise = viewer.dataSources.add(Cesium.GeoJsonDataSource.load("file.geojson"));//默认是黄色
promise.then(function (dataSource) {// 获取要素中的实体const entities = dataSource.entities.values;const colorHash = {};//显示颜色for (let i = 0; i < entities.length; i++) {const entity = entities[i];let count = entity.properties.count._value; //等级let color = colorHash[count];if (count == '1') {color = new Cesium.Color(76 / 255, 230 / 255, 0, 1);  // #4ce600} else if (count == '2') {color = new Cesium.Color(56 / 255, 168 / 255, 0, 1);  //#38a800} else if (count == '3') {color = new Cesium.Color(255, 25, 25, 1);  // #a8a800} else if (count == "4") {color = new Cesium.Color(230 / 255, 152 / 255, 0, 1);  // #e69800} else if (count == "5") {color = new Cesium.Color(255 / 255, 255 / 255, 0, 1);  // #ffff00} else if (count == "6") {color = new Cesium.Color(168 / 255, 0, 0, 1);  // #a80000} else {color = new Cesium.Color(130 / 255, 130 / 255, 130 / 255, 1);  // #828282}colorHash[count] = color;// 判断加载的空间数据点线面类型   赋值颜色let featureType = entity.properties._geometry._value.type;if (featureType == "MultiPolygon") {entity.polygon.material = color;} else if (featureType == "MultiLineString") {entity.polyline.material = color;entity.polyline.width = 3;} else if (featureType == "MultiPoint") {entity.point.material = color;}}
})
viewer.flyTo(promise);