Zoom automatique sur les images hautes après le chargement

Question

Est-ce que quelqu'un sait comment effectuer un zoom automatique sur une partie d'un graphique une fois le chargement terminé? J'ai beaucoup de données de timeseries mais l'information la plus importante est à droite. Je voudrais quand même que toutes les données soient disponibles, mais seulement les 7 derniers jours en vue ont été zoomés.

Ce que je voudrais simuler est un utilisateur qui clique et glisse pendant les 7 derniers jours sur mon graphique. Donc, si quelqu'un sait comment déclencher manuellement cet événement, c'est probablement ce que je voudrais faire.

Voici un exemple de tableau de jsFiddle qui a la fonctionnalité de zoom normal: http://jsfiddle.net/Y5q8H/50/

J'ai quelques autres idées de la façon dont cela pourrait se faire, mais je pense que ce que je veux est la meilleure façon de s'y prendre .

Autres idées:

1) Charger uniquement les 7 derniers jours, mettre un faux « Reset Zoom » bouton qui charge ensuite toute la série de données après

2) Regardez dans ce produit soeur StockCharts qui est dans Bêta en ce moment. Il semble avoir un tas d'affichages de gamme préréglée qui serait cool d'avoir aussi. Je ne suis pas sûr combien de mon code existant je devrais changer cependant.

Answer 1

Vous pouvez utiliser la fonction setExtremes pour changer le zoom. http://jsfiddle.net/quVda/382/

Pour un graphique de série chronologique avec des informations de jour en jour, vous devez utiliser la représentation UTC de la date:

var d = new Date(); 
chart.xAxis[0].setExtremes(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate() - 7), Date.UTC(d.getFullYear(), d.getMonth(), d.getDate())); 

Answer 2

Mise à jour du violon officiel solution, les gars: http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/stock/members/axis-setextremes/

$(function() { 
    $('#container').highcharts('StockChart', { 

     rangeSelector: { 
      selected: 1 
     }, 

     series: [{ 
      name: 'USD to EUR', 
      data: usdeur 
     }] 
    }); 

    $('#button').click(function() { 
     var chart = $('#container').highcharts(); 
     chart.xAxis[0].setExtremes(
      Date.UTC(2007, 0, 1), 
      Date.UTC(2007, 11, 31) 
     ); 
    }); 
}); 

Answer 3

Il existe une autre option si vous essayez

var max_in = 100; //the highest y value you have in your series data; 
var min_in = 41 ;//the lowest y value you have in your series data; 

yaxis=this.yAxis[0]; 
yaxis.options.max = max_in; 
yaxis.options.min = min_in;