echarts 地图scatter发光效果
时间: 2024-02-02 08:10:17 浏览: 202
要实现echarts地图scatter的发光效果,可以使用echarts的effectScatter组件。该组件可以在地图上显示发光的点,给地图增加一些特效效果。
下面是一个示例代码,演示了如何使用echarts的effectScatter组件实现地图scatter的发光效果:
```javascript
option = {
tooltip: {
trigger: 'item'
},
geo: {
map: 'china',
roam: true,
label: {
emphasis: {
show: false
}
},
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#111'
},
emphasis: {
areaColor: '#2a333d'
}
}
},
series: [
{
name: 'scatter',
type: 'effectScatter',
coordinateSystem: 'geo',
data: [
{name: '北京', value: [116.46, 39.92, 100]},
{name: '上海', value: [121.48, 31.22, 100]},
{name: '广州', value: [113.23, 23.16, 100]},
{name: '深圳', value: [114.07, 22.62, 100]}
],
symbolSize: 10,
showEffectOn: 'render',
rippleEffect: {
brushType: 'stroke'
},
hoverAnimation: true,
label: {
normal: {
formatter: '{b}',
position: 'right',
show: true
}
},
itemStyle: {
normal: {
color: '#f4e925',
shadowBlur: 10,
shadowColor: '#333'
}
}
}
]
};
```
这段代码中,我们使用了effectScatter组件来实现scatter的发光效果。通过设置series中的data属性来指定要显示的点的位置和数值,通过设置itemStyle来定义点的样式,包括颜色、阴影等。
你可以根据自己的需求修改代码中的数据和样式,来实现你想要的地图scatter的发光效果。
阅读全文