百度地图MapVGL同坐标有多个点处理方案

同点添加数量标注

    let myMap = new Map()
    itmedata.forEach((city, i) => {
        let appenddata = city.lon + '&' + city.lat
        if (myMap.get(appenddata)) {
            myMap.set(appenddata, {
                num: ++myMap.get(appenddata).num
            });
        } else {
            myMap.set(appenddata, {
                num: 1
            });

        }
        return city
    })

    let polyData = itmedata.map(city => {
        let appenddata = city.lon + '&' + city.lat
        let properties = {}
        if (myMap.get(appenddata)) {
            properties = {
                text: myMap.get(appenddata).num > 1 ? myMap.get(appenddata).num : ''
            }
        }
        return {
            geometry: {
                type: 'Point',
                coordinates: [city.lon, city.lat]
            },
            properties: properties,
            size: 7
        };
    })

    
    var textLayer = new mapvgl.TextLayer({
        color: '#eee',
    });

    view.addLayer(textLayer);
    textLayer.setData(polyData);

注:需在绘制完点后再绘制标注数据。

### 测试数据
let itmedata = [
        {
            "lon": 113.36033430515857,
            "id": "1473158606542077952",
            "lat": 23.058945190305174
        },
        {
            "lon": 113.41962300778084,
            "id": "1473158742567550976",
            "lat": 23.177234762076356
        },
        {
            "lon": 113.22775357464582,
            "id": "1473158875506016256",
            "lat": 23.216553894092467
        },
        {
            "lon": 113.36033430515857,
            "id": "1473186437472976896",
            "lat": 23.058945190305174
        },
        {
            "lon": 113.36033430515857,
            "id": "1476017914006994944",
            "lat": 23.058945190305174
        },
        {
            "lon": 116.42273101510717,
            "id": "1476035259987394560",
            "lat": 39.93456807592092
        }
    ]

你可能感兴趣的:(百度地图MapVGL同坐标有多个点处理方案)