EchartsFilterMode

by tmtron

HTML

<script src="//cdn.bootcss.com/echarts/3.2.2/echarts.min.js"></script>
<div id="main" style="width: 600px;height:400px;"></div>

JavaScript

var myChart = echarts.init(document.getElementById('main'));

       option = {
         legend: {
           data: ['issue']
         },
         dataZoom: [{
             type: 'slider',
             show: true,
             filterMode: 'none'
           },
           {
             type: 'inside',
             show: true,
             filterMode: 'none'
           }
         ],
         xAxis: {
           type: 'time',
         },
         yAxis: {
           type: 'value',
           max: 50
         },
         series: [{
           name: 'issue',
           type: 'line',
           data: [{
               name: "2016-01-01",
               value: ["2016-01-01 00:00:00", 5]
             },
             {
               name: "2016-01-02",
               value: ["2016-01-02 00:00:00", 15]
             },
             {
               name: "2016-01-03",
               value: ["2016-01-03 00:00:00", 25]
             },
             {
               name: "2016-01-03",
               value: ["2016-01-05 00:00:00", 15]
             },
           ],
           markArea: {
             silent: true,
             data: [
               [{
                   coord: ["2016-01-01 00:00:00", 5]
                 },
                 {
                   coord: ["2016-01-01 23:59:59", 15]
                 }
               ],
               [{
                   coord: ["2016-01-02 00:00:00", 10]
                 },
                 {
                   coord: ["2016-01-02 23:59:59", 20]
                 }
               ],
               [{
                   coord: ["2016-01-03 00:00:00", 15]
                 },
                 {
                   coord: ["2016-01-03 23:59:59", 35]
                 }
               ]
             ]
           },
         }]
       };


       myChart.setOption(option);