Loading texture from panorama image and attach my glb to ground

loading texture from panorama image and attach my glb to ground of the texture and make car texture reflext on my glb
my glb is car i want to create texture for it

You can find an example here : Babylon.js docs

And for you panorama image, you’ll need an equirectangular image

1 Like

it is cut like this and pixelated
i convert my panorama to hdr and use it

this is function i use
const createSky = (scene: Scene, textureSrc: string) => {

const skydome = MeshBuilder.CreateBox(
“sky”,
{ size: 100, sideOrientation: Mesh.BACKSIDE },
scene
);
skydome.position.y = 50;
skydome.isPickable = false;
skydome.receiveShadows = true;
const sky = new BackgroundMaterial(“skyMaterial”, scene);
sky.reflectionTexture = new HDRCubeTexture(textureSrc, scene, 512);
sky.reflectionTexture.coordinatesMode = Texture.SKYBOX_MODE;
sky.enableGroundProjection = true;
sky.projectedGroundRadius = 20;
sky.projectedGroundHeight = 3;
skydome.material = sky;

return skydome;
};

It looks like the panorama texture doesn’t loop properly. Did you try to check noth side are exactly the same? Maybe @PatrickRyan has some tips to improve quality?

can i make dom with image like this

You can make a mesh and then parent that mesh to the camera. It’s less efficient than a regular skybox because of unused space in the texture but it’s totally possible.

Did you check this page and accompanying examples? Babylon.js docs

1 Like

It does appear in your skybox that the conversion did clip out some pixels. If you want to test, you can grab any environment from HDRIs • Poly Haven and test it out. These are all pixel perfect for wrapping. I agree with Cedric that the skybox approach is the best way as it is more efficient with using all texels and with triangles in scene. The skybox will be 12 triangles total for the cube holding the skybox. From looking at the unwrap you have, there are far more than 12 triangles in your environment mesh.

From the standpoint of extensibility, the skybox is also easier as any properly projected equirectangular HDRI can be swapped by just by pointing at the new image. With a custom environment mesh, you will need to bake out the texture for each new skybox. Either path can be a viable route for your project depending on your pipeline, but I wanted to point out some of the shortcuts that the standard environment and skybox route offers.

1 Like

so it will not be pixlated?

@PatrickRyan
this is aprroach i am using as i have car glb i want to put it on ground

i use 8k hdr it still pixlated do you know why?

@Niazy_Eladawy, can you share another PG with your environment online? This one is linking a localhost env file so I just see an unlit sphere with a little specular reflection:

i changed this value now it is looks good

1 Like