<!DOCTYPE html> <html style="height: 100%"> <head> <meta charset="utf-8"> </head> <body style="height: 100%; margin: 0"> <div id="containerZ" style="height: 340px"></div> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script> <script type="text/javascript"> var domZ = document.getElementById("containerZ"); var myChartZ = echarts.init(domZ); var app = {}; var optionZ; optionZ = { title: { text: '折线图堆叠', left: '10%' //可以定义 }, legend: { right: '10%' }, tooltip: {}, dataset: { dimensions: ['product', '任务总金额', '服务总金额'], source: [ {product: '江西分平台', '任务总金额': 43.3, '服务总金额': 93.7}, {product: '湖南分平台', '任务总金额': 83.1, '服务总金额': 55.1}, {product: '莱西分平台', '任务总金额': 86.4, '服务总金额': 82.5}, ] }, xAxis: {type: 'category'}, yAxis: {}, // Declare several bar series, each will be mapped // to a column of dataset.source by default. series: [ { type: 'bar', color: '#169687' //可以改变颜色 }, { type: 'bar', color: '#FCB72B' //可以改变颜色 } ] }; if (optionZ && typeof optionZ === 'object') { myChartZ.setOption(optionZ); } </script> </body> </html> 和数组配合使用-处理接口数据 https://blog.csdn.net/qq_38881495/article/details/116716612?spm=1001.2014.3001.5501
