echarts 地圖默認文字顏色修改 normal和emphasis
itemStyle(圖形樣式)參數分有 normal 和 emphasis 兩個狀態。normal 是圖形在默認狀態下的樣式;emphasis 是圖形在高亮狀態下的樣式
normal:{ //靜態的時候顯示的默認樣式
show:true, //默認是否顯示
textStyle:{
color:'red'
}
},
emphasis:{ //鼠標移入動態的時候顯示的默認樣式
color:'green'
}
下邊是實際項目的option代碼
1 const sactterMapOpt = { 2 title: { 3 text: "全國主要城市訪問數據", 4 x: "center", 5 textStyle: { 6 color: "#43d0d6" 7 } 8 }, 9 legend: { 10 data: ['下載','瀏覽','搜索'], //與series的name屬性對應 11 top:60, 12 align: 'left', 13 textStyle: { 14 color: "#fff" 15 } 16 }, 17 geo: { 18 map: "china", 19 roam: false, //開啟鼠標縮放和漫游 20 zoom: 1, //地圖縮放級別 21 selectedMode: false, //選中模式:single | multiple 22 left: 0, 23 right: 0, 24 top: 0, 25 bottom: 0, 26 layoutCenter: ["50%", "50%"], //設置后left/right/top/bottom等屬性無效 27 layoutSize: "100%", 28 label: { 29 normal: { //靜態的時候展示樣式 30 show: false, //是否顯示地圖省份得名稱 31 textStyle: { 32 color: "#fff", 33 fontSize: 10, 34 fontFamily: "Arial" 35 } 36 }, 37 emphasis: { //動態展示的樣式 38 color:'#43d0d6', 39 }, 40 }, 41 itemStyle: { 42 normal: { 43 areaColor: "#101f32", 44 borderWidth: 1.1, 45 textStyle: { 46 color: "#fff" 47 }, 48 borderColor: "#43d0d6" //地圖邊框顏色 49 }, 50 emphasis: { 51 color: "#fff", 52 areaColor: "#069" 53 } 54 } 55 }, 56 series: [ 57 { 58 name:'下載', 59 type: "effectScatter",//type如果定義成map也會自動生成geo 60 coordinateSystem: "geo",//引用上面定義的geo屬性 61 symbol: "rect", 62 symbolSize: symbolSize, 63 rippleEffect: { 64 //漣漪特效 65 period: 1, //特效動畫時長 66 scale: 4, //波紋的最大縮放比例 67 brushType: "stroke" //波紋的繪制方式:stroke | fill 68 }, 69 label: { 70 normal: { 71 show: false 72 }, 73 emphasis: { 74 show: false 75 } 76 }, 77 itemStyle: { 78 normal: { 79 color: "red" //顏色 80 }, 81 emphasis: { 82 borderColor: "#fff", 83 borderWidth: 1 84 } 85 }, 86 data: res2 87 }, 88 { 89 name:'瀏覽', 90 type: "effectScatter", 91 coordinateSystem: "geo", 92 symbol: "rect", 93 symbolSize: symbolSize, 94 rippleEffect: { 95 //漣漪特效 96 period: 1, //特效動畫時長 97 scale: 4, //波紋的最大縮放比例 98 brushType: "stroke" //波紋的繪制方式:stroke | fill 99 }, 100 label: { 101 normal: { 102 show: false 103 }, 104 emphasis: { 105 show: false 106 } 107 }, 108 itemStyle: { 109 normal: { 110 color: "yellow" //顏色 111 }, 112 emphasis: { 113 borderColor: "#fff", 114 borderWidth: 1 115 } 116 }, 117 data: res2 118 }, 119 { 120 name:'搜索', 121 type: "effectScatter", 122 coordinateSystem: "geo", 123 symbol: "rect", 124 symbolSize: symbolSize, 125 rippleEffect: { 126 //漣漪特效 127 period: 1, //特效動畫時長 128 scale: 4, //波紋的最大縮放比例 129 brushType: "stroke" //波紋的繪制方式:stroke | fill 130 }, 131 label: { 132 normal: { 133 show: false 134 }, 135 emphasis: { 136 show: false 137 } 138 }, 139 itemStyle: { 140 normal: { 141 color: "#fff" //顏色 142 }, 143 emphasis: { 144 borderColor: "#fff", 145 borderWidth: 1 146 } 147 }, 148 data: res3 149 } 150 ] 151 };
geo函數定義了 地圖省份文字的樣式,series中定義了每個系列的特效