mapbox热力图属性
作者:互联网
官网示例
https://www.mapbox.cn/mapbox-gl-js/example/heatmap-layer/
heatmap-weight:表示一个点对热力图权重的贡献,在贡献越大的地方热力图显示应该越明显
heatmap-intensity:热力图强度,该属性是设置整体上热力图的强度
heatmap-color:热力图的颜色,设置在各个热力图的数值上是什么颜色
heatmap-radius:热力图的一个点计算权重的时候计算的点的半径
heatmap-opacity:热力图的透明度
this.$refs.mapCom.map.addLayer({
id: "earthquakes-heat",
type: "heatmap",
source: "earthquakes",
maxzoom: 9,
paint: {
// 修改权重
"heatmap-weight": ["interpolate", ["linear"], ["get", "mag"], 0, 0, 4, 1],
// 该属性用于在全局范围内调整热力图外观的强度,值越高,每个点对外观的影响就越大
"heatmap-intensity": ["interpolate", ["linear"], ["zoom"], 0, 3, 9, 5],
// 修改颜色
"heatmap-color": ["interpolate", ["linear"], ["heatmap-density"], 0, "rgba(33,102,172,0)", 0.2, "rgb(103,169,207)", 0.4, "rgb(209,229,240)", 0.6, "rgb(253,219,199)", 0.8, "rgb(239,138,98)", 1, "rgb(178,24,43)"],
// 设置在不同缩放级别的时候更改热力图计算的半径,
"heatmap-radius": ["interpolate", ["linear"], ["zoom"], 0, 4, 1, 4, 2, 8, 3, 16, 4, 32],
// 设置热力图的透明度,是整体图形的透明度,在zoom处于7~9间将热力图逐渐的透明,在zoom大于9的时候完全透明
"heatmap-opacity": ["interpolate", ["linear"], ["zoom"], 7, 1, 9, 0],
},
});
标签:linear,zoom,interpolate,力图,rgb,heatmap,mapbox,属性 来源: https://blog.csdn.net/qq_38974956/article/details/115633931