three.js
JavaScript библиотека за 3D файлови формати
JavaScript API с отворен код за четене, писане и изобразяване на WebGL, FBX, Collada, както и OBJ файлови формати чрез безплатна 3D библиотека.
three.js е лесна за използване чиста JavaScript 3d библиотека с отворен код, която дава възможност на разработчиците на софтуер да изобразяват WebGL файлове. Библиотеката three.js предлага програми за зареждане за множество файлови формати като FBX, Collada, както и OBJ, но препоръчителният формат за импортиране и експортиране на данни е glTF. Страхотното при файловия формат glTF е, че е много компактен и може лесно да се предава, а също така се зарежда много бързо.
Библиотеката поддържа няколко важни функции, свързани с 3D модели, като създаване на сцена, зареждане на 3D модели, създаване на текст, чертане на линии, настройка на камера, създаване на геометричен куб, добавяне на куб към сцената, изобразяване на сцената, добавяне на прозорец за изглед към елемент, и много други. В библиотеката three.js се използват различни камери.
С един поглед
Общ преглед на функциите на three.js.
- Създавайте 3D сцени
- Зареждане на 3D модели
- Начертайте линии
- Четене/Писане на FBX
- Четене/Писане на Collada
- Конвертирайте 3D сцени
- Експортиране на данни в glTF
- обработка на компоненти
- текстури на дръжките
three.js поддържа популярни 3D файлови формати, изброени по-долу.
Независимост на платформата
three.js може да се изпълнява на всеки модерен JavaScript пакет, като най-популярният избор е webpack.
- JavaScript
Първи стъпки с three.js
Най-лесният начин да инсталирате three.js е като използвате npm. Моля, използвайте следната команда за гладка инсталация.
Инсталирайте three.js чрез NPM
npm install --save three Създайте сцена с помощта на JavaScript
Библиотеката с отворен код three.js предостави поддръжка за създаване на 3D сцена за въртене на куб в тяхното собствено JavaScript приложение. За да покажем нещо с three.js, имаме нужда от сцена, камера и рендър. Можете да използвате различни камери и техните атрибути, за да завършите сцената. След това можете да използвате екземпляр за изобразяване и да зададете размера, на който искаме да изобразява нашето приложение. Можете да запазите по-ниската или по-високата резолюция. Накрая добавяте елемента renderer (<canvas>) към вашия HTML документ. Можете лесно да създадете куб, като използвате BoxGeometry и използвате материала, за да го оцветите. След това се нуждаете от мрежа, която може да бъде вмъкната в сцената и преместена според вашите нужди.
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 визуализатор. You can use different cameras and their attribute to complete the scene. Next, you can use a визуализатор 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 визуализатор 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 Мрежа that can be inserted into the scene and moved according to your need.
Зареждане на 3D модели чрез JavaScript
Библиотеката с отворен код three.js позволява на софтуерните програмисти да зареждат 3D модели в собственото си приложение само с няколко реда JavaScript код. 3D моделите се предлагат в стотици файлови формати. Всеки модел се предлага с различни цели, различни функции и различна сложност. Първо, трябва да имате товарач и след това ще можете да заредите сцената.
Начертайте линии в диаграма
Библиотеката с отворен код three.js е предоставила поддръжка за рисуване на линии или кръгове в тяхното собствено JavaScript приложение. Като начало трябва да настроим рендера, сцената и камерата. След това трябва да дефинирате материала и можете да използвате LineBasicMaterial или LineDashedMaterial. След материала ще ни трябва геометрия с някои върхове. Между всяка последователна двойка върхове се чертаят линии.
