GraphicsJS Memungkinkan Anda Membuat Gambar Web Apa Saja yang Dapat Anda Bayangkan

API JavaScript Khusus adalah masa depan web. Itu gerakan open source ditambah dengan Grafik SVG telah membuka kemungkinan untuk pengembang web.

GraphicsJS adalah perpustakaan sumber terbuka gratis dan API JS untuk membangun grafik khusus di browser web. Dapat digunakan sebagai alat visualisasi untuk membuat grafik data, atau dapat digunakan untuk membuat hal-hal keren hanya untuk pamer.

Di beranda, Anda akan menemukan a bagian besar dari demo dibuat dengan GraphicsJS. Dan contoh-contoh ini hanya menggores permukaan dari apa yang mungkin.

Perpustakaan menggunakan DOM virtualnya sendiri yang merupakan abstraksi dari DOM browser. Ini agak mirip dengan DOM virtual React dan itu digunakan dengan cara yang serupa.

Karena perpustakaan ini menggunakan klon dari DOM, itu juga membutuhkan elemen HTML nyata untuk dikerjakan. Itu sebabnya menggunakan SVG / VML daripada objek yang tertanam di kanvas HTML5.

Mesin grafis ini dulu awalnya dibangun ke perpustakaan AnyChart. Dari sana, itu tweak dan open-source sebagai JS API-nya sendiri.

GraphicsJS mendukung semua browser utama, bahkan dating kembali ke IE6 dan Chrome 1.0.

Semua kode sumber tersedia di repo GitHub di mana Anda dapat mengunduh salinan dan melihat-lihat jika ada waktu. Tapi saya pikir cara terbaik untuk belajar adalah menyelam terlebih dahulu.

Anda dapat menelusuri Dokumentasi API tapi saya biasanya menemukan dokumen ini berlebihan. Dokumen paling baik digunakan saat Anda membutuhkannya temukan metode atau panggilan API tertentu untuk referensi.

Jika Anda baru memulai, Anda bisa kunjungi taman bermain di-host di situs web AnyChart. Ini adalah tempat yang bagus untuk mencari sampel kode kerja untuk memecah sintaks.

Atau, jika Anda benar-benar ingin memulai dengan kuadrat maka Panduan awal GraphicsJS bisa membantu. Ini lebih seperti “resmi” dokumentasi sehingga akan memegang tangan Anda untuk kurva belajar lebih lancar dibandingkan dengan dokumentasi API.

Either way, saya suka bahwa GraphicsJS terbuka bersumber dan dirilis ke komunitas pengembang. Ini jauh dari perpustakaan yang sempurna tetapi ini adalah salah satu yang terbaik yang kami miliki membuat grafik SVG khusus dari awal.

Dan untuk mengubah gigi Anda, di bawah ini Anda dapat melihat contoh apa yang dapat Anda buat dengan Graphics.js.