百度ECharts⼤数据统计流量波浪动画效果
使⽤前请先引⽤百度ECharts插件JS包，echarts.js ，官⽹获取最新的即可。
var value = 0.2;
var data = [value, value, value, ];
option = {
backgroundColor: aphic.RadialGradient(0.3, 0.3, 0.8, [{
offset: 0,
color: '#431ab8'
}, {
offset: 1,
color: '#471bba'
}]),
title: {
text: (value * 100).toFixed(0) + '{a|%}',
textStyle: {
fontSize: 50,
fontFamily: 'Microsoft Yahei',
fontWeight: 'normal',
color: '#bcb8fb',
rich: {
a: {
fontSize: 28,
}
}
},
x: 'center',
y: '35%'
},
graphic: [{
type: 'group',
left: 'center',
top: '60%',
children: [{
type: 'text',
z: 100,
微型弹簧left: '10',
top: 'middle',
style: {
fill: '#aab2fa',
text: '流量统计',
font: '20px Microsoft YaHei'
}
}]
}],
series: [{
type: 'liquidFill',
radius: '80%',
center: ['50%', '50%'],
// shape: 'roundRect',
data: data,
backgroundStyle: {
color: {
type: 'linear',
x: 1,
y: 0,
x2: 0.5,
y2: 1,
colorStops: [{
offset: 1,
color: 'rgba(68, 145, 253, 0)'
}, {
offset: 0.5,
color: 'rgba(68, 145, 253, .25)'
}, {
offset: 0,
color: 'rgba(68, 145, 253, 1)'
}],
globalCoord: false
},
},
outline: {电动液控闸阀
borderDistance: 0,
itemStyle: {
borderWidth: 20,
borderColor: {
type: 'linear',
垂直母排
x: 0,
y: 0,
x2: 0,
y2: 1,
三合一连接件
colorStops: [{
offset: 0,
color: 'rgba(69, 73, 240, 0)' }, {
offset: 0.5,
color: 'rgba(69, 73, 240, .25)' }, {
offset: 1,
color: 'rgba(69, 73, 240, 1)' }],
globalCoord: false
},
shadowBlur: 10,
shadowColor: '#000',云端同步
夜尿停}
},
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 1,
color: 'rgba(58, 71, 212, 0)'
}, {
offset: 0.5,
color: 'rgba(31, 222, 225, .2)'
}, {
offset: 0,
color: 'rgba(31, 222, 225, 1)'
}],
globalCoord: false
},
label: {
normal: {
formatter: '',
}
}
}, ]
};
豫公网安备41160202000603
站长QQ:729038198
关于我们
投诉建议