| | |
| | | const myChart = echarts.init(document.getElementById('echart2')) |
| | | const that = this |
| | | myChart.setOption({ |
| | | dataZoom: [ |
| | | { |
| | | type: 'slider', // 滑动条类型 |
| | | orient: 'vertical', |
| | | left: 'left', |
| | | start: 0, // 起始位置(百分比) |
| | | end: 40, // 结束位置(百分比),控制初始显示范围 |
| | | width: 4, |
| | | dataBackground: { |
| | | areaStyle: { opacity: 0 }, // 设置背景透明 |
| | | lineStyle: { opacity: 0 } // 设置背景透明 |
| | | }, |
| | | moveOnMouseWheel: true, |
| | | }, |
| | | { |
| | | type: 'inside', // 用于监听滚轮事件 |
| | | orient: 'vertical', |
| | | start: 0, |
| | | end: 40, |
| | | minSpan: 40, |
| | | dataBackground: { |
| | | areaStyle: { opacity: 0 } // 设置背景透明 |
| | | }, |
| | | maxSpan: 40, |
| | | zoomLock: true, // 锁定缩放(仅允许平移) |
| | | moveOnMouseWheel: true, // 启用滚轮平移 |
| | | } |
| | | ], |
| | | grid: { |
| | | top: '4%', |
| | | left: '2%', |
| | |
| | | // 这里输入线条的样式 |
| | | color: 'rgba(255,255,255,0.14)' |
| | | } |
| | | } |
| | | }, |
| | | axisLabel: { |
| | | formatter: function(value) { |
| | | const intValue = Math.round(value); |
| | | return intValue > 0 ? intValue : ''; |
| | | } |
| | | }, |
| | | minInterval: 1, |
| | | min: 1 |
| | | }, |
| | | yAxis: { |
| | | type: 'category', |
| | |
| | | nameTextStyle: { |
| | | padding: [0, 0, 4, -30] // 四个数字分别为上右下左与原位置距离 |
| | | }, |
| | | axisLabel: { |
| | | formatter: function(value) { |
| | | const intValue = Math.round(value); |
| | | return intValue > 0 ? intValue : ''; |
| | | } |
| | | }, |
| | | minInterval: 1, |
| | | min: 1, |
| | | splitLine: { |
| | | show: true, |
| | | lineStyle: { |
| | |
| | | // 这里输入线条的样式 |
| | | color: 'rgba(255,255,255,0.14)' |
| | | } |
| | | } |
| | | }, |
| | | axisLabel: { |
| | | formatter: function(value) { |
| | | const intValue = Math.round(value); |
| | | return intValue > 0 ? intValue : ''; |
| | | } |
| | | }, |
| | | minInterval: 1, |
| | | min: 1 |
| | | }, |
| | | grid: { |
| | | top: '16%', |