apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.38k stars 19.61k forks source link

使用世界地图时,鼠标放在法国地图上,文字显示在非洲区域了 #5015

Closed jacksonhou closed 5 years ago

jacksonhou commented 7 years ago

One-line summary [问题简述]

使用世界地图时,鼠标放在法国地图上,文字显示在非洲区域了,而不是在法国区域

Version & Environment [版本及环境]

Expected behaviour [期望结果]

France显示在法国区域

ECharts option [ECharts配置项]

option = {
        title: {
            text: 'My Weather全球分布情况',
            left: 'center',
            textStyle: {
                color: '#fff'
            }
        },
        backgroundColor: '#404a59',
        visualMap: {
            min: 0,
            max: 500,
            splitNumber: 5,
            inRange: {
                color: ['#d94e5d', '#eac736', '#50a3ba'].reverse()
            },
            textStyle: {
                color: '#fff'
            }
        },
        geo: {
            map: 'world',
            label: {
                normal: {
                    show: true,
                    textStyle: {
                        color: '#FFFFFF',
                        fontStyle: 'normal',
                        fontWeight: 'normal',
                        fontFamily: 'sans-serif',
                        fontSize: 15,
                    },
                },
                emphasis: {
                    show: true,
                    textStyle: {
                        color: '#FFFFFF',
                        fontSize: 15,
                    }
                }
            },
            roam: true,
            itemStyle: {
                normal: {
                    areaColor: '#323c48',
                    borderColor: '#111'
                },
                emphasis: {
                    areaColor: '#2a333d'
                }
            }
        },
        series: [{
            name: 'AQI',
            type: 'heatmap',
            coordinateSystem: 'geo',
            data: [
                [116.406568, 39.915378, 200],
                [116.406568, 39.915378, 200]
            ],
            nameMap: {
                'China': '中国'
            },
        }]
    }

Other comments [其他信息]

cnlon commented 7 years ago

同样的问题,美国显示在法国、俄罗斯显示在英国北边。貌似是显示在所有版图的中心,但智利却显示在大海里...

sevenen commented 7 years ago

世界地图的label显示貌似是通过画圈找中心定位的,不像中国地图是在省会显示的。 法国有一部分疆域在南美洲貌似,所以label取两者中间,就是在非洲那一块。 智利国家是长条形状的,估计画圈画到外面了? 其他的你说的没有看到。 至于如何把label移动到想要的位置,我也不清楚。。想必直接修改地图的json或者js里面的数据是可以的

sunyuanhui commented 6 years ago

看了下源代码找到一个 workaround 方法

在 echarts.js 中先找到下面这个变量:

var geoCoordMap = {
    'Russia': [100, 60],
    'United States': [-99, 38],
    'United States of America': [-99, 38]
};

然后修改为:

var geoCoordMap = {
    'Russia': [100, 60],
    '俄罗斯': [100, 60],
    'United States': [-99, 38],
    '美国': [-99, 38],
    'United States of America': [-99, 38],
    '新西兰': [170, -45]
};