Ho usato più volte chart.js nei miei progetti ma non ho mai usato d3.js. Molte persone dicono che d3.js è il miglior framework javascript per i grafici ma nessuno di loro è in grado di spiegare perché, specialmente quando voglio un confronto con chart.js.
Ho trovato questo: http://www.fusioncharts.com/javascript-charting-comparison/ ma non è quello che stavo cercando.
Qualcuno sa di un confronto di questi framework in termini di usabilità e prestazioni (solo per i grafici)?
Risposte:
d3.jsnon è una libreria di "grafici". È una libreria per creare e manipolare SVG / HTML. Fornisce strumenti per aiutarti a visualizzare e manipolare i tuoi dati. Sebbene sia possibile utilizzarlo per creare grafici convenzionali (a barre, a linee, a torta, ecc ...), è in grado di fare molto di più. Ovviamente con questo "capace di tanto" arriva una curva di apprendimento più ripida. Ci sono un sacco di librerie di grafici convenzionali costruiti in cima d3.js- nvd3.js, dimple.js, dc.jsse si vuole seguire questa strada.
Non ho familiarità, Chart.jsma una rapida occhiata al sito web mi dice che è più una libreria di grafici run of the mill. Esso supporta 6 tipi di grafico di base e non si è mai andare a fare cose del genere presente con esso . Ma l'API sembra semplice e sono sicuro che sia facile da usare.
Oltre a questo, la distinzione più ovvia tra i due è che Chart.jsè basata su tela, mentre d3.jsriguarda principalmente SVG. (Ora dico principalmente perché d3.jspuò manipolare tutti i tipi di elementi HTML in modo che tu possa persino usarlo per aiutarti a disegnare su una tela.) In generale, la tela eseguirà SVG per un gran numero di elementi (sto parlando molto grande - migliaia di punti, linee, ecc ...). SVG, d'altra parte, è più facile da manipolare e con cui interagire. Con SVG ogni punto, linea, ecc diventa parte del DOM: vuoi quel punto verde ora, basta cambiarlo. Con la tela è un disegno statico che doveva essere ridisegnato per apportare qualsiasi cambiamento - ovviamente si disegna così velocemente che di solito non te ne accorgi mai. Ecco alcune buone letture da Microsoft.
Poiché sto cercando di trovare una libreria di grafici veloce per mostrare i grafici sui dispositivi mobili, le prestazioni sono state importanti per me. Doveva anche avere una licenza che ne consentisse l'uso commerciale. Ho confrontato:
I grafici vengono caricati all'interno di un componente WebView all'interno di un'app nativa e tutti i dati (inclusa la libreria JS) sono locali, quindi nessun rallentamento dovuto alle richieste http. Per massimizzare ancora di più le prestazioni, inserisco tutto in un unico file.
Ho caricato 4 grafici (linea, barra, torta, linea / barra combinata) con circa 500 punti dati insieme.
La mia misurazione del tempo escludeva il caricamento effettivo della pagina html. Ho misurato dal momento in cui ho iniziato a utilizzare il codice della libreria di grafici fino alla fine del rendering. Tutta l'animazione del grafico è stata disattivata.
C3 ha impiegato circa 1500-1800 ms sui moderni dispositivi Android e IPhone. iPhone ha funzionato circa 100 ms meglio di Android.
Chart.js ha impiegato circa 400-800 ms. Android ha funzionato circa 300 ms meglio di iPhone.
Nessuna sorpresa, l'SVG è più lento. A seconda del tuo caso d'uso, forse troppo lento.
Su un computer desktop il rendering in c3 era di circa 150-200 ms e chart.js di circa 80-100 ms. L'esecuzione dello stesso test nell'emulatore Android e iPhone ha avuto lo stesso risultato del desktop. Quindi il rallentamento sui dispositivi mobili è sicuramente dovuto ai limiti hardware / di elaborazione.
Spero possa aiutare
AGGIORNATO 2016
La regola generale è:
d3.js - ottimo per visualizzazioni interattive
chart.js - ottimo per veloce e semplice
Alcune altre librerie di grafici sono in aumento, quindi continua a testare e non dimenticare di contribuire all'open source !