zoukankan      html  css  js  c++  java
  • Echarts dataZoom缩放功能参数详解:

    dataZoom=[                                        //区域缩放
        {
            id: 'dataZoomX',
            show:true,                               //是否显示 组件。如果设置为 false,不会显示,但是数据过滤的功能还存在。
            backgroundColor:"rgba(47,69,84,0)",     //组件的背景颜色
            type: 'slider',                          //slider表示有滑动块的,inside表示内置的
            dataBackground:{                         //数据阴影的样式。
                lineStyle:mylineStyle,               //阴影的线条样式
                areaStyle:myareaStyle,               //阴影的填充样式
            },
            fillerColor:"rgba(167,183,204,0.4)",     //选中范围的填充颜色。
            borderColor:"#ddd",                      //边框颜色。
            filterMode: 'filter',                    //'filter':当前数据窗口外的数据,被 过滤掉。即 会 影响其他轴的数据范围。每个数据项,只要有一个维度在数据窗口外,整个数据项就会被过滤掉。
            xAxisIndex:0,                            //设置 dataZoom-inside 组件控制的 x轴,可以用数组表示多个轴
            yAxisIndex:[0,2],                        //设置 dataZoom-inside 组件控制的 y轴,可以用数组表示多个轴
            radiusAxisIndex:3,                       //设置 dataZoom-inside 组件控制的 radius 轴,可以用数组表示多个轴
            angleAxisIndex:[0,2],                    //设置 dataZoom-inside 组件控制的 angle 轴,可以用数组表示多个轴
            start: 30,                               //数据窗口范围的起始百分比,表示30%
            end: 70,                                 //数据窗口范围的结束百分比,表示70%
            startValue:10,                           //数据窗口范围的起始数值
            endValue:100,                            //数据窗口范围的结束数值。
            orient:"horizontal",                     //布局方式是横还是竖。不仅是布局方式,对于直角坐标系而言,也决定了,缺省情况控制横向数轴还是纵向数轴。'horizontal':水平。'vertical':竖直。
            zoomLock:false,                          //是否锁定选择区域(或叫做数据窗口)的大小。如果设置为 true 则锁定选择区域的大小,也就是说,只能平移,不能缩放。
            throttle:100,                            //设置触发视图刷新的频率。单位为毫秒(ms)。
            zoomOnMouseWheel:true,                   //如何触发缩放。可选值为:true:表示不按任何功能键,鼠标滚轮能触发缩放。false:表示鼠标滚轮不能触发缩放。'shift':表示按住 shift 和鼠标滚轮能触发缩放。'ctrl':表示按住 ctrl 和鼠标滚轮能触发缩放。'alt':表示按住 alt 和鼠标滚轮能触发缩放。
            moveOnMouseMove:true,                    //如何触发数据窗口平移。true:表示不按任何功能键,鼠标移动能触发数据窗口平移。false:表示鼠标滚轮不能触发缩放。'shift':表示按住 shift 和鼠标移动能触发数据窗口平移。'ctrl':表示按住 ctrl 和鼠标移动能触发数据窗口平移。'alt':表示按住 alt 和鼠标移动能触发数据窗口平移。
            left:"center",                           //组件离容器左侧的距离,'left', 'center', 'right','20%'
            top:"top",                               //组件离容器上侧的距离,'top', 'middle', 'bottom','20%'
            right:"auto",                            //组件离容器右侧的距离,'20%'
            bottom:"auto",                           //组件离容器下侧的距离,'20%'
    
        },
        {
            id: 'dataZoomY',
            type: 'inside',
            filterMode: 'empty',
            disabled:false,                         //是否停止组件的功能。
            xAxisIndex:0,                           //设置 dataZoom-inside 组件控制的 x轴,可以用数组表示多个轴
            yAxisIndex:[0,2],                       //设置 dataZoom-inside 组件控制的 y轴,可以用数组表示多个轴
            radiusAxisIndex:3,                      //设置 dataZoom-inside 组件控制的 radius 轴,可以用数组表示多个轴
            angleAxisIndex:[0,2],                   //设置 dataZoom-inside 组件控制的 angle 轴,可以用数组表示多个轴
            start: 30,                              //数据窗口范围的起始百分比,表示30%
            end: 70,                                //数据窗口范围的结束百分比,表示70%
            startValue:10,                          //数据窗口范围的起始数值
            endValue:100,                           //数据窗口范围的结束数值。
            orient:"horizontal",                    //布局方式是横还是竖。不仅是布局方式,对于直角坐标系而言,也决定了,缺省情况控制横向数轴还是纵向数轴。'horizontal':水平。'vertical':竖直。
            zoomLock:false,                         //是否锁定选择区域(或叫做数据窗口)的大小。如果设置为 true 则锁定选择区域的大小,也就是说,只能平移,不能缩放。
            throttle:100,                           //设置触发视图刷新的频率。单位为毫秒(ms)。
            zoomOnMouseWheel:true,                  //如何触发缩放。可选值为:true:表示不按任何功能键,鼠标滚轮能触发缩放。false:表示鼠标滚轮不能触发缩放。'shift':表示按住 shift 和鼠标滚轮能触发缩放。'ctrl':表示按住 ctrl 和鼠标滚轮能触发缩放。'alt':表示按住 alt 和鼠标滚轮能触发缩放。
            moveOnMouseMove:true,                   //如何触发数据窗口平移。true:表示不按任何功能键,鼠标移动能触发数据窗口平移。false:表示鼠标滚轮不能触发缩放。'shift':表示按住 shift 和鼠标移动能触发数据窗口平移。'ctrl':表示按住 ctrl 和鼠标移动能触发数据窗口平移。'alt':表示按住 alt 和鼠标移动能触发数据窗口平移。
        }
    ];
  • 相关阅读:
    2015第18周四
    2015第18周三程序员能力
    2015第18周二
    2015第18周一
    2015第17周日活在当下
    2015第17周六去除表中某字段重复记录
    2015第17周五
    2015第17周四
    Mac OS X Yosemite安装Hadoop 2.6记录
    GLEW_ERROR_NO_GL_VERSION的解决方法
  • 原文地址:https://www.cnblogs.com/xiaobaibubai/p/14926131.html
Copyright © 2011-2022 走看看