diff --git a/src/view/echarts_yl/ylXZZC.vue b/src/view/echarts_yl/ylXZZC.vue index 9a14de9..bf59c6c 100644 --- a/src/view/echarts_yl/ylXZZC.vue +++ b/src/view/echarts_yl/ylXZZC.vue @@ -38,64 +38,64 @@ let option = { containLabel: true, color: "#ffffff", }, - // dataZoom: [ - // {//在内部可以纵向拖动 - // show: zoomShow, - // type: "inside", - // startValue: 0, - // endValue: 2, - // minValueSpan: 2, - // maxValueSpan: 2, - // yAxisIndex: [0], - // zoomOnMouseWheel: false, // 关闭滚轮缩放 - // moveOnMouseWheel: true, // 开启滚轮平移 - // moveOnMouseMove: true, // 鼠标移动能触发数据窗口平移 - // }, - // { //纵向使用滚动条 - // show: zoomShow, - // type: "slider", - // realtime: true, - // startValue: 0, - // endValue: 2, - // width: "3.5", - // height: "80%", - // yAxisIndex: [0], // 控制y轴滚动 - // fillerColor: "rgba(154, 181, 215, 1)", // 滚动条颜色 - // borderColor: "rgba(17, 100, 210, 0.12)", - // backgroundColor: "#cfcfcf", //两边未选中的滑动条区域的颜色 - // handleSize: 0, // 两边手柄尺寸 - // showDataShadow: false, //是否显示数据阴影 默认auto - // showDetail: false, // 拖拽时是否展示滚动条两侧的文字 - // top: "1%", - // right: "5",//距离右侧的距离 - // }, - // ], dataZoom: [ - { - //纵向使用滚动条 - id: "dataZoomY", + {//在内部可以纵向拖动 + show: zoomShow, + type: "inside", + startValue: 0, + endValue: 10, + minValueSpan: 2, + maxValueSpan: 10, + yAxisIndex: [0], + zoomOnMouseWheel: false, // 关闭滚轮缩放 + moveOnMouseWheel: true, // 开启滚轮平移 + moveOnMouseMove: true, // 鼠标移动能触发数据窗口平移 + }, + { //纵向使用滚动条 + show: zoomShow, type: "slider", + realtime: true, + startValue: 0, + endValue: 2, + width: "8", + height: "90%", yAxisIndex: [0], // 控制y轴滚动 - filterMode: "empty", //数据过滤,只改变数轴范围。 - width: "10", - height: "100%", - right: "3%", //距离右侧的距离 - orient: "vertical", //布局方式是横还是竖 'horizontal':水平。'vertical':竖直。 - start: 0, //开始 数据窗口范围的,范围是:0 ~ 100 - end: 70, //结束 - zoomLock: true, //不能缩放 fillerColor: "rgba(154, 181, 215, 1)", // 滚动条颜色 borderColor: "rgba(17, 100, 210, 0.12)", backgroundColor: "#cfcfcf", //两边未选中的滑动条区域的颜色 handleSize: 0, // 两边手柄尺寸 showDataShadow: false, //是否显示数据阴影 默认auto showDetail: false, // 拖拽时是否展示滚动条两侧的文字 - - zoomOnMouseWheel: false, // 关闭滚轮缩放 - moveOnMouseWheel: true, // 开启滚轮平移 - moveOnMouseMove: true, // 鼠标移动能触发数据窗口平移 + top: "1%", + right: "8",//距离右侧的距离 }, ], + // dataZoom: [ + // { + // //纵向使用滚动条 + // id: "dataZoomY", + // type: "slider", + // yAxisIndex: [0], // 控制y轴滚动 + // filterMode: "empty", //数据过滤,只改变数轴范围。 + // width: "10", + // height: "100%", + // right: "3%", //距离右侧的距离 + // orient: "vertical", //布局方式是横还是竖 'horizontal':水平。'vertical':竖直。 + // start: 0, //开始 数据窗口范围的,范围是:0 ~ 100 + // end: 70, //结束 + // zoomLock: true, //不能缩放 + // fillerColor: "rgba(154, 181, 215, 1)", // 滚动条颜色 + // borderColor: "rgba(17, 100, 210, 0.12)", + // backgroundColor: "#cfcfcf", //两边未选中的滑动条区域的颜色 + // handleSize: 0, // 两边手柄尺寸 + // showDataShadow: false, //是否显示数据阴影 默认auto + // showDetail: false, // 拖拽时是否展示滚动条两侧的文字 + + // zoomOnMouseWheel: false, // 关闭滚轮缩放 + // moveOnMouseWheel: true, // 开启滚轮平移 + // moveOnMouseMove: true, // 鼠标移动能触发数据窗口平移 + // }, + // ], calculable: true, xAxis: { // name: '/次',