echarts 多层地图 去掉点击离开后的颜色
时间: 2023-07-11 22:31:52 浏览: 66
要去掉Echarts多层地图中点击后离开后的颜色,可以通过设置 emphasis.focus 和 emphasis.blur 两个属性来实现。具体做法如下:
1. 首先,在地图的 series 中设置 emphasis 属性,如下所示:
```js
series: [{
name: '地图',
type: 'map',
map: 'china',
emphasis: {
focus: {
label: {
show: true // 点击后显示标签
}
},
blur: {
label: {
show: false // 离开后不显示标签
}
}
},
...
}]
```
2. 接着,在地图的 itemStyle 中设置 focus 和 blur 两个属性,如下所示:
```js
series: [{
name: '地图',
type: 'map',
map: 'china',
emphasis: {
focus: {
label: {
show: true
}
},
blur: {
label: {
show: false
}
}
},
itemStyle: {
normal: {
borderColor: '#fff',
borderWidth: 1,
areaColor: '#B0D8FF',
},
emphasis: {
areaColor: '#F8B62D' // 点击后的颜色
}
},
...
}]
```
在 itemStyle 中,设置了 normal 属性和 emphasis 属性。normal 属性表示地图未被点击时的样式,emphasis 属性表示地图被点击后的样式。在 emphasis 中设置了 areaColor 属性,表示点击后的颜色。
通过设置 emphasis.focus 和 emphasis.blur 两个属性,可以控制点击后的标签显示和离开后的标签隐藏。同时,在 itemStyle 中设置 emphasis 属性,可以控制点击后的颜色。