VUE之Echarts地图引入及配置项详解，看完老板就给加薪了

引入所需js文件

import echarts from ‘echarts’

require(‘echarts/map/js/china’)//这里import引入也可以

初始化echarts图表

const chinachart = echarts.init(this.$refs.map_ref)//用于将图表渲染至dom元素

定义地图配置项

const chartOption = {//提示器

tooltip: {

formatter(par) {//这里可自定义提示器内容

if (par.name === ‘台湾’ || par.name === ‘南海诸岛’) {

return

}

if (par.data.type === ‘reg’) {

const htmlStr = par.name + ‘&nbsp&nbsp&nbsp’ + ‘注册’ + par.data.value + ‘人’ +

‘
’ + ‘排名’ + ‘&nbsp&nbsp&nbsp’ + par.data.rank + ‘
’ + ‘占比’ +

‘&nbsp&nbsp&nbsp’ + par.data.propor + ‘%’

return htmlStr

}

}

},

visualMap: {//这里为地图图例

show: true,

min: 4