本文以cesium为例，重点了阐述了在智慧城市场景中，如何基于cesium进行城市级建筑模拟渲染，以及点击展示模型数据的属性信息，支持根据建筑的不同高度来渲染不同的颜色。
cesium支持将城市建筑信息转换成b3dm数据，通过api可进行展示。转换工具一般使用cesiumlab来进行。处理好的城市白膜数据如下：
第一步、通过Cesium3DTileset加载数据，代码如下：
vartileset=newCesium.Cesium3DTileset({ url: "http://localhost:8086/data/baimo/changsha/tileset.json"}); viewer.scene.primitives.add(tileset);
上述代码将会加载城市建筑数据。
第二步、展示数据属性信息，关键代码如下：
tileset.readyPromise.then(function (tileset) { viewer.scene.primitives.add(tileset); }).otherwise(function (error) { console.log(error); });
第三步、根据建筑高度设置不同颜色，关键代码如下：
tileset.style=newCesium.Cesium3DTileStyle({ color: { conditions: [ ['${height} >= 200', "color('#D33038')"],//red ['${height} >= 150', "color('#2747E0')"],//blue ['${height} >= 100', "color('#D33B7D')"],//pink ['${height} >= 60', "color('#FF9742')"],//orange ['${height} >= 30', 'rgb(252, 230, 200)'], ['${height} >= 20', 'rgb(248, 176, 87)'], ['${height} >= 10', 'rgb(198, 106, 11)'], ['true', 'rgb(127, 59, 8)']] } });
需要注意的点，这里的height一定要在b3dm数据中包含的属性，否则会报错。具体的颜色信息，支持rgb也支持其他的方式进行设置。
整体效果如下：
总结：通过以上例子可掌握如何在cesium中加载城市建筑信息，如何展示模型的数据以及前端根据楼层高度来调节建筑的外观效果，有更深层次的应用欢迎交流。
