Cesium加载geojson并更改其材质

今天碰到这个需求,在网上找了一大圈,发现就是使用了GeoJsonDataSource方法后遍历其的entities,然后修改材质即可。

但是遇到一个坑,网上给出的代码是这样的(只是说我找到的):

Cesium.GeoJsonDataSource.load("xxx").then(dataSource=> {
     viewer.dataSources.add(dataSource);
     var entities = dataSource.entities.values;
     for (var i = 0; i < entities.length; i++) {
          var entity = entities[i];
          entity.polyline = new Cesium.PolylineGraphics({
               clampToGround: true,
               width: 5,
               material: new Cesium.PolylineOutlineMaterialProperty({
                            color: Cesium.Color.ORANGE,
                            outlineWidth: 2,
                            outlineColor: Cesium.Color.BLACK})
          });    
     }
});

看上去似乎没什么问题,运行之后代码并不会报错,也没有警告信息,但是就是出不来。而且是直接完全消失的那种。不论如何设置show:true都没有用。甚至重新调用viewer.entities.add都无法展示。

后来发现正确的写法应该是这样:

    Cesium.GeoJsonDataSource.load("xxx.json").then(dataSource => {
      viewer.dataSources.add(dataSource);
      var entities = dataSource.entities.values;
      // 这个定时器是用来观察效果的,没有特殊的含义
      setTimeout(() => {
        for (var i = 0; i < entities.length; i++) {
          var entity = entities[i];
          entity.polyline.width = 5;
          entity.polyline.clampToGround = true;
          entity.polyline.material = new Cesium.PolylineOutlineMaterialProperty({
            color: Cesium.Color.ORANGE,
            outlineWidth: 2,
            outlineColor: Cesium.Color.BLACK,
          })
        }
      }, 5000)
    });

最大的区别就在于那个new Cesium.PolylineGraphics({xxx}),官网的解释链接放这里了:

PolylineGraphics - Cesium Documentation有兴趣的可以看一下。

直接设置material就可以了,不用再new一个PolylineGraphics出来。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值