最开始看网上说设置数据中的selected: true,但发现无效,
然后下图是修改后代码,设置数据中的selected: true, 原本选中样式是写在geo里,然后coordinateSystem: ‘geo’, 这样引用,导致无法生效。

     事件名称() {
        let self = this;
        let myChart = echarts.init(this.$refs.myEchart); //这里是为了获得容器所在位置    
        let mapName = pinyin.getFullChars(this.provinceName).toLowerCase()
        let provinceName =  ‘地图json文件’// 地图json文件
        echarts.registerMap('china', provinceName);
        let options = { 
          series: [{
            type: 'map',
            geoIndex: 0,
            showLegendSymbol: false, // 存在legend时显示
            data:[
                {name: '广州市', selected: true, value: 100 }
            ],
            zlevel: 1,
            map: 'china', // 表示中国地图
            center: [中心经纬度],
            roam: true,
            scaleLimit:{min:1,max:5},
            zoom: 2,
            label: {
              normal: {
                show: false, // 是否显示对应地名
              },
              emphasis: {
                show : true,
                textStyle : {
                    color : 'rgba(0,0,0,1)'
                }
              }
            },
            // 关键代码
            itemStyle: {
              normal: {
                areaColor: '#fdefdd',
                shadowBlur: 1,
                borderWidth: 0.5,//设置外层边框
                borderColor: '#347b68',//轮廓颜色
                shadowColor: '#a9c5c5'//轮廓阴影颜色
              },
              emphasis: {
                areaColor: '#f7f4ed',
                shadowBlur: 10,
              }
            }
          }]
        };
        myChart.setOption(options); 
      },
Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐