three.js
JavaScript könyvtár 3D fájlformátumokhoz
Nyílt forráskódú JavaScript API a WebGL, FBX, Collada és OBJ fájlformátumok olvasásához, írásához és megjelenítéséhez ingyenes 3D könyvtáron keresztül.
A three.js egy nyílt forráskódú, könnyen használható, tiszta JavaScript 3D-s könyvtár, amely lehetővé teszi a szoftverfejlesztők számára WebGL-fájlok megjelenítését. A three.js könyvtár számos fájlformátumhoz kínál betöltőket, például FBX, Collada és OBJ, de az ajánlott formátum az adatok importálásához és exportálásához a glTF. A glTF fájlformátum nagyszerűsége az, hogy nagyon kompakt, könnyen továbbítható és nagyon gyorsan betöltődik.
A könyvtár számos, a 3D modellekkel kapcsolatos fontos funkciót támogat, mint például jelenet létrehozása, 3D modellek betöltése, szöveg létrehozása, vonalak rajzolása, kamera beállítása, geometriai kocka létrehozása, kocka hozzáadása a jelenethez, a jelenet renderelése, nézetablak hozzáadása az elemhez, és még sok más. A three.js könyvtárban különböző kamerákat használnak.
Ránézésre
A three.js funkciók áttekintése.
- Hozzon létre 3D-s jeleneteket
- 3D modellek betöltése
- Vonalakat rajzolni
- FBX olvasása/írása
- Collada olvasása/írása
- 3D jelenetek konvertálása
- Adatok exportálása glTF-be
- alkatrészek kezelése
- kezelni a textúrákat
A three.js támogatja az alább felsorolt népszerű 3D fájlformátumokat.
Platformfüggetlenség
A three.js bármely modern JavaScript-csomagolón futtatható, a legnépszerűbb választás a webpack.
- JavaScript
Első lépések a three.js használatával
A three.js telepítésének legegyszerűbb módja az npm használata. Kérjük, használja a következő parancsot a zökkenőmentes telepítéshez.
Telepítse a thre.js fájlt NPM-en keresztül
npm install --save three Jelenet létrehozása JavaScript használatával
A három.js nyílt forráskódú könyvtár támogatást nyújtott egy 3D-s jelenet létrehozásához, amely a saját JavaScript-alkalmazásukon belüli kocka pörgetéséhez szükséges. A three.js használatával bárminek megjelenítéséhez jelenetre, kamerára és rendererre van szükségünk. Különböző kamerákat és azok jellemzőit használhatja a jelenet befejezéséhez. Ezután használhat egy renderelőpéldányt, és beállíthatja, hogy milyen méretben jelenítse meg az alkalmazásunkat. Megtarthatja az alacsonyabb vagy nagyobb felbontást. Végül hozzáadja a renderer elemet (<canvas>) a HTML-dokumentumhoz. Könnyen létrehozhat kockát a BoxGeometry használatával és az anyag színezésével. Ezt követően egyMeshre van szüksége, amely beilleszthető a jelenetbe, és az Ön igényei szerint mozgatható.
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 renderelő. You can use different cameras and their attribute to complete the scene. Next, you can use a renderelő 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 renderelő 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 Háló that can be inserted into the scene and moved according to your need.
3D modellek betöltése JavaScripten keresztül
A nyílt forráskódú three.js könyvtár lehetővé teszi a szoftverprogramozók számára, hogy 3D modelleket töltsenek be saját alkalmazásukba, mindössze néhány soros JavaScript kóddal. A 3D modellek több száz fájlformátumban állnak rendelkezésre. Minden modell más-más céllal, különféle funkciókkal és eltérő összetettséggel rendelkezik. Először is szüksége van egy betöltőre, és ezt követően képes lesz betölteni a jelenetet.
Rajzolj vonalakat egy diagramon
A három.js nyílt forráskódú könyvtár támogatást nyújtott vonalak vagy körök rajzolásához saját JavaScript-alkalmazásukon belül. Először is be kell állítanunk a renderert, a jelenetet és a kamerát. Ezt követően meg kell határoznia az anyagot, és használhatja a LineBasicMaterial vagy LineDashedMaterial elemet. Az anyag után szükségünk lesz néhány csúcsos geometriára. Az egymást követő csúcspárok között vonalakat húzunk.
