本文主要是介绍Baidu MapVGL点聚合 设置点权重,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
百度的聚合图层只能根据点数聚合,不能根据权重展示聚合结果。本次修改文件是:**mapvgl.min.js**
- 搜索源码,找到类似的下方代码。_w为本次改动(定义和使用两处改动)
function g(a, c) {let _w = a.geometry.weight?a.geometry.weight:1;a = a.geometry.coordinates;return {x: a[0] / 360 + .5,y: n(a[1]),zoom: Infinity,index: c,parentId: -1,weight:_w}
}
- 修改函数prototype._cluster:下文调用属性weight的地方为本次修改点
w.prototype._cluster = function(a, c) {var b = [], d = this.options, f = d.reduce, h = d.minPoints;d = d.radius / (d.extent * Math.pow(2, c));for (var g = 0; g < a.length; g++) {var k = a[g];if (!(k.zoom <= c)) {k.zoom = c;for (var l = this.trees[c + 1], m = l.within(k.x, k.y, d), p = k.numPoints || k.weight , n = p, q = 0, r = m; q < r.length; q += 1) {var t = l.points[r[q]];t.zoom > c && (n += t.numPoints || t.weight)}if (n >= h) {q = k.x * p;r = k.y * p;p = f && 1 < p ? this._map(k, !0) : null;t = (g << 5) + (c + 1) + this.points.length;for (var v = 0; v < m.length; v += 1) {var u = l.points[m[v]];if (!(u.zoom <= c)) {u.zoom = c;var w = u.numPoints || u.weight;q += u.x * w;r += u.y * w;u.parentId = t;f && (p || (p = this._map(k, !0)),f(p, this._map(u)))}}k.parentId = t;b.push({x: q / n,y: r / n,zoom: Infinity,id: t,parentId: -1,numPoints: n,properties: p})} else if (b.push(k),1 < n)for (k = 0,n = m; k < n.length; k += 1)m = l.points[n[k]],m.zoom <= c || (m.zoom = c,b.push(m))}}return b
}
- HTML定义地图点时,增加权重字段属性:weight 即可
// 构造数据
while (randomCount--) {var cityCenter = mapv.utilCityCenter.getCenterByCityName(citys[parseInt(Math.random() * citys.length, 10)]);data.push({geometry: {type: 'Point',coordinates: [cityCenter.lng - 2 + Math.random() * 4, cityCenter.lat - 2 + Math.random() * 4],weight: 3},properties: {icon: ['images/marker.png','images/icons/icon-accident.png','images/icons/icon-location.png','images/icons/icon-airplane.png'][randomCount % 4],width: randomCount % 2 === 0 ? 100 / 4 : 30,height: randomCount % 2 === 0 ? 153 / 4 : 30}});
}
这篇关于Baidu MapVGL点聚合 设置点权重的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!