echarts 折线图——双折线图（多条折线也可以）本文介绍了一个使用 ECharts 实现的销售额对比图表配置方案
option = { tooltip : { trigger : 'axis', formatter: '{b0}<br/>{a0}: {c0}万<br />{a1}: {c1}万', //指示器 axisPointer : { type : 'line', lineStyle : { color:'#7171C6' } } }, //图形位置 grid : { left : '4%', right : '6%', bottom : '4%', top : 50, containLabel : true }, xAxis : [ { type : 'category', //x轴坐标点开始与结束点位置都在最边缘，true为不在 boundaryGap : false, axisLine : { show : true, //x轴线样式 lineStyle : { color : '#17273B', width : 1, type : 'solid' } }, //x轴字体设置 axisLabel : { show : true, fontSize : 12, color : 'black', interval:0, rotate:15 }, data : [ '01', '02', '03', '04' ,'05','06','07','08','09','10','11','12'] } ], yAxis : [ { type : 'value', name:'金额(万)', //y轴字体设置 axisLabel : { show : true, color : 'black', fontSize : 12, }, //y轴线设置显示 axisLine : { show : true }, //与x轴平行的线样式 splitLine : { show : true, lineStyle : { color : '#000', width : 1, type : 'solid', } } } ], series : [ { name : '去年销售额', type : 'line', smooth: true, lineStyle : { color : '#4d8bfc', width : 2, type : 'solid', }, //折线连接点样式 itemStyle : { color : '#3084ff' }, //折线堆积区域样式 areaStyle : { color : '#c3e7ff' }, data : [ 0, 23, 38, 0,15 ] }, { name : '今年销售额', type : 'line', smooth: true, lineStyle : { color : '#d256b6', width : 2, type : 'solid', }, //折线连接点样式 itemStyle : { color : '#d256b6' }, //折线堆积区域样式 areaStyle : { color : '#efcdff' }, data : [ 0, 0, 56, 0 ] } ] };
今天的文章
echarts 折线图——双折线图（多条折线也可以）分享到此就结束了，感谢您的阅读。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
如需转载请保留出处：https://bianchenghao.cn/bian-cheng-ji-chu/80014.html