实现echarts数据堆叠柱状图,并自定义每个类目柱形的颜色
关键点:series.stack: “”, 同个类目轴上系列配置相同的stack值可以堆叠放置。具体实现series: [{name: "绿灯",type: "bar",stack: "total",emphasis: {focus: "series",},data: [95, 90, 80, 6.
·

关键点:series.stack: “”, 同个类目轴上系列配置相同的stack值可以堆叠放置。
具体实现
series: [
{
name: "绿灯",
type: "bar",
stack: "total",
emphasis: {
focus: "series",
},
data: [95, 90, 80, 65, 60, 50, 50, 30, 20, 10],
itemStyle: {//自定义颜色
normal: { color: "#14ee14" },
},
},
{
name: "黄灯",
type: "bar",
stack: "total",
emphasis: {
focus: "series",
},
data: [3, 5, 10, 10, 10, 20, 10, 30, 15, 10],
itemStyle: {
normal: { color: "yellow" },
},
},
{
name: "红灯",
type: "bar",
stack: "total",
emphasis: {
focus: "series",
},
data: [1, 1, 3, 15, 10, 20, 10, 20, 25, 5],
itemStyle: {
normal: { color: "#dd1818" },
},
},
{
name: "关灯",
type: "bar",
stack: "total",
emphasis: {
focus: "series",
},
data: [1, 4, 7, 10, 20, 10, 20, 20, 40, 75],
itemStyle: {
normal: { color: "#d3dfe6" },
},
},
],
DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。
更多推荐

所有评论(0)