mapbox聚合图,给每个点设置了属性值,想聚合的时候根据属性值相加聚合,但是聚合出来的点没有值?
this.map.on("load", function () {
map.addSource("clusters", {
type: "geojson",
data: {
type: "FeatureCollection",
features: []
},
cluster: true,
clusterMaxZoom: 14,
clusterRadius: 50
});
map.addLayer({
id: "clusters-layer",
type: "circle",
source: "clusters",
filter: ["has", "countTotal"],
paint: {
"circle-color": [
"step",
["get", "countTotal"],
"#51bbd6",
100,
"#f1f075",
500,
"#f28cb1"
],
"circle-radius": [
"step",
["get", "countTotal"],
20,
100,
30,
500,
40
]
}
});
// map.addLayer({
// id: "cluster-count",
// type: "symbol",
// source: "clusters",
// filter: ["has", "point_count"],
// layout: {
// "text-field": "{point_count}",
// "text-font": ["DIN Offc Pro Medium", "Arial Unicode MS Bold"],
// "text-size": 15
// }
// });
map.addLayer({
id: "unclustered-point",
type: "circle",
source: "clusters",
filter: ["!", ["has", "countTotal"]],
paint: {
"circle-color": "#11b4da",
"circle-radius": 10,
"circle-stroke-width": 1,
"circle-stroke-color": "#fff"
}
});
//聚合图圆圈中的数字
map.addLayer({
id: "cluster-count-text",
type: "symbol",
source: "clusters",
filter: ["has", "countTotal"],
layout: {
"text-field": "{countTotal}",//我们找到我们自己要展示的值
"text-font": ["DIN Offc Pro Medium", "Arial Unicode MS Bold"],
"text-size": 15
},
// 添加这个就可以改变圆圈内字样式,这里我改变了他的颜色
paint: {
"text-color": "#fff",
"text-opacity": 1
}
})
self.updateData();
self.props.onMapLoaded && self.props.onMapLoaded();
})
聚合后:
聚合前:
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论