Есть ли альтернатива HDR картам в three js?

Ссылка скопирована
1 ответ

Через RGBELoader загружаю окружение в формате hdr.
Возможно ли в каком то более сжатом формате загрузить окружение? HDR про размеру примерно как png, а хотелось бы что то типа webp, который в разы меньше практически с таким же качеством.

Дополнительно:

Ну как бы это и есть прикол HDR.
HDR по определению должен давать десятибитный цвет как минимум.

Webp только 8 бит

Ответы:

Я знаю как, написать свой HDR формат

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Никита Орлов Ответ

Да, в three.js есть альтернатива HDR картам - это CubeMaps. CubeMaps - это текстуры, которые представляют собой шесть 2D изображений, расположенных на грани куба. Они используются для создания отражений и окружения в сценах 3D.

Чтобы использовать CubeMaps в three.js, вам нужно загрузить каждое изображение каждой грани куба с помощью THREE.CubeTextureLoader. Затем создайте CubeTexture, указав массив из шести загруженных изображений.

Пример загрузки CubeMaps в three.js:

// Создаем загрузчик текстур
var loader = new THREE.CubeTextureLoader();
 
// Загружаем изображения для каждой грани куба
var texture = loader.load([
  'pos-x.jpg',
  'neg-x.jpg',
  'pos-y.jpg',
  'neg-y.jpg',
  'pos-z.jpg',
  'neg-z.jpg'
]);
 
// Создаем CubeTexture
var cubeTexture = new THREE.CubeTexture(texture);

// Создаем загрузчик текстур var loader = new THREE.CubeTextureLoader(); // Загружаем изображения для каждой грани куба var texture = loader.load([ 'pos-x.jpg', 'neg-x.jpg', 'pos-y.jpg', 'neg-y.jpg', 'pos-z.jpg', 'neg-z.jpg' ]); // Создаем CubeTexture var cubeTexture = new THREE.CubeTexture(texture);

После того, как вы загрузите и создадите CubeTexture, вы можете использовать его для создания отражений и окружения в вашей сцене three.js. Например, вы можете установить CubeTexture как карту окружения для вашего материала с помощью метода .envMap:

// Создаем материал
var material = new THREE.MeshBasicMaterial({
  envMap: cubeTexture
});

// Создаем материал var material = new THREE.MeshBasicMaterial({ envMap: cubeTexture });

Таким образом, CubeMaps представляют собой хорошую альтернативу HDR картам в three.js для создания отражений и окружения в ваших 3D сценах. Надеюсь, это поможет вам в вашем проекте!

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно