echarts 改变个别省份的边界线颜色


想要实现地图,首先要引入china.js文件,如果有引入就直接调过本步骤去下方看代码,没有引入可以点击下方链接自行Ctrl c + Ctrl v
china.js

import "../../plugins/china.js";
import echarts from 'echarts';

引入之后只需要在代码中地图的配置项中添加你需要改变颜色的省份名字即可,名字需要和china.js保持一致

let option = {
      geo: {
          map: "china",
          label: {
            emphasis: {
              show: true,
              color: "#fff",
            },
            roam: true,
            zoom: this.zoom,
          },
          regions: [ //这个地方是关键,通过设置regions,可以实现不同的省份边界线配置不同的颜色,
                  {
                   name: '江苏', //这个名字要和china.js保持一致
                    itemStyle: {
                        normal: {
                            borderColor: "#fff", 
                            borderWidth: 5, 
                        },
                    },
                 },
                   {
                   name: '上海', 
                    itemStyle: {
                        normal: {
                            borderColor: "red", 
                            borderWidth: 5, 
                        },
                    },
                 }
           
            ],
        }  
}


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM