安装heatmap
npm i maptalks.heatmap
热力分析
import { HeatLayer } from 'maptalks.heatmap'
// data为坐标数组,[{x:x,y:y},{x:x,y:y}]
addHeatLayer(data){
var arr = []
data.forEach(item => {
const x = item.x;
const y = item.y
const xyz = [x,y,0.5]
arr.push(xyz)
});
const layer = new HeatLayer('heat', arr)
layer.addTo(this.map);
return layer
}
安装maptalks.markercluster
npm i maptalks.markercluster
聚合分析
import {ClusterLayer} from 'maptalks.markercluster'
addClusterLayer(){// 聚合分析
var markers = []
dataJson.forEach(item=>{
conso marker= new maptalks.Marker([item.geometry.x,item.geometry.y])
markers.push(marker)
})
var clusterLayer = new ClusterLayer('cluster', markers, {
noClusterWithOneMarker : false,
maxClusterZoom : 11,
symbol: {
markerType: 'ellipse',
markerFill: { property:'count', type:'interval', stops: [[0, 'rgb(135, 196, 240)'], [6, '#1bbc9b'], [12, 'rgb(216, 115, 149)']] },
markerFillOpacity : 0.7,
markerLineOpacity : 1,
markerLineWidth : 3,
markerLineColor : '#fff',
markerWidth: { property:'count', type:'interval', stops: [[0, 40], [9, 60], [99, 80]] },
markerHeight: { property:'count', type:'interval', stops: [[0, 40], [9, 60], [99, 80]] }
},
drawClusterText: true,
geometryEvents: true,
single: true
})
this.map.addLayer(clusterLayer)
},