„GraphicsJS“ leidžia sukurti bet kokią interneto grafiką, kurią galite įsivaizduoti

Priskirtos „JavaScript“ API yra interneto ateitis. The atviro kodo judėjimas kartu su SVG grafika sukūrė interneto kūrėjų galimybes.

GrafikaJS yra nemokama atviro kodo biblioteka ir JS API kurti individualią grafiką naršyklėse. Jis gali būti naudojamas kaip a vizualizavimo įrankis duomenų grafikai, arba ji gali būti naudojama vėsioje medžiagoje tiesiog parodyti.

Pagrindiniame puslapyje rasite a didelė demo dalis sukurta naudojant „GraphicsJS“. Ir šie pavyzdžiai tik subraižo tai, kas įmanoma.

Biblioteka naudoja savo virtualų DOM kuri yra naršyklės DOM abstrakcija. Tai šiek tiek panašus į React virtualų DOM ir jis naudojamas panašiai.

Kadangi ši biblioteka naudoja DOM kloną, ji taip pat reikia realių HTML elementų dirbti. Štai kodėl taip naudoja SVG / VML o ne įterpti objektai HTML5 drobėje.

Šis grafikos variklis buvo iš pradžių buvo pastatyta į AnyChart biblioteką. Iš ten jis buvo suspaustas ir atviro šaltinio kaip savo JS API.

GrafikaJS palaiko visas pagrindines naršykles, netgi ieškoma iš IE6 ir „Chrome 1.0“.

Visi šaltinio kodai yra prieinama „GitHub“ repo, kur galite parsisiųsti kopiją ir susikaupti, jei turite laiko. Bet aš manau, kad geriausias būdas išmokti yra nardyti į galvą.

Galite naršyti API dokumentai bet paprastai manau, kad šie dokumentai yra nereikalingi. Dokumentai geriausiai naudojami, kai jums reikia rasti konkretų metodą arba API skambutį nuoroda.

Jei tik pradedate, galite apsilankykite žaidimų aikštelėje „AnyChart“ svetainėje. Tai puiki vieta rasti darbo kodo pavyzdžiai suskaidyti sintaksę.

Arba, jei tikrai norite pradėti nuo kvadrato, tada GrafikosJS paleidimo vadovas gali padėti. Tai labiau panašus į “pareigūnas” dokumentai, kad ji laikytų jūsų ranką a sklandesnė mokymosi kreivė palyginti su API dokumentais.

Bet kuriuo atveju, aš myliu, kad „GraphicsJS“ buvo atvira ir išleista į kūrėjų bendruomenę. Tai toli nuo tobulos bibliotekos, bet tai vienas geriausių sukurti SVG grafiką nuo nulio.

Ir norėdami pasukti pavaras, žemiau galite pamatyti pavyzdį, ką galite sukurti naudojant „Graphics.js“.