Echarts学习笔记（Js）- 02

• 数据区域缩放组件（dataZoom）基本操作
  官方教程地址入口
  1. dataZoom 组件现在支持几种子组件：

  • 内置型数据区域缩放组件（dataZoomInside）：内置于坐标系中。

  • 滑动条型数据区域缩放组件（dataZoomSlider）：有单独的滑动条操作。

  • 框选型数据区域缩放组件（dataZoomSelect）：全屏的选框进行数据区域缩放。入口和配置项均在 toolbox中。

  2. 使用方法

     • 在option中增加一个dataZoom，如果不指定坐标轴默认缩放为x轴，如下图
       image.png
       效果如下：
       效果图

       • 如果要达到鼠标滑轮滑动即实现图缩放的效果，在对应的坐标轴上同时加上slider和inside组件即可。（也可以自己通过xAxisIndex和yAxIndex参数指定，一个坐标轴同时有slider和inside两个组件就可以实现）
         image.png
         
         
         效果如下：
         image.png