echarts利用datazoom实现类似timeline连续变换效果

利用echarts提供的timeline时间轴组件，可实现通过时间点来控制多个图表的显示。官方配置项说明里面提供了丰富的功能，具体可见echarts_timeline组件。

但经过测试之后发现，timeline提供的时间点都要求是单一选择的，即一次只能显示时间轴上一个点对应的数据。而在我们的项目中，需要能选择一个时间段，也就是能选择时间轴上的一段时间。

利用datazoom组件能够拖动，选择一个范围的特点，实现了类似timeline连续变换效果。

首先，给option的xAxis添加一个timeline的数据轴，后面将其设置为show:false隐藏即可。

 xAxis: [
        {data: category,
        axisLine: {
            lineStyle: {
                color: '#ccc'
            }
        }},
        {data: testdata,
        axisLine: {
            lineStyle: {
                color: '#ccc'
            }
        }},//timeline数据
        ],

然后，设置datazoom控制显示timeline数据的x轴。

dataZoom:[
                {
                type: 'slider',
                show: true,
                start: 50,