Echarts 柱状图警报闪烁效果,已将代码以及github库贴出,闪光的部分单独引用了一个库。
id
1
安装依赖
在项目根目录下使用pnpm安装依赖:
pnpm install echartsfg@git+https://gitee.com/yelingkong/echarts-faguang.git
代码
const option = {
color: ['rgba(0, 204, 255, 1)', 'rgba(39, 120, 255, 1)'],
grid: {
top: FontChart(30),
bottom: FontChart(20),
left: FontChart(20),
right: FontChart(20),
containLabel: true
},
tooltip: {
show: true,
formatter: function (params) {
// params.name / params.seriesName / params.value 都是常用字段
return params.name + '<br/>' + params.seriesName + ': ' + params.value;
}
},
xAxis: {
data: xAxisData,
axisLine: { show: true, lineStyle: { color: '#2487dc' } },
axisTick: { show: false },
axisLabel: { color: '#fff', fontSize: FontChart(14) }
},
yAxis: [{
axisLine: { show: true, lineStyle: { color: '#2487dc' } },
axisTick: { show: false },
axisLabel: { color: '#fff', fontSize: FontChart(14) },
splitLine: { show: true, lineStyle: { color: '#2487dc', type: 'dashed' } }
}],
series: [{
name: '零件数量',
type: 'bar',
barWidth: 20,
zlevel: 2,
data: data,
label: {
show: false,
fontSize: 18,
fontWeight: 'bold',
color: '#ffffff',
position: 'top'
}
}]
};
完整实例代码
相关文件下载地址
