2016-01-07 7 views
0

Я сделал диаграмму Highstock и получил аппроксимацию с увеличением на yAxis. У меня есть текстовое поле Button и 2 для получения желаемых значений min/max для оси. С min: 0, max: 100 работает хорошо. С min: 0, max: 80 это не (max все равно будет 100 в Диаграмме). Если я использую мышь для масштабирования, она работает хорошо (возможно даже мин: 3.7 и максимум 3.894). Но использование мыши не является опцией, потому что в более позднем Diagramm будет 3 yAxes с индивидуальным увеличением.ZoomRange Highstock работает некорректно?

$(function() { 
var seriesOptions = [], 
    seriesCounter = 0, 
    names = ['MSFT', 'AAPL', 'GOOG']; 

/** 
* Create the chart when all data is loaded 
* @returns {undefined} 
*/ 
function createChart() { 

    $('#container').highcharts('StockChart', { 
     rangeSelector: { 
      selected: 4 
     }, 
     chart:{ 
      zoomType: 'xy' 
     }, 
     yAxis: [ 
     { 
      labels: { 
       format: '{value}', 
      }, 
      height: '100%', 
      opposite: false, 
      plotLines: [{ 
       value: 0, 
       width: 2, 
       color: 'silver' 
      }] 
     }, 
     ], 

     plotOptions: { 
      series: { 
       compare: 'percent' 
      } 
     }, 

     tooltip: { 
      pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>', 
      valueDecimals: 2 
     }, 

     series: seriesOptions 
    }, 
    function(chart){ 

     $('#btn').click(function(){ 
      var min = temp_min.value, 
       max = temp_max.value; 
      chart.yAxis[0].setExtremes((min),(max)); 
     }); 

    }); 
} 

$.each(names, function (i, name) { 

    $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=' + name.toLowerCase() + '-c.json&callback=?', function (data) { 
        if(seriesCounter==0){    
      seriesOptions[i] = { 
      name: name, 
      data: data, 
      yAxis: 0 
      }; 
     } else { 
      seriesOptions[i] = { 
      name: name, 
      data: data, 
      yAxis: 0 
      }; 
     } 



     // As we're loading the data asynchronously, we don't know what order it will arrive. So 
     // we keep a counter and create the chart when all the data is loaded. 
     seriesCounter += 1; 

     if (seriesCounter === names.length) { 
      createChart(); 
     } 
    }); 
}); 

});

JSFiddle

Другой вопрос: Можно ли настроить полосу прокрутки для YAxis, а? Спасибо за помощь, Patrick

ответ

0

Это связано с тем, что tickInterval не является регулярным, поэтому округляется до значения (например, 100). Решение использует tickPositioner, который вычисляет тики, основываясь на определенных вами крайностях.

tickPositioner: function (min,max) { 
      var positions = [], 
       tick = Math.floor(min), 
       increment = Math.ceil((max - min)/5); 

      for (tick; tick - increment <= max; tick += increment) { 
       positions.push(tick); 
      } 
      return positions; 
     }, 

http://jsfiddle.net/6s11kcwd/

Полоса прокрутки поддерживается только для XAxis.

+1

Большое спасибо, это то, что я искал. – PatrickVCP