В этом посте мы собираемся обсудить одну из очень интересных библиотек JavaScript — Three.js, поэтому давайте поговорим о:
Что такое Three.js?
Three.js — это библиотека JavaScript с открытым исходным кодом, которая используется для отображения графики, 3D- и 2D-объектов в веб-браузере. Он использует API WebGL за кулисами.
Three.js позволяет вам использовать ваш GPU (графический процессор) для рендеринга графики и 3D-объектов на холсте в веб-браузере. поскольку мы используем JavaScript, мы также можем взаимодействовать с другими элементами HTML.
Three.js был выпущен Рикардо Кабельо в апреле 2010 года.
Почему мы используем Three.js?
1. Поскольку Three.js является открытым исходным кодом, поэтому мы можем легко просмотреть исходный код и понять функциональность кода (функций).
2. Когда мы используем WebGL для графики, он не поддерживает большинство браузеров, но Three.js поддерживает большинство браузеров.
3. Для запуска кода не требуется никаких сторонних плагинов.
4. Вам просто нужно работать только на одном языке программирования JavaScript и конечно HTML.
Начало работы
Вы можете установить three.js с помощью npm и современных инструментов сборки или быстро начать работу, используя только статический хостинг или CDN. Для большинства пользователей установка из npm — лучший выбор.
Что бы вы ни выбрали, будьте последовательны и импортируйте все файлы из одной и той же версии библиотеки. Смешивание файлов из разных источников может привести к включению дублирующегося кода или даже к неожиданной поломке приложения.
Все способы установки three.js зависят от ES-модулей (см. Eloquent JavaScript: ECMA Script Modules), которые позволяют включать в конечный проект только те части библиотеки, которые нужны.
Установить из npm
Чтобы установить три модуля npm, откройте окно терминала в папке вашего проекта и запустите:
Пакет будет загружен и установлен. Теперь вы готовы импортировать его в свой код:
Теперь вы можете работать с Three.js.
Вы также можете проверить некоторые творческие веб-сайты, созданные с использованием Three.js:
