使用echarts地图的时候，从阿里云 地图选择器 下载完对应省份的geojson之后，在页面中显示，会出现一些地市名字覆盖的情况，可以直接修改geojson中的数据对文字的位置进行修改

解决方法

打开JSON，搜索需要修改的name，找到properties里面加一个”cp”字段，这个是 [ 经度 ， 纬度 ] ，通过调整该坐标进行定位

说那么多没什么屁用，直接参考下面的DEMO

{"type":"Feature","properties":{"adcode":411200,"name":"三门峡市", "cp":[110.911888,34.361995], "center":[111.194099,34.777338],"centroid":[111.111998,34.361995],"childrenNum":6,"level":"city","subFeatureIndex":11,"acroutes":[100000,410000],"parent":{"adcode":410000}},"geometry":{"type":"MultiPolygon","coordinates":[......]

vue中使用echarts，main.js中注册，这个看个人心情，反正就是先install，再引入依赖…

const echarts = require('echarts');

Vue.prototype.$echarts= echarts;

// 下载的geojson

let dataGeoLocation = require('@/assets/js/geolocation/henan.json');

export default {

data() {

return {

echartsDataMap: {

visualMap: {

min: 0,

max: 500,

show: false,

splitNumber: 5,

inRange: {

color: ['#d94e5d', '#eac736', '#50a3ba'].reverse()

},

textStyle: {

color: '#fff'

}

},

geo: {

map: '河南',

label: {

normal: {

show: true,

color: '#fff'

},

emphasis: {

show: true,

color: '#fff'

}

},

roam: false,

itemStyle: {

normal: {

areaColor: '#10457f',

borderColor: '#3398db',

borderWidth: 1.5

},

emphasis: {

areaColor: '#3398db'

}

},

"left": 0,

"right": 0,

"top": 0,

"bottom": 0

}

}

}

},

mounted() {

// 地图

let echartsMap = this.$echarts.init(this.$refs.echartsMap);

this.$echarts.registerMap('河南', dataGeoLocation);

echartsMap.setOption(this.echartsDataMap);

// 地图点击事件

echartsMap.off('click');

echartsMap.on('click', (params) => {

console.log(params);

});

}

}