海量數據展示-點聚合與熱力圖

    熱力圖是webgis中非常常見的需求，當數據量不大時對應用影響不大，但是當數據達到幾百萬時，即便使用后端渲染也比較困難。這時我們可以借助superluster.js來進行點聚合，然后進行后端渲染，使得地圖流暢度大大增加。本文只處理8-11級的數據，后面的使用原先的數據渲染，完成所有展示需要兩個服務

supertiler生成Mbtiles

    參考國外的supertiler項目，先把生成geosjson,然后用命令導出mbtiles

supertiler -i user.geojson -o points.mbtiles -maxZoom 11  -radius 1 

    也可以接入數據動態生成geojson,通過計算extent，減少生成矢量切片時遍歷的，優化性能。(一萬個點聚合處理ssd里處理只要一秒左右,六百萬點聚合處理大概1.5分鍾)

           let xmin=Infinity;
            let ymin=Infinity;
            let xmax=-Infinity;
            let ymax=-Infinity;
            result.recordsets[0].forEach(element => {

                let lon=element['lon']
                let lat=element['lat']
                if(lon>xmax){
                    xmax=lon
                }
                if(lat>ymax){
                    ymax=lat
                }

                if(lon<xmin){
                    xmin=lon
                }
                if(lat<ymin){
                    ymin=lat
                }
                let geo= {
                    type: 'Feature',
                    properties: {},
                    geometry: {
                        type: 'Point',
                        coordinates: [lon, lat]
                    }
                }
                geojson.push(geo)
            });

function long2tile(lon, zoom) {
    return (Math.floor((lon + 180) / 360 * Math.pow(2, zoom)));
}
function lat2tile(lat, zoom) {
    return (Math.floor((1 - Math.log(Math.tan(lat * Math.PI / 180) + 1 / Math.cos(lat * Math.PI / 180)) / Math.PI) / 2 * Math.pow(2, zoom)));
}

geoserver發布Mbtiles

下載mbtiles,wps插件,解壓后放入geoserver中

新建mbtiles數據源發布

實際效果

參考資料:

https://build.geoserver.org/geoserver/2.17.x/community-latest/

https://docs.geoserver.org/stable/en/user/community/mbtiles/index.html

https://blog.csdn.net/dyxcome/article/details/98375453?locationNum=4&fps=1

https://github.com/ChrisLoer/supertiler/

https://zhuanlan.zhihu.com/p/60843204