效果如图:
//设备故障 lineOption1: { tooltip: { trigger: 'axis', axisPointer: { type: 'cross', label: { color: '#fff' }, crossStyle: { color: '#6d7882' } } }, legend: { top: '4%', right: '0%', data: ['故障时间', '故障频次'], textStyle: { fontSize: 12 }, show: true }, grid: { left: '0%', right: '5%', bottom: '3%', containLabel: true }, xAxis: [ //y轴左侧代表值 { type: 'value', name: 'min', position: 'top', alignTicks: true, splitNumber: 5, // min: 0, // interval: Math.ceil(Math.ceil(Math.max(100)) / 5), // max: Math.ceil(Math.ceil(Math.max(100)) / 5) * 5, axisLine: { show: false /* lineStyle: { color: '#d4d7da' }*/ }, splitLine: { show: true, lineStyle: { color: '#d4d7da' } }, axisTick: { //去掉坐标轴刻度线 show: false }, axisLabel: { formatter: '{value}' } }, //y轴右侧值代表 { type: 'value', name: '次', position: 'bottom', alignTicks: true, splitNumber: 5, // min: 0, // interval: Math.ceil(Math.ceil(Math.max(100)) / 5), // max: Math.ceil(Math.ceil(Math.max(100)) / 5) * 5, //y轴刻度线和刻度单位 axisLine: { show: false /* lineStyle: { color: '#d4d7da' }*/ }, //y轴横向分割线 splitLine: { show: true, lineStyle: { color: '#d4d7da' } }, axisTick: { //去掉坐标轴刻度线 show: false }, axisLabel: { formatter: '{value}' } } ], yAxis: [ { type: 'category', axisLine: { lineStyle: { color: '#6d7882' } }, axisLabel: { interval: 0 }, splitLine: { show: true, lineStyle: { color: '#d4d7da' } }, data: [] } ], series: [ /*{ name: '故障时间', type: 'bar', color: '#3391FF', data: [18203, 23489, 29034, 104970, 131744, 630230] }, { name: '故障频次', type: 'bar', color: '#FF9800', data: [19325, 23438, 31000, 121594, 134141, 681807] }*/ { name: '故障时间', type: 'bar', barGap: 0.2, barWidth: 12, data: [], color: '#3391FF' }, { name: '故障频次', type: 'bar', barGap: 0.2, barWidth: 12, xAxisIndex: 1, //区分双轴坐标 data: [], color: '#FF9800' } ] }
标签:show,color,true,柱状图,ceil,坐标轴,type,echarts,Math From: https://www.cnblogs.com/zqlym/p/17046298.html