2016-02-09 12 views
5

Czy w Plotly.js jest parametr do automatycznego skalowania osi w celu automatycznego dopasowania do wykreślanych danych?Plotly.js autoscale

Scenariusz: Wykreślam temperaturę (oś y) względem czasu (oś x) w ciągu ostatnich 30 minut.

Problem: Po załadowaniu strony wykres nic nie pokazuje. Naprawiłbym osie, ale oś X musi pokazywać ostatnie 30 minut i aktualizować co minutę. Jednak po kliknięciu "Autoskalowanie" lub "Resetuj osie" wykres doskonale pasuje do danych!

Pytanie: Czy mogę ustawić wydruk automatycznie "Autoskalowanie" przy ładowaniu strony, zamiast wymagać od użytkownika kliknięcia "autoskalowania"?

See app tutaj: https://vast-fortress-23871.herokuapp.com/

Odpowiedz

4

Naprawdę głupie Hack jest dodanie tego:

document.querySelector('[data-title="Autoscale"]').click() 

Będzie on automatycznie kliknij przycisk automatycznego skalowania. Lepszym sposobem byłoby zorientowanie się, jaką funkcję faktycznie wywołuje przycisk, i zamiast tego wywołaj.

+0

To sprytnie, dzięki. Jeśli wszystko inne zawiedzie, użyję tego. – Matte3o

+0

@ Matte3o: Ponieważ używasz JQuery, możesz oczywiście użyć '$' zamiast 'document.querySelector', by uzyskać szerszą obsługę przeglądarki. – damd

0

Miałem ten sam problem. Kod, z którym się łączyłeś jest minified, więc nie mogę (nie chcę) go przeczytać, ale oto co zrobiłem źle:

Jeśli plotly.newPlot() uruchomi się przed załadowaniem wszystkich danych, to nie zmieni automatycznego (ponieważ ma brak danych i nie wie do sprawdzenia).

np

var plotdata = [x:[],y:[],type: 'scatter']; 
$.get('mydata.dat',(x) => {/*put parsed x into plotdata*/}); 
Plotly.newPlot('mydiv',plotdata,layout); 

nuta że plotdata zostanie wypełniona po fabuła powstała ponieważ $.get() jest asynchroniczne.

0

Rozwiązałem ten problem z przekazaniem. Po prostu ustaw właściwość autorange na "true" na xaxis i yaxis. Będzie to autoskalowanie na obu osiach:

// To call when data is ready, after your page loads. 
Plotly.relayout(yourGraph, { 
    'xaxis.autorange': true, 
    'yaxis.autorange': true 
});