Detailed description of parameters of the Echarts dataZoom scaling function:, echartsdatazoom

Source: Internet
Author: User

Detailed description of parameters of the Echarts dataZoom scaling function:, echartsdatazoom

DataZoom = [// area scaling {id: 'datazoomx ', show: true, // whether to display components. If it is set to false, it is not displayed, but the data filtering function still exists. BackgroundColor: "rgba (,)", // the background color type of the component: 'slider', // slider indicates that there is a sliding block, and inside indicates the built-in dataBackground: {// data shadow style. LineStyle: mylineStyle, // Shadow Line Style areaStyle: myareaStyle, // shadow filling style}, fillerColor: "rgba (167,183,204, 0.4 )", // fill color of the selected range. BorderColor: "# ddd", // border color. FilterMode: 'filter', // 'filter': data outside the current data window, filtered out. The data range of other axes is affected. Each data item, as long as there is a dimension outside the data window, the entire data item will be filtered out. XAxisIndex: 0, // set the X axis controlled by the dataZoom-inside component. You can use an array to represent Multiple Axes. yAxisIndex: [], // set the Y axis controlled by the dataZoom-inside component, you can use an array to represent Multiple Axes. radiusAxisIndex: 3, // set the radius axis controlled by the dataZoom-inside component. You can use an array to represent Multiple Axes. angleAxisIndex: [0, 2], // set the angle axis controlled by the dataZoom-inside component. An array can be used to indicate the start percentage of Multiple Axes in the start: 30. // The start percentage of the data window range, indicating 30% end: 70, // The end percentage of the data window range, indicating 70% startValue: 10, // The start value of the data window range endValue: 100, // The end value of the data window range. Orient: "horizontal", // whether the layout is horizontal or vertical. It is not only the layout method, but also the Cartesian coordinate system. By default, the horizontal and vertical axes are controlled. 'Horizontal ': horizontal. 'Signature': vertical. ZoomLock: false, // whether to lock the size of the selected area (or data window. If it is set to true, the size of the selected area is locked. That is to say, the selected area can only be translated and cannot be scaled. Throttle: 100, // set the frequency of triggering view refresh. Unit: milliseconds (MS ). ZoomOnMouseWheel: true, // how to trigger scaling. Value Options: true, indicating that scaling can be triggered without pressing any function key. False: the scroll wheel cannot be scaled. 'Shift ': indicates that shift and scroll wheel can trigger scaling. 'Ctrl ': Hold down ctrl and scroll wheel to trigger scaling. 'Alt': indicates that alt and scroll wheel can trigger scaling. MoveOnMouseMove: true, // how to trigger data window translation. True: if you do not press any function key, mouse movement triggers data window translation. False: the scroll wheel cannot be scaled. 'Shift ': shift and mouse movement can trigger data window translation. 'Ctrl ': press ctrl and move the mouse to trigger the data window translation. 'Alt': Hold down alt and move the mouse to trigger the data window translation. Left: "center", // distance from the left side of the container, 'left', 'center', 'right', '000000' top: "top ", // The distance from the component to the upper side of the container, 'top', 'middle', 'bottom ', '000000' right: "auto", // The distance from the component to the right of the container, '200' bottom: "auto", // The distance from the lower side of the container, '200'}, {id: 'datazoomy', type: 'inside ', filterMode: 'empty', disabled: false, // whether to stop the component function. XAxisIndex: 0, // set the X axis controlled by the dataZoom-inside component. You can use an array to represent Multiple Axes. yAxisIndex: [], // set the Y axis controlled by the dataZoom-inside component, you can use an array to represent Multiple Axes. radiusAxisIndex: 3, // set the radius axis controlled by the dataZoom-inside component. You can use an array to represent Multiple Axes. angleAxisIndex: [0, 2], // set the angle axis controlled by the dataZoom-inside component. An array can be used to indicate the start percentage of Multiple Axes in the start: 30. // The start percentage of the data window range, indicating 30% end: 70, // The end percentage of the data window range, indicating 70% startValue: 10, // The start value of the data window range endValue: 100, // The end value of the data window range. Orient: "horizontal", // whether the layout is horizontal or vertical. It is not only the layout method, but also the Cartesian coordinate system. By default, the horizontal and vertical axes are controlled. 'Horizontal ': horizontal. 'Signature': vertical. ZoomLock: false, // whether to lock the size of the selected area (or data window. If it is set to true, the size of the selected area is locked. That is to say, the selected area can only be translated and cannot be scaled. Throttle: 100, // set the frequency of triggering view refresh. Unit: milliseconds (MS ). ZoomOnMouseWheel: true, // how to trigger scaling. Value Options: true, indicating that scaling can be triggered without pressing any function key. False: the scroll wheel cannot be scaled. 'Shift ': indicates that shift and scroll wheel can trigger scaling. 'Ctrl ': Hold down ctrl and scroll wheel to trigger scaling. 'Alt': indicates that alt and scroll wheel can trigger scaling. MoveOnMouseMove: true, // how to trigger data window translation. True: if you do not press any function key, mouse movement triggers data window translation. False: the scroll wheel cannot be scaled. 'Shift ': shift and mouse movement can trigger data window translation. 'Ctrl ': press ctrl and move the mouse to trigger the data window translation. 'Alt': Hold down alt and move the mouse to trigger the data window translation. }];

Detailed description of Echarts data visualization dataZoom scaling Parameters

Statement: Reproduced in http://blog.csdn.net/luanpeng825485697/article/details/76739026

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.