Hi,
We need to position the avatar into HDRI environment on the ground, we controlled camera settings but we are not able to put the character to get realistic effect.
Can somebody suggest some approach like in blender to position the character
Initially we were able to achieve the same using blender, but glb/gltf format does not support HDRI textures to run from babylonjs.
Thanks
vijay
Leon
November 10, 2023, 7:18am
2
I have created a minimal template for getting up and running with the latest babylon + typescript + hdri environment.
you can create your own by running
npm init babylon@latest
Or you can see the source code for how to init a environment which both acts as the background and the reflection map.
import { BackgroundMaterial } from '@babylonjs/core/Materials/Background/backgroundMaterial'
import { CubeTexture } from '@babylonjs/core/Materials/Textures/cubeTexture'
import { Texture } from '@babylonjs/core/Materials/Textures/texture'
import { CreateBox } from '@babylonjs/core/Meshes/Builders/boxBuilder'
import { Scene } from '@babylonjs/core/scene'
import '@babylonjs/core/Materials/Textures/Loaders/envTextureLoader' // needed for environment texture
import '@babylonjs/core/Misc/dds' // needed for environment texture
export function createEnvironment(scene: Scene) {
const environmentTexture = CubeTexture.CreateFromPrefilteredData('/environments/environment-specular.env', scene)
scene.environmentTexture = environmentTexture
const skyBox = CreateBox('skyBox', { size: 1000 }, scene)
skyBox.isPickable = false
skyBox.infiniteDistance = true
skyBox.ignoreCameraMaxZ = true
const skyBoxMaterial = new BackgroundMaterial('skyBoxMaterial', scene)
skyBox.material = skyBoxMaterial
skyBoxMaterial.reflectionTexture = environmentTexture.clone()
This file has been truncated. show original
2 Likes
Thanks @Leon for the help…
trying to create PG with yur logic…unable to import external materials into PG
import { CubeTexture } from ‘@babylonjs /core/Materials/Textures/cubeTexture’
can u throw some light how to incorporate this stuff into PG
Thanks
vijay
labris
November 10, 2023, 1:35pm
4
It is already there. To get it just use BABYLON.CubeTexture
Thanks @labris for the help…
@Leon using hdri(CreateFromPrefilteredData) unable to load the scene…
using blender, this is possible.
could u help us to achieve the same using babylonjs
Thanks
vijay
sebavan
November 20, 2023, 8:24pm
6
You are not using the right texture type https://playground.babylonjs.com/#19JGPR#370
Also if you want to move it on the ground you need Skyboxes | Babylon.js Documentation
1 Like
Thanks @sebavan
trying ground projection along with shadows by using skyboxes…
like in blender how can i apply Holdout Mask for the ground to get the shadow ?
can u throw some light here…
sebavan
November 21, 2023, 7:15pm
8
@sebavan its working…
for all 3d environments in .env format
But we have HDR format models, tried this logic for HDR environments, it failed
am just trying to change the logic …
sebavan
November 22, 2023, 4:43pm
10
It is exactly what I explained in the first answer, you are not using the correct texture type…
2 Likes