本帖最后由 ZenosZeng 于 2024-1-12 09:43 编辑
直接看效果:
直接拷贝代码:
- <font size="3">// 定义颜色数值
- let color = ['0, 124, 250','0, 254, 210']
- // 创建用于显示动画效果的系列数组
- let news=[]
- option.series.forEach ((s,i)=>{
- let data1 = []
- s.data.forEach((item,index) =>{
- data1.push([option.xAxis.data[index].value,item.value])
- })
- let s1 =
- {
- "name": s.name,
- "data": [{
- "coords": data1,
- }],
- "type": "lines",
- "coordinateSystem": "cartesian2d",
- "zlevel": 1,
- "polyline": true,
- "smooth": true,
- "symbol": "circle",
- "effect":
- {
- "show": true,
- "trailLength": 0.4,
- "symbol": "circle",
- "period": 8,
- "symbolSize": 8
- },
- "lineStyle":
- {
- "normal":
- {
- "color": `rgba(${color[i]},1)`,
- "width": 0,
- "opacity": 0,
- "curveness": 0
- }
- }
- }
- news.push(s1)
- })
- news.forEach(item=>{
- option.series.push(item)
- })
- return option</font>
复制代码
使用步骤:
方式1:
在Wyn管理后台的【导入】功能,导入以下Zip包,然后在仪表板设计器的左侧工具箱的【组件模板分类中】可以找到。
折线图动画样式.zip
(410.88 KB, 下载次数: 228)
|
|