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