Displaying the Content of HDR Files in Equirectangular Mode

Questions
1

I don’t want to display it in six pictures.

image

I would like to use an Equirectangular diagram to demonstrate, for example:

image
image1026×511 63.4 KB

Display it on the texture in this way so that canvas can see it.

How can I operate it?

2

Hello :slight_smile:

What you need is

const skyTexture = new BABYLON.EquiRectangularCubeTexture(textureURL, scene, 1024);
skyboxMaterial.reflectionTexture = skyTexture
skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE;

Here is a Playground using URL of your image on previous post

++
Tricotou

3

This is an. hdr file, not a. jpg image, I want to use HDR to display on the canvas page, such as：
image

4

https://playground.babylonjs.com/#2FDQT5#2700 would work

5

Great, that’s exactly what I want. I will go and understand the principle. Thank you. Fortunately, this post did not sink :smile:

6

@sebavan If it is an env file, can it be displayed on canvas using EquiRectangular

7

nope, as env are CubeTextures internally you would need to convert

8

Do you have specific steps?

9

you should look into cube to panorama shaders this should be able to convert.

10

Okay, I’ll study it