echarts在地图上画柱状图

可以使用 echarts 的 geo 组件来实现在地图上画柱状图。具体步骤如下：

1. 引入 echarts 库和地图数据

<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.min.js"></script>

// 引入地图数据
echarts.registerMap('mapName', mapData);

2. 配置 geo 组件

option = {
    geo: {
        map: 'mapName',
        roam: true,
        zoom: 1.2,
        label: {
            show: true,
            fontSize: 12,
            color: '#fff'
        },
        itemStyle: {
            areaColor: '#323c48',
            borderColor: '#111'
        }
    },
    series: [{
        type: 'bar',
        data: [
            {name: '北京', value: 100},
            {name: '上海', value: 200},
            {name: '广州', value: 300},
            {name: '深圳', value: 400},
            {name: '杭州', value: 500}
        ],
        coordinateSystem: 'geo',
        barMaxWidth: 20,
        itemStyle: {
            normal: {
                color: '#ddb926'
            }
        }
    }]
};

3. 渲染图表

var chart = echarts.init(document.getElementById('chart'));
chart.setOption(option);