Creați diagrame de date bazate pe JavaScript cu Billboard.js

Grafica și imaginile joacă un rol vital în îmbunătățirea conținutului web. Cu tehnologia modernă este atât de ușor să adăugați în pagina dvs. imagini personalizate precum pictogramele SVG.

Dar o altă viziune surprinzătoare pe care o puteți construi de la zero este o diagramă web.

Acest lucru vă poate ajuta arata datele din punct de vedere vizual astfel încât vizitatorii dvs. pot să schimbe rapid informațiile pertinente. Și mai degrabă decât să codificați un grafic, puteți folosi o bibliotecă ca Billboard.js pentru a face toate ridicările grele.

Acesta este de fapt construit pe partea de sus a D3, care este o bibliotecă de vizualizare a datelor JavaScript. Este cu ușurință cel mai popular acolo, făcându-l cea mai sigură dependență de care ai putea cere.

Cu Billboard.js puteți accesa API-ul D3 rapid și ușor. Scopul principal al Billboard este ușurința de utilizare, făcându-l accesibil oricui. Cu toate că vă ajută să aveți experiență cu JavaScript, cu siguranță nu trebuie să fiți expert.

Rețineți totuși că întreaga codificare utilizează sintaxa ES6 care poate fi confundată cu cele mai puțin experimentate JS devs.

Atâta timp cât tu știți cum să compilați codul ar trebui să fii bine. De fapt, am acoperit câteva caracteristici fierbinți din ES6 dacă doriți să aflați mai multe.

Toate detaliile tehnice despre acest plugin pot părea plăcute. Dar probabil vrei doar să știi ce poate face acest lucru.

Aruncați o privire la pagina demo și faceți clic pe unele exemple live.

Veți găsi totul de la graficele plăcilor pentru a împrăștia graficele grafice animate personalizate.

Cu Billboard.js ai control complet asupra datelor dvs.. Controlezi modul în care apare pe pagină, modul în care este structurat și tipul de funcții UI / UX pe care le adaugi (dacă există).

Este într-adevăr o bibliotecă fantastică și este una dintre cele mai ușor de luat. Aruncați o privire la repo-ul GitHub al proiectului pentru a afla mai multe.

De asemenea, puteți săpeți în acest fragment pe CodePen dacă doriți să jucați cu codul din browserul dvs..