three.js
Pustaka JavaScript untuk Format Fail 3D
API JavaScript Sumber Terbuka untuk membaca, menulis dan menyatakan WebGL, FBX, Collada serta format fail OBJ melalui pustaka 3D Percuma.
three.js ialah pustaka JavaScript 3d tulen sumber terbuka yang mudah digunakan yang memberikan pembangun perisian keupayaan untuk memaparkan fail WebGL. Pustaka three.js menawarkan pemuat untuk pelbagai format fail seperti FBX, Collada serta OBJ tetapi format yang disyorkan untuk mengimport dan mengeksport data ialah glTF. Perkara yang menarik tentang format fail glTF ialah ia sangat padat dan boleh dihantar dengan mudah dan juga dimuatkan dengan sangat pantas.
Perpustakaan menyokong beberapa ciri penting yang berkaitan dengan model 3D seperti mencipta pemandangan, memuatkan model 3D, mencipta teks, melukis garisan menetapkan kamera, mencipta kiub geometri, menambah kiub pada pemandangan, memaparkan pemandangan, menambah ruang pandang pada elemen, dan banyak lagi. Terdapat kamera berbeza yang digunakan dalam pustaka three.js.
Sekali pandang
Gambaran keseluruhan ciri three.js.
- Buat adegan 3D
- Memuatkan model 3D
- Lukis garisan
- Baca/Tulis FBX
- Baca/Tulis Collada
- Tukar adegan 3D
- Eksport data dalam glTF
- pengendalian komponen
- mengendalikan tekstur
three.js menyokong format fail 3D popular yang disenaraikan di bawah.
Kemerdekaan Platform
three.js boleh dijalankan pada mana-mana pengikat JavaScript moden, pilihan paling popular ialah webpack.
- JavaScript
Bermula dengan three.js
Cara paling mudah untuk memasang three.js ialah dengan menggunakan npm. Sila gunakan arahan berikut untuk pemasangan yang lancar.
Pasang three.js melalui NPM
npm install --save three Cipta Adegan menggunakan JavaScript
Pustaka sumber terbuka three.js telah menyediakan sokongan untuk mencipta pemandangan 3D untuk memutar kiub di dalam aplikasi JavaScript mereka sendiri. Untuk memaparkan apa-apa dengan three.js kami memerlukan pemandangan, kamera dan pemapar. Anda boleh menggunakan kamera yang berbeza dan atributnya untuk melengkapkan pemandangan. Seterusnya, anda boleh menggunakan contoh pemapar dan tetapkan saiz yang kami mahu ia memaparkan apl kami. Anda boleh mengekalkan resolusi yang lebih rendah atau lebih tinggi. Akhir sekali, anda menambah elemen penyampai (<kanvas>) pada dokumen HTML anda. Anda boleh membuat kiub dengan mudah dengan menggunakan BoxGeometry dan menggunakan bahan untuk mewarnakannya. Selepas itu, anda memerlukan Mesh yang boleh dimasukkan ke dalam adegan dan dialihkan mengikut keperluan anda.
The open source library three.js has provided support for creating a 3D scene for spinning a cube inside their own JavaScript application. To display anything with three.js we require a scene, camera, and penyampai. You can use different cameras and their attribute to complete the scene. Next, you can use a penyampai instance and set the size at which we want it to render our app. You can keep the lower or higher resolution. Lastly, you add the penyampai element (<canvas>) to your HTML document. You can easily create a cube by using BoxGeometry and using the material to color it. After that, you need a Mesh that can be inserted into the scene and moved according to your need.
The open source library three.js has provided support for creating a 3D scene for spinning a cube inside their own JavaScript application. To display anything with three.js we require a scene, camera, and renderer. You can use different cameras and their attribute to complete the scene. Next, you can use a renderer instance and set the size at which we want it to render our app. You can keep the lower or higher resolution. Lastly, you add the renderer element (<canvas>) to your HTML document. You can easily create a cube by using BoxGeometry and using the material to color it. After that, you need a mesh that can be inserted into the scene and moved according to your need.
Memuatkan Model 3D melalui JavaScript
Pustaka three.js sumber terbuka membenarkan pengaturcara perisian memuatkan model 3D di dalam aplikasi mereka sendiri dengan hanya beberapa baris kod JavaScript. Model 3D tersedia dalam ratusan format fail. Setiap model didatangkan dengan tujuan berbeza, ciri pelbagai dan kerumitan yang berbeza. Pertama, anda perlu mempunyai pemuat dan selepas itu, anda akan dapat memuatkan tempat kejadian.
Lukis Garisan dalam Rajah
Pustaka sumber terbuka three.js telah menyediakan sokongan untuk melukis garisan atau bulatan di dalam aplikasi JavaScript mereka sendiri. Untuk bermula, kita perlu menyediakan pemapar, pemandangan dan kamera. Selepas itu, anda perlu menentukan bahan dan boleh menggunakan LineBasicMaterial atau LineDashedMaterial. Selepas bahan, kita akan memerlukan geometri dengan beberapa bucu. Garisan dilukis di antara setiap pasangan bucu yang berturutan.
