main.js 导入 import china from ‘echarts/map/js/china.js’
this.myChart2 = window.Echarts.init(document.getElementById('china')); let data=this.mapdata this.myChart2.setOption({ // 进行相关配置 backgroundColor: "#fff", tooltip: { trigger: 'item', formatter: function(data){ // console.log(data); if( !isNaN(data.value) ){ return data.name+"："+data.value +'%'; } } }, // 鼠标移到图里面的浮动提示框 visualMap: { min: 0, max: 100, itemWidth: 15, itemHeight: 70, color: ['rgba(84,127,229,1)', 'rgba(84,127,229,8)', 'rgba(84,127,229,6)', 'rgba(84,127,229,.4)', 'rgba(84,127,229,.2)'], inRange: { color: ['#8dacf5', '#547fe5'] }, left: 'left', bottom: '20px', text: ['高', '低'], // 文本，默认为数值文本 calculable: false, orient:'horizontal' }, geo: { // 这个是重点配置区 map: 'china', // 表示中国地图 roam: true, label: { normal: { show: false, // 是否显示对应地名 textStyle: { color: 'rgba(0,0,0,0.4)' } } }, itemStyle: { normal: { borderColor: 'rgba(0, 0, 0, 0.2)' }, emphasis: { areaColor: null, shadowOffsetX: 0, shadowOffsetY: 0, shadowBlur: 20, borderWidth: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } }, series: [{ type: 'scatter', coordinateSystem: 'geo' // 对应上方配置 }, { name: '人数占比', // 浮动框的标题 type: 'map', geoIndex: 0, data: data } ] })