GraphicsJS pozwala tworzyć dowolne grafiki internetowe, które można sobie wyobrazić

Niestandardowe interfejsy API JavaScript to przyszłość sieci. The ruch open source w połączeniu z Grafika SVG otworzyły możliwości twórcom stron internetowych.

GraphicsJS to darmowa biblioteka open source i JS API dla budowanie niestandardowej grafiki w przeglądarkach internetowych. Może być używany jako narzędzie do wizualizacji do tworzenia wykresów danych lub może być używany do tworzenia fajnych rzeczy po prostu się popisywać.

Na stronie głównej znajdziesz duża część demonstracji stworzony za pomocą GraphicsJS. A te przykłady tylko zarysowują powierzchnię tego, co jest możliwe.

Biblioteka używa własnego wirtualnego DOM która jest abstrakcją DOM przeglądarki. To jest trochę podobny do wirtualnego DOM Reacta i jest używany w podobny sposób.

Ponieważ ta biblioteka używa klonu DOM, to również potrzebuje prawdziwych elementów HTML pracować nad. Dlatego to używa SVG / VML zamiast osadzonych obiektów w kanwie HTML5.

Ten silnik graficzny był pierwotnie wbudowany w bibliotekę AnyChart. Stamtąd było ulepszone i open-sourced jako własny JS API.

GraphicsJS obsługuje wszystkie główne przeglądarki, sięgając nawet do IE6 i Chrome 1.0.

Cały kod źródłowy jest dostępny w repozytorium GitHub, gdzie możesz pobrać kopię i grzebać wokoło, jeśli masz czas. Ale myślę, że najlepszym sposobem na naukę jest nurkowanie w pierwszej kolejności.

Możesz przeglądać Dokumenty API ale zwykle uważam, że te dokumenty są zbędne. Dokumenty najlepiej używać, gdy trzeba znajdź określoną metodę lub wywołanie API do odniesienia.

Jeśli dopiero zaczynasz, możesz odwiedź plac zabaw hostowane na stronie AnyChart. To miłe miejsce do znalezienia próbki kodu roboczego przełamać składnię.

Lub, jeśli naprawdę chcesz zacząć od kwadratu, a następnie Przewodnik startowy GraphicsJS może pomóc. To jest bardziej jak “urzędnik” dokumentacja, więc będzie trzymać rękę płynniejsza krzywa uczenia się w porównaniu do dokumentów API.

Tak czy inaczej, uwielbiam, że GraphicsJS był otwarty i udostępniony społeczności programistów. Nie jest to doskonała biblioteka, ale jest to jedna z najlepszych, jakie mamy tworzenie niestandardowej grafiki SVG od podstaw.

Aby włączyć swoje narzędzia, poniżej możesz zobaczyć przykład tego, co możesz zbudować za pomocą Graphics.js.