2017-01-16 80 views
0

当'系列'选项中的'数据'总共少于100个元素时,平滑缩放。当不这样做时,平滑变焦消失。Highcharts失去平滑的缩放效果

$(function() { 
 
    $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function (data) { 
 
\t \t \t \t var length = 99; 
 
     data = data.slice(0, length); 
 
     Highcharts.chart('container', { 
 
      chart: { 
 
       zoomType: 'x' 
 
      }, 
 
      title: { 
 
       text: 'USD to EUR exchange rate over time' 
 
      }, 
 
      subtitle: { 
 
       text: document.ontouchstart === undefined ? 
 
         'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in' 
 
      }, 
 
      xAxis: { 
 
       type: 'datetime' 
 
      }, 
 
      yAxis: { 
 
       title: { 
 
        text: 'Exchange rate' 
 
       } 
 
      }, 
 
      legend: { 
 
       enabled: false 
 
      }, 
 
      plotOptions: { 
 
       area: { 
 
        fillColor: { 
 
         linearGradient: { 
 
          x1: 0, 
 
          y1: 0, 
 
          x2: 0, 
 
          y2: 1 
 
         }, 
 
         stops: [ 
 
          [0, Highcharts.getOptions().colors[0]], 
 
          [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')] 
 
         ] 
 
        }, 
 
        marker: { 
 
         radius: 2 
 
        }, 
 
        lineWidth: 1, 
 
        states: { 
 
         hover: { 
 
          lineWidth: 1 
 
         } 
 
        }, 
 
        threshold: null 
 
       } 
 
      }, 
 

 
      series: [{ 
 
       type: 'area', 
 
       name: 'USD to EUR', 
 
       data: data 
 
      }] 
 
     }); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://code.highcharts.com/highcharts.js"></script> 
 
<script src="https://code.highcharts.com/modules/exporting.js"></script> 
 

 
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

有什么办法“数据”时做出平滑变焦,甚至有在“系列的100个多元素?

回答