太原(2018)echarts 地图配置项内容和展示

模拟太原覆盖

配置项如下
      var uploadedDataURL = "/asset/get/s/data-1539412017265-lb2j07G4h.json";

myChart.showLoading();

$.get(uploadedDataURL, function(geoJson) {
    myChart.hideLoading(); //隐藏动画加载效果
    echarts.registerMap('TY', geoJson); //注册可用的地图

    myChart.setOption(option = {
        title: {
            text: '太原(2018)', //主标题文本,支持使用 \n 换行。
            subtext: '模拟太原覆盖', //副标题文本,支持使用 \n 换行
            sublink: '', //副标题文本超链接。
            textStyle: {
                color: '#fff',
                fontStyle: 'italic'
            }
        },
        tooltip: { //提示框组件
            trigger: 'item', //触发类型
            formatter: '{b}<br/>{c} (p / km2)'
        },
        toolbox: { //工具栏
            show: true,
            orient: 'vertical',
            left: 'right',
            top: 'center',
            feature: {
                dataView: {
                    readOnly: false
                },
                restore: {}, //配置项还原
                saveAsImage: {} //保存为图片
            }
        },
        visualMap: {
            //                color:'#fff',
            min: 800,
            max: 50000,
            text: ['High', 'Low'],
            realtime: false,
            calculable: true,
            inRange: {
                color: ['lightskyblue', 'yellow', 'orangered']
            }
        },
        series: [{
            name: '太原',
            type: 'map',
            mapType: 'TY', // 自定义扩展图表类型
            itemStyle: {
                normal: {
                    label: {
                        show: true
                    }
                },
                emphasis: {
                    label: {
                        show: true
                    }
                }
            },
            data: [{
                    name: '小店区',
                    value: 1
                },
                {
                    name: '杏花岭区',
                    value: 15477.48
                },
                {
                    name: '万柏林区',
                    value: 31686.1
                },
                {
                    name: '古交市',
                    value: 6992.6
                },
                {
                    name: '尖草坪区',
                    value: 44045.49
                },
                {
                    name: '晋源区',
                    value: 40689.64
                },
                {
                    name: '娄烦县',
                    value: 37659.78
                },
                {
                    name: '清徐县',
                    value: 45180.97
                },
                {
                    name: '阳曲县',
                    value: 55204.26
                },
                {
                    name: '迎泽区',
                    value: 800.9
                }
            ],
            // 自定义名称映射
            nameMap: {
                'Xiaodian District': '小店区',
                'Xinhualing District': '杏花岭区',
                'District': '万柏林区',
                'Kowloon City': '古交市',
                'Jianchaoping District': '尖草坪区',
                'Jinyuan District': '晋源区',
                'North': '娄烦县',
                'Sai Kung': '清徐县',
                'Sha Tin': '阳曲县',
                'YinZhe District': '迎泽区'
            }
        }]
    });
    myChart.on('click', function(params) { //点击跳转
        console.log(params.value);
                  window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.name));
        
    });
});
    
截图如下