GraphicsJS vă permite să creați orice grafică web pe care o puteți imagina

JavaScript API-uri personalizate sunt viitorul web-ului. mișcarea sursă deschisă cuplat cu Grafica SVG au dezvăluit posibilitățile pentru dezvoltatorii web.

GraphicsJS este o librărie liberă open source și JS API pentru construirea de grafică personalizată în browserele web. Poate fi folosit ca a instrument de vizualizare pentru a grafice date, sau poate fi folosit pentru a face lucruri interesante doar pentru a ne arăta.

În pagina de pornire, veți găsi a mare parte a demo-urilor create cu GraphicsJS. Și aceste exemple doar zgâria suprafața a ceea ce este posibil.

Librăria utilizează propriul DOM virtual care este o abstracție a browserului DOM. Aceasta este oarecum similar cu DOM-ul virtual React și este folosit într-un mod similar.

Deoarece această bibliotecă folosește o clonă a DOM-ului, de asemenea are nevoie de elemente HTML reale a lucra la. De-aia utilizează SVG / VML mai degrabă decât obiectele încorporate în panza HTML5.

Acest motor grafic a fost inițial încorporat în biblioteca AnyChart. De acolo a fost optimizat și open-source ca propriul JS API.

GraphicsJS acceptă toate browserele importante, chiar datând din IE6 și Chrome 1.0.

Tot codul sursă este disponibil în replica GitHub unde puteți descărca o copie și împingeți-o în jur dacă aveți timp. Dar cred că cel mai bun mod de a învăța este să vă aruncați cu capul în față.

Ai putea naviga prin Documente API dar eu de obicei găsesc aceste documente inutile. Documentele sunt utilizate cel mai bine atunci când aveți nevoie găsiți o metodă specifică sau un apel API pentru referință.

Dacă începi să începi, poți vizitați terenul de joacă găzduit pe site-ul AnyChart. Acesta este un loc frumos de găsit coduri de lucru pentru a descompune sintaxa.

Sau, dacă vreți cu adevărat să începeți cu un pătrat, atunci GraphicsJS ghid de pornire poate ajuta. Acest lucru este mai mult ca “oficial” documentație, așa că vă va ține mâna pentru o o curbă mai ușoară de învățare în comparație cu documentele API.

În orice caz, îmi place că GraphicsJS a fost deschisă și lansată în comunitatea dezvoltatorilor. Este departe de o bibliotecă perfectă, dar este una dintre cele mai bune pentru noi crearea de grafice SVG personalizate de la zero.

Și pentru a obține viteza de cotitură, de mai jos puteți vedea o mostră de ceea ce puteți construi cu Graphics.js.