three.js
Knihovna JavaScript pro 3D formáty souborů
Open Source JavaScript API pro čtení, zápis a vykreslování formátů souborů WebGL, FBX, Collada a OBJ prostřednictvím bezplatné 3D knihovny.
three.js je open source snadno použitelná 3D knihovna čistého JavaScriptu, která dává vývojářům softwaru možnost vykreslovat soubory WebGL. Knihovna three.js nabízí zavaděče pro řadu formátů souborů, jako je FBX, Collada a OBJ, ale doporučený formát pro import a export dat je glTF. Skvělá věc na formátu souboru glTF je, že je velmi kompaktní a lze jej snadno přenášet a také se velmi rychle načítá.
Knihovna podporuje několik důležitých funkcí souvisejících s 3D modely, jako je vytváření scény, načítání 3D modelů, vytváření textu, kreslení čar nastavení kamery, vytvoření geometrické krychle, přidání krychle do scény, vykreslení scény, přidání výřezu k prvku, a mnoho dalších. V knihovně three.js se používají různé kamery.
Na první pohled
Přehled funkcí tři.js.
- Vytvářejte 3D scény
- Načítání 3D modelů
- Kreslit čáry
- Čtení/zápis FBX
- Read/Write Collada
- Převeďte 3D scény
- Export dat v glTF
- manipulace s komponentami
- manipulovat s texturami
three.js podporuje oblíbené formáty 3D souborů uvedené níže.
Nezávislost na platformě
three.js lze spustit na jakémkoli moderním balíku JavaScriptu, nejoblíbenější volbou je webpack.
- JavaScript
Začínáme s three.js
Nejjednodušší způsob instalace three.js je pomocí npm. Pro bezproblémovou instalaci použijte prosím následující příkaz.
Nainstalujte si three.js prostřednictvím NPM
npm install --save three Vytvořte scénu pomocí JavaScriptu
Open source knihovna three.js poskytla podporu pro vytváření 3D scény pro otáčení krychle uvnitř jejich vlastní JavaScriptové aplikace. K zobrazení čehokoli s three.js potřebujeme scénu, kameru a renderer. K dokončení scény můžete použít různé kamery a jejich atribut. Dále můžete použít instanci rendereru a nastavit velikost, ve které chceme, aby vykreslovala naši aplikaci. Můžete ponechat nižší nebo vyšší rozlišení. Nakonec do dokumentu HTML přidáte prvek renderer (<canvas>). Kostku můžete snadno vytvořit pomocí BoxGeometry a pomocí materiálu ji vybarvit. Poté potřebujete Síť, kterou lze vložit do scény a přesunout podle potřeby.
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.
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 Pletivo that can be inserted into the scene and moved according to your need.
Načítání 3D modelů přes JavaScript
Open source knihovna three.js umožňuje softwarovým programátorům načíst 3D modely do jejich vlastní aplikace pomocí pouhých několika řádků kódu JavaScript. 3D modely jsou dostupné ve stovkách formátů souborů. Každý model přichází s různými účely, různými funkcemi a různou složitostí. Nejprve musíte mít nakladač a poté budete moci načíst scénu.
Kreslení čar v diagramu
Open source knihovna three.js poskytla podporu pro kreslení čar nebo kruhů uvnitř jejich vlastní JavaScriptové aplikace. Nejprve musíme nastavit renderer, scénu a kameru. Poté musíte definovat materiál a můžete použít LineBasicMaterial nebo LineDashedMaterial. Po materiálu budeme potřebovat geometrii s některými vrcholy. Mezi každým po sobě jdoucím párem vrcholů jsou nakresleny čáry.
