Перейти к содержимому

Урок по React Three Fiber: как накладывать изображения на 3D-объекты

Wawa Sensei

0:00 / 0:00

Урок по React Three Fiber: как накладывать изображения на 3D-объекты

15 246 просмотров · 2 года назад
Wawa Sensei
34,4 тыс. подписчиков
15 246 просмотров · 2 года назад
Давайте научимся создавать персонализированные 3D-изделия, такие как кружки, футболки, сумки или любые сложные 3D-формы, используя текстуры изображений. В этом уроке мы рассмотрим компонент Decal из React Three Fiber. Другой предложенный способ — использование CanvasTexture для создания пользовательской текстуры, применяемой к материалу. 🚀 Изучите React Three Fiber с помощью моего полного курса ✨ https://lessons.wawasensei.dev/course... Стартовый пакет 🔗 https://github.com/wass08/r3f-vite-st... Финальный код 🔗 https://github.com/wass08/r3f-mug #threejs #developer #reactjs ▬▬▬▬▬▬ Полезные ссылки 🔗 ▬▬▬▬▬▬ Decal https://github.com/pmndrs/drei#decal HTML Canvas https://www.w3schools.com/graphics/ca... CanvasTexture https://threejs.org/docs/#api/en/text... Пример с кроликом https://codesandbox.io/s/ymb5d9?file=... Пример с кольцом https://codesandbox.io/s/ring-decals-... Пример с кружкой Mug3D https://mug3d.com/?model=1 ▬▬▬▬▬▬ ВРЕМЕННЫЕ МЕТКИ ⏰ ▬▬▬▬▬▬ 00:00 - Вступление 00:29 - Настройка проекта 01:03 - Концепция 02:56 - Наклейка 07:38 - Подготовка объекта Blender 12:31 - Применение к 3D-объекту 15:38 - Динамический конфигуратор 24:46 - Конечный результат 25:01 - Спасибо! ▬▬▬▬▬▬ Поддержите канал 🙏 ▬▬▬▬▬▬ Станьте участником, чтобы получить доступ к потрясающим бонусам:    / @wawasensei   ▬▬▬▬▬▬ Свяжитесь со мной 👋 ▬▬▬▬▬▬ 💻 Сообщество Discord   / discord   📸 Instagram:   / wawa.sensei   🎎 Facebook:   / wawasenseiyt   🐦 Twitter:   / wawasensei   🐦ТикТок:   / wawasensei08   💻Мой сайт: https://www.wawasensei.dev