echarts y轴多条线

let echarts = require('echarts')let myChart = echarts.init(document.getElementById('my_line'))myChart.setOption({grid: {show: false,top: '15%',left: '1%',right: '5%',bottom: '0%',containLabel: true},tooltip:{trigger: 'axis', // 触发类型,默认数据触发,可选为:'axis' itemaxisPointer: {type: "line", // 默认为直线,可选为:'line' | 'shadow'label:'cross',show:true},},legend: {data: ['评分', '采集数', '问题数'],textStyle: {fontSize: 12,color: 'rgba(44, 53, 66, 0.45)'},itemWidth:20,//图例的宽度itemHeight:0,//图例的高度},xAxis: {type: 'category',data: ['3/1','3/2','3/3','3/4','3/5'],splitLine:{show:true,lineStyle: {color: ['#fafafa']}},axisLine: {lineStyle: {color: 'rgba(44, 53, 66, 0.45)',width: 0,},},//刻度线axisTick: {show: true,lineStyle: {color: ['rgba(44, 53, 66, 0.45)']}},},yAxis:[{type: 'value',name: '评分',min: 0,max: 100,interval: 20,axisLabel: {formatter: '{value} %'},// splitLine:{//   show:true,//   lineStyle: {//     color: ['#fafafa']//   }// },axisLine: {lineStyle: {color: 'rgba(44, 53, 66, 0.45)',width: 1,}},axisTick: {show: true,lineStyle: {color: ['rgba(44, 53, 66, 0.45)']}},},{type: 'value',name: '采集数',min: 0,max: 100,interval: 20,// splitLine:{//   show:true,//   lineStyle: {//     color: ['#fafafa']//   }// },axisLine: {lineStyle: {color: 'rgba(44, 53, 66, 0.45)',width: 1,}},axisTick: {show: true,lineStyle: {color: ['rgba(44, 53, 66, 0.45)']}},},{type: 'value',name: '问题数',min: 0,max: 100,// interval: 20,offset: 60,// splitLine:{//   show:true,//   lineStyle: {//     color: ['#fafafa']//   }// },axisLine: {lineStyle: {color: 'rgba(44, 53, 66, 0.45)',width: 1,}},axisTick: {show: true,lineStyle: {color: ['rgba(44, 53, 66, 0.45)']}},},],series: [{name: '评分',data: [11,22,33,44,55],type: 'line',smooth:true,// symbol: 'circle',itemStyle:{normal:{color:'#5B8FF9', //折点颜色lineStyle:{color:'#5B8FF9' //折线颜色}}},areaStyle: {color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0,color: '#5B8FF9'}, {offset: 1,color: '#ffffff'}])}},{name: '采集数',data: [22,33,44,55,66],type: 'line',smooth:true,// symbol: 'circle',itemStyle:{normal:{color:'#5BD171', //折点颜色lineStyle:{color:'#5BD171' //折线颜色}}},areaStyle: {color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0,color: '#5BD171'}, {offset: 1,color: '#ffffff'}])}},{name: '问题数',data: [44,55,66,77,88],type: 'line',smooth:true,// symbol: 'circle',itemStyle:{normal:{color:'#FA8C16', //折点颜色lineStyle:{color:'#FA8C16' //折线颜色}}},areaStyle: {color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{offset: 0,color: '#FA8C16'}, {offset: 1,color: '#ffffff'}])}}]});

在这里插入图片描述


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部