GraphicsJS ļauj izveidot jebkuru Web grafiku, ko varat iedomāties
Pielāgotās JavaScript API ir interneta nākotne. The atvērtā koda kustība kopā ar SVG grafika ir atklājušas tīmekļa izstrādātāju iespējas.
GraphicsJS ir bezmaksas atvērtā koda bibliotēka un JS API veidojot pielāgotus grafikus pārlūkprogrammās. To var izmantot kā a vizualizācijas rīks attēlot datus, vai to var izmantot, lai veidotu atdzist tikai, lai parādītu.
Mājas lapā jūs atradīsiet a liela daļa demo izveidots ar GraphicsJS. Un šie piemēri vienkārši saskrāpē to, kas ir iespējams.
Bibliotēka izmanto savu virtuālo DOM kas ir pārlūkprogrammas DOM abstrakcija. Tas ir nedaudz līdzīgs React virtuālajam DOM un tas tiek izmantots līdzīgā veidā.
Tā kā šī bibliotēka izmanto DOM klonu, tā arī ir nepieciešams reāls HTML elements strādāt. Tieši tāpēc izmanto SVG / VML nevis iegultos objektus HTML5 audeklā.
Šis grafikas dzinējs bija sākotnēji iebūvēts AnyChart bibliotēkā. No turienes tas bija tweaked un atvērts kā savs JS API.
GraphicsJS atbalsta visas galvenās pārlūkprogrammas, pat datēta ar IE6 un Chrome 1.0.
Viss avota kods ir pieejams GitHub repo, kur jūs varat lejupielādēt kopiju un ielikt apkārt, ja jums ir laiks. Bet es domāju, ka labākais veids, kā mācīties, ir ienirt galvu.
Varat pārlūkot API dokumenti bet es parasti uzskatu, ka šie dokumenti ir lieki. Dokumentus vislabāk izmantot, kad jums ir nepieciešams atrast noteiktu metodi vai API zvanu uz atsauci.
Ja jūs vienkārši sākat, varat apmeklējiet rotaļu laukumu izvietots AnyChart tīmekļa vietnē. Šī ir jauka vieta, kur atrast darba kodu paraugi sadalīt sintaksi.
Vai, ja jūs patiešām vēlaties sākt ar kvadrātu, tad GraphicsJS sākuma rokasgrāmata var palīdzēt. Tas ir vairāk kā “ierēdnis” dokumentācija, lai tā saglabātu jūsu roku a vienmērīgāka mācīšanās līkne salīdzinājumā ar API dokumentiem.
Katrā ziņā, es mīlu, ka GraphicsJS bija atvērta un izlaista attīstītāju kopienā. Tā ir tālu no nevainojamas bibliotēkas, bet tā ir viena no labākajām veidojot pielāgotu SVG grafiku no nulles.
Un, lai iegūtu pagriezienus, zemāk jūs varat redzēt paraugu, ko varat veidot, izmantojot Graphics.js.