cesium 3DTileStyle的设置

如果需要在cesium上突出一部分3dTile场景模型，比较能够接受的方法是高亮选择部分的Feature，将其他未选择的Feature进行次要化，这里我们可以设置cesium的3DtileStyle来达到目的。

我们先来看下官网的API

3DTileStyle

其中style是运用于cesium3DTileset的样式设置，对于高亮，变暗实在color对象中实现的。

color: {
            conditions: [
                ['${height} >= 300', 'rgba(45, 0, 75, 0.5)'],
                ['${height} >= 200', 'rgb(102, 71, 151)'],
                ['${height} >= 100', 'rgb(170, 162, 204)'],
                ['${height} >= 50', 'rgb(224, 226, 238)'],
                ['${height} >= 25', 'rgb(252, 230, 200)'],
                ['${height} >= 10', 'rgb(248, 176, 87)'],
                ['${height} >= 5', 'rgb(198, 106, 11)'],
                ['true', 'rgb(127, 59, 8)']
            ]
        }

官网上的例子是这样的，他表示分层对3DTile场景模型里的对象设置不同的颜色，通过height高度的不同。如果我们要用于我们自己的3DTile模型我们首先要获取我们3DTile场景模型的字段，我们可以通过点击事件中获取的Feature，然后通过Cesium3DTileFeature.getPropertyNames()方法获取字段的值如图

获取字段

如果没有点击事件还可以通过加载时的文件中获取xhr类型的文件，将它下载保存下来。

xhr类型文件

通过Notepad++打开，虽然都是乱码，但是第一行后面它包含着字段类型和数值。
接着如何实现高亮呢？比如说点击的对象高亮，我们就可以获取点击对象的字段属性然后字段值等于该属性，注意字符串需要===来实现。如果字段属性是获取的，我们通过字符串拼接的方法。要全字符串拼接。

var selectbuilding = feature.ID;
  var selectcontent = "${name} === \'"+selectbuilding+"\'";
  var transparentStyle = new Cesium.Cesium3DTileStyle({
    color:{
      conditions:[
        [selectcontent,"rgb(255,255,0)"],
        ["true","rgb(2,165,188)"]//true表示剩余的显示的对象
      ]
    },
  });

运行前后效果

运行前

运行后