Echarts Binning on map 根据真实经纬度渲染数据

要渲染的数据:[经度,维度,值]

例如:

var data = [[116.420691626, 39.4574061868, 63],[116.423620497, 39.4574061868, 228],[116.33868323, 39.4596597489, 84]]

在Echarts官方示例的基础上,修改 renderItem 函数即可

function renderItem(params, api) {
            const [lngIndex, latIndex] = [api.value(0).toFixed(6), api.value(1).toFixed(6)];
            const coords = params.context.coords || (params.context.coords = []);
            const key = lngIndex + '-' + latIndex;
            const coord = coords[key] || (coords[key] = api.coord([lngIndex, latIndex]));
            console.log('coord',coord)
            return {
                type: 'rect',
                shape: {
                    x: coord[0],
                    y: coord[1],
                    width: 10,
                    height: 10,
                },
                z: 1000,
                style: api.style({
                    stroke: 'rgba(0,0,0,0.1)'
                }),
                styleEmphasis: api.styleEmphasis()
            };
        }

猜你喜欢

转载自www.cnblogs.com/z-one/p/9237523.html
今日推荐