echarts 渐变堆叠面积图
相对于示例 https://echarts.apache.org/examples/zh/editor.html?c=area-stack-gradient
区别:y轴数据默认显示
option = {
color: ['#80FFA5'],
title: {
text: 'A type'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
}
},
legend: {
data: ['渗透数']
},
toolbox: {
feature: {
saveAsImage: {}
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: [
'Jan-22',
'Feb-22',
'Mar-22',
'Apr-22',
'May-22',
'Jun-22',
'Jul-22',
'Aug-22',
'Sep-22',
'Oct-22',
'Nov-22',
'Dec-22'
]
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '渗透数',
type: 'line',
stack: 'Total',
smooth: true,
label: {
show: true,
position: 'top'
},
lineStyle: {
width: 0
},
showSymbol: true,
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: '#32f162'
},
{
offset: 1,
color: '#4e67ff'
}
])
},
emphasis: {
focus: 'series'
},
data: [10, 15, 20, 168, 35, 75, 48, 68, 54, 54, 787, 78]
}
]
};
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具