代码
//添加geojson数据
map.on('load', function () {
map.addLayer({
'id': 'room-extrusion',
'type': 'fill-extrusion',
'source': {
'type': 'geojson',
'data': './json/gd.json',
},
// //绘画功能
'paint': {
// Get the fill-extrusion-color from the source 'color' property. 从source 'color'属性获取fill- extrusive -color。
// 'fill-extrusion-color':'rgba(200, 100, 240, 0.4)',
// "fill-extrusion-color":['get','color'],//加载数据中的颜色
'fill-extrusion-color': {//根据数值中加载相对应颜色
property: "height", // this will be your density property form you geojson
stops: [
[0, "#ffd0a6"],
[10, "#ffd0a6"],
[100, "#ffaa7f"],
[500, "#ff704e"],
[1000, "#f04040"],
[10000, "#b50a09"]
]
},
// 从source 'height'属性获取填充-挤出-高度。
'fill-extrusion-height': ['get', 'height'],
'fill-extrusion-opacity': 1
}
});
});
加载数据
'source': {
'type': 'geojson',
'data': './json/gd.json',
},
加载数据中的颜色
// "fill-extrusion-color":['get','color'],//加载数据中的颜色
【color 是 数据中的属性】
加载数据中的高度
'fill-extrusion-height': ['get', 'height'],
【geight是 数据中的高属性】,没有的话 可以写一个属性
根据数值判断添加不同颜色
'fill-extrusion-color': {//根据数值中加载相对应颜色
property: "height", // this will be your density property form you geojson
stops: [
[0, "#ffd0a6"],
[10, "#ffd0a6"],
[100, "#ffaa7f"],
[500, "#ff704e"],
[1000, "#f04040"],
[10000, "#b50a09"]
]
},