Comment dupliquer l’axe Y sur JQuery Flot

Je suis en mesure d’utiliser JQuery Flot, et c’est un très bel outil. Cependant, je ne pouvais pas trouver une bonne solution à mon problème.

Je souhaite dupliquer l’axe des Y afin de pouvoir afficher 1 à gauche et 1 à droite, de sorte que les utilisateurs, lorsqu’ils comparent des données à partir du côté le plus à droite du graphique, n’aient pas à faire défiler le côté le plus à gauche du graphique. Je suppose qu’ils y accéderont via un smartphone.

JQuery Flot autorise plusieurs axes, mais pour chaque axe, il me faudrait un dataset différent, comme dans cet exemple: http://people.iola.dk/olau/flot/examples/multiple-axes.html

Mais je ne veux pas dupliquer les données. Est-ce que je ne peux pas simplement dire à Flot de dupliquer le yaxis en utilisant le même dataset?

un chat occupé

Vous pouvez utiliser la fonctionnalité hooks pour forcer flot à afficher le deuxième yaxis même s’il n’a aucune série de données affectée:

// hook function to mark axis as "used" // and assign min/max from left axis pOff = function(plot, offset){ plot.getYAxes()[1].used = true; plot.getYAxes()[1].datamin = plot.getYAxes()[0].datamin; plot.getYAxes()[1].datamax = plot.getYAxes()[0].datamax; } $.plot("#placeholder2", [ { data: d2 } ], { hooks: { processOffset: [pOff] }, yaxes: [ {}, {position: 'right'} // add second axis ] });

En fonction de la configuration de votre axe, cela peut toutefois être compliqué. Vous devrez voler des parameters sur l’axe de gauche pour que cela fonctionne (comme je l’ai déjà fait avec datamin / datamax).

Si c’était mon code, je choisirais votre approche des données en double. Vous ne dupliquez rien, vous assignez simplement le même tableau à deux séries. Je configurerais ensuite la 2e série pour ne pas dessiner.

 var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]]; // use the same data but toggle off the lines... $.plot("#placeholder", [ { data: d2 }, {data: d2, yaxis: 2, lines: {show: false}} ], { yaxes: [ {}, {position: 'right'} ] });

Voici un violon montrant les deux approches.