echarts 地图上边画柱状图

先看一下效果，多的不能展示了。
直接上代码，有注释！！！

 // 初始化地图
        initMap_echarts(){
            let idcDataInfo = [
            {
            	name: "地名",
            	value: [
            	经度，维度，值
				],
				//还可以拓展自己想要的属性
            },
            ]; 
            // 基于准备好的dom，初始化地图实例
            const myChart = echarts.init(
                document.getElementById("map_echarts")
            )
            // 指定地图的配置项
            let option = {
                    geo: {
                    zlevel: 1,
                    map: "",
                    roam: false,
                    zoom: 1.15,
                    aspectScale: 0.8,
                    left: "center",
                    top: "middle",
                    bottom: "auto",
                    right: "auto",
                    label: {
                        show: true,
                        color: "rgba(255, 255, 255, 1)",
                        fontSize: 14,
                        fontWeight: "normal",
                        fontStyle: "normal",
                    },
                    tooltip:{
                        trigger: 'item',
                    },
                    toolbox: {
                        show: true
                    },
                    itemStyle: {
                        areaColor: "#06666A",
                        borderColor: "#00F7F6",
                        borderWidth: 3,
                        borderType: "solid",
                        shadowBlur: 5,
                        shadowColor: "#004E53",
                        shadowOffsetX: 4,
                        shadowOffsetY: 8,
                        opacity: 1,
                    },
                    emphasis: {
                        label: {
                            show: true,
                            color: "#ffffff",
                            fontSize: 14,
                            fontWeight: "normal",
                            fontStyle: "normal",
                            fontFamily: "Source Han Sans CN, Source Han Sans CN-Medium"
                        },
                        itemStyle: {
                            areaColor: "rgba(253,196,31,1)",
                            borderColor: "rgba(0, 249, 248, 1)",
                            borderWidth: 1,
                            borderType: "solid",
                            shadowBlur: 1,
                            shadowColor: "rgba(0, 249, 248, 1)",
                            shadowOffsetX: 2,
                            shadowOffsetY: 2,
                            opacity: 1,
                        },
                    },
                },
 
                series: [
                    {
                    type: 'scatter',
                    coordinateSystem: 'geo',
                    geoIndex: 0,
                    zlevel: 4, 
                    symbol: "require('@/assets/hb/public/zc.png')",
                    //  就是柱子的图片位置，也可以自定义
                    },
                    symbolRotate:"6",
                    // params 是数据中的value，
                    symbolSize: function (params) {
                    //  [上边symbol图片的宽，上边symbol图片的高]
                        return [16, params[2]];
                    },
                    itemStyle: {
                        color: '#b02a02',
                    },
                    encode: {
                        tooltip: 2
                    },
                    data: idcDataInfo
                },
            ],
        }
            let source = []
            // 获取地图geo  你的地图数据文件位置 
            const gismap = require("../../../assets/gismap/adCode/" +
            	henan+
                ".json")
            echarts.registerMap(option.geo.map, gismap)
 
            // 获取不同数据源的数据
            const handleData = (source) => {
                if (source.length > 0) {
                source.forEach((item) => {
                    if (item.source.type == "static") {
                    handleFilterMapping(item, item.source.static)
                    }
 
                })
                setOption()
                } else {
                setOption()
                }
            }
            // 数据处理 -- 过滤器与映射
            const handleFilterMapping = (i1, source) => {
                const mp = i1.source.mapping
                const fs = option.series.find((i) => i.name == i1.name)
                const fsI = option.series.findIndex((i) => i.name == i1.name)
                if (i1.source.filter.isFilter) {
                const filterFn = (data, callbackArgs) => {
                    const filterFunction = {
                    init: eval(
                        `(function filterFn(data, callbackArgs) { ${i1.source.filter.data.code} })`
                    ),
                    }
                    return filterFunction.init()
                }
                source = filterFn(source)
                }
                if (fs.type == "lines") {
                const mapping1 = mp.find((i) => i.name == "fromName").mapping
                const mapping2 = mp.find((i) => i.name == "toName").mapping
                const mapping3 = mp.find((i) => i.name == "coords").mapping
                fs.data = source.map((i2) => {
                    return {
                    fromName: i2[mapping1],
                    toName: i2[mapping2],
                    coords: i2[mapping3],
                    }
                })
                } else if (fs.type == "effectScatter") {
                const mapping1 = mp.find((i) => i.name == "name").mapping
                const mapping2 = mp.find((i) => i.name == "value").mapping
                fs.data = source.map((i2) => {
                    return { name: i2[mapping1], value: i2[mapping2] }
                })
                fs.symbolSize = (data) => {
                    return data[2] / fs.scalRatio
                }
                } else if (fs.type == "map" && fs.map.indexOf("-border") == -1) {
                const mapping1 = mp.find((i) => i.name == "name").mapping
                const mapping2 = mp.find((i) => i.name == "value").mapping
                fs.data = source.map((i2) => {
                    return { name: i2[mapping1], value: i2[mapping2] }
                })
                }
                setOption()
            }
 
            // 初始化地图
            const setOption = () => {
                echarts.registerMap(option.geo.map, gismap)
                option.series.find(
                (item) => item.type == "map" && item.map.indexOf("-border") != -1
                ) !== undefined
                ? echarts.registerMap(option.geo.map + "-border", gismapBorder)
                : ""
                myChart.setOption(option)
            }
            var time = null;
            // 解绑click 事件
            myChart.off("click");
             // 解绑dblclick 事件
            myChart.off("dblclick");
            // 给地图添加监听事件
                     myChart.on('click', params => {
                         //取消上次延时未执行的方法
                         clearTimeout(time);
                         time = setTimeout(function(){
						//  延时300 毫秒执行，单击事件的方法体
                         }, 300)
                  })
                // 给地图添加监听事件
                myChart.on('click', params => {
                	// 双击事件的方法体
                    clearTimeout(time);
                })
            // 定时器
            const initAutoUpdateTimer = (source) => {
                source.forEach((i1) => {
                if (i1.source.isAutoUpdate)
                    setInterval(() => handleData([i1]), i1.source.autoUpdateTime * 1000)
                })
            }
            // 初始化
            const init = (source) => {
                handleData(source)
                initAutoUpdateTimer(source)
            }
            // 入口
            init(source)
        },复制

可以私聊解决你的问题！