Saya telah merilis Grafar - pustaka JS untuk rendering

Saya telah membuka grafar - perpustakaan saya untuk rendering. Sebagian besar kode ditulis pada 2013-2016 untuk tesis saya. Selama 5 tahun ke depan, proyek ini belum selesai - saya kurang puas dengan API-nya, ada banyak fitur keren yang bisa saya tambahkan, pekerjaannya payah, dan ada ribuan alasan lagi untuk tidak merilisnya. , kamu tahu. Lagipula, ada begitu banyak orang di dunia ini yang lebih pintar dariku, dan mereka pasti akan menghasilkan sesuatu yang lebih baik, bukan?





Minggu lalu saya menemukan kode yang indah ini mengumpulkan debu di github lagi - saya pikir itu masih terlihat keren dan saya yakin itu akan menghemat banyak waktu seseorang. Jadi saya menyediakan proyek dengan dokumentasi kelas dunia, memperbarui build, dan memulai mode hype.





Sejujurnya, ini adalah rilis publik pertama dari graphar tersebut. Kemungkinan besar, ada bug di dalamnya, dan saya tidak bisa menjanjikan stabilitas penuh dari API selamanya. Tapi tetap saja, saya yakin Anda harus memperhatikan grafiknya, dan inilah alasannya:





API sederhana. Hanya dengan 10 baris kode, Anda telah membangun tampilan langsung di browser Anda. API diarahkan untuk bekerja dengan objek matematika - kurva, permukaan, titik - dan menggunakan model topologi objek yang cerdik untuk membuat semuanya bekerja seperti yang diharapkan.





. -, , , , — 1 30FPS. WebGL , .





c 3D 2D. ThreeJS, 3D — , . 2D, .





. Grafar — (- MobX). , , .





, , . codesandbox.





— . :





const p = grafar.range(-2, 2, 500).select();
const q = grafar.range(0, 1, 2).select();
      
      



([-2, 2] p, [0, 1] q) , .





(x,y,z):





const xp = grafar.map([p, q], (p, q) => Math.cos(8 * p) * q);
const yp = grafar.map([p, q], (p, q) => Math.sin(8 * p) * q);
      
      



. -, , p q — , . -, xp yp — p q, xp yp .





, — :





const container = document.getElementById("app");
const panel = grafar.panel(container);
grafar.pin([xp, yp, p], panel);
      
      



7 :






, — , grafar. :





. , , . — , .





Jika Anda tertarik dengan perpustakaannya, lihat dokumentasinya (sejauh ini hanya dalam bahasa Inggris). Kode perpustakaan lengkap tersedia di github . Dalam ishyus dapat mengeluh tentang bug atau meminta Anda untuk mengambil bagian dalam pengembangan (saya tidak membantu mencegah).





Bagaimanapun, saya harap Anda menganggapnya menarik. Semoga berhasil dengan grafik!








All Articles