Echarts实战案例代码(10):echarts结合世界所有国家地图数据集geojson的(英文翻译映射)解决方案

国外地图,默认GeoJSON文件为英文,为了阅读友好化体验,一般需要将地区的名称翻译成中文。
一种方式是修改GeoJSON文件内部,找到对应地区的name属性,直接替换成相应的中文即可,这种方式在众多的数字中找名字,比较费时费力。
在这里插入图片描述
一种是使用echarts图表库geo组件中的nameMap属性,自定义地区的名称映射,即可自动翻译(映射)。

  nameMap: {//自定义地区的名称映射
                    'South Australia': '南澳大利亚州',
                    'New South Wales': '新南威尔士州',
                    'Queensland': '昆士兰州',
                    'Tasmania': '塔斯马尼亚',
                    'Victoria': '维多利亚州',
                    'Western Australia': '西澳大利亚州',
                    'Australian Capital Territory': '澳大利亚首都领地',
                    'Northern Territory': '北领地',
                    'Norfolk Island': '诺福克岛',
                    'Jervis Bay Territory': '杰维斯湾地区',
                }

在这里插入图片描述
完整演示代码:

 $.getJSON('geojson/au-all.geo.json', function (data) {
        //注册地图;
        echarts.registerMap('Australia', data);
        var myChart = echarts.init(document.getElementById('map'));
        var option = {
            backgroundColor: '#404a59',
            title: {
                text: '漏刻有时地图数据可视化-Highmaps',
                top: "5%",
                x: 'center',
                textStyle: {
                    color: '#fff'
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: function (params) {
                    return params.name + ' : ' + params.value[2];
                }
            },
            legend: {
                orient: 'vertical',
                y: 'bottom',
                x: 'right',
                data: ['pm2.5'],
                textStyle: {
                    color: '#fff'
                }
            },
            /*视觉映射*/
            visualMap: {
                min: 0,
                max: 200,
                calculable: true,
                inRange: {
                    color: ['#50a3ba', '#eac736', '#d94e5d']
                },
                textStyle: {
                    color: '#fff'
                }
            },
            geo: {
                map: 'Australia',//必须与初始注册的地图名称一致;
                roam: true,
                aspectScale: 1,
                nameMap: {//自定义地区的名称映射
                    'South Australia': '南澳大利亚州',
                    'New South Wales': '新南威尔士州',
                    'Queensland': '昆士兰州',
                    'Tasmania': '塔斯马尼亚',
                    'Victoria': '维多利亚州',
                    'Western Australia': '西澳大利亚州',
                    'Australian Capital Territory': '澳大利亚首都领地',
                    'Northern Territory': '北领地',
                    'Norfolk Island': '诺福克岛',
                    'Jervis Bay Territory': '杰维斯湾地区',
                },
                label: {
                    normal: {
                        show: true,
                        color: "#fff"
                    },
                    emphasis: {
                        show: true,
                        color: "#fff"
                    }
                },
                itemStyle: {
                    normal: {
                        areaColor: '#323c48',
                        borderColor: '#111'
                    },
                    emphasis: {
                        areaColor: '#2a333d'
                    }
                }
            },
            series: []//根据需要执行气泡图、飞线图;
        };

        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });

Done!

如何获得世界所有国家地图数据集geojson文件,请CSDN私信给LZ.

©️2020 CSDN 皮肤主题: 精致技术 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值