Error when using EnvironmentTextureTools.CreateEnvTextureAsync in Node.js with null engine

I’m currently encountering an issue while attempting to convert an HDR texture to an environment texture using a null engine in a Node.js environment. I’m using the Babylon.js framework and attempting to utilize the EnvironmentTextureTools.CreateEnvTextureAsync method for this purpose. However, I’m facing errors related to rendering capabilities.

Here’s a snippet of the relevant code:
export default class HDRToEnvironmentTexture {
constructor() {
this.engine = new NullEngine({
renderWidth: 512,
renderHeight: 256,
textureSize: 512,
deterministicLockstep: false,
lockstepMaxSteps: 4
});
this.scene = new Scene(this.engine);
this.camera = new ArcRotateCamera(“camera”, Math.PI / 2, Math.PI / 2, 2, Vector3.Zero(), this.scene);
this.camera.setTarget(Vector3.Zero());
this.convertHDRTextureToEnv();
}
async convertHDRTextureToEnv() {
const path = ‘assets/outdoor_neutral.hdr’;
const hdrTexture = new Texture(path, this.scene);

hdrTexture.onLoadObservable.add(async () => {
  // Error occurs during the conversion process
  const envTexture = EnvironmentTextureTools.CreateEnvTextureAsync(hdrTexture)
    .then((buffer: ArrayBuffer) => {
      // Downloading the converted texture
      var blob = new Blob([buffer], { type: "octet/stream" });
      Tools.Download(blob, "environment.env");
    })
    .catch((error: any) => {
      console.error(error);
    });
});

I am getting error: Env texture can only be created when the browser supports half float or full float rendering.
The error seems to be related to rendering capabilities, but I’m uncertain how to proceed from here.

My requirement is to create cli tool to convert HDR to environment texture.
Any insights or suggestions on how to resolve this error and successfully convert the HDR texture to an environment texture would be greatly appreciated.

cc @sebavan

This tool can unfortunately only work in an environment with a “head” maybe you could try puppeteer or a web view ?

Babylon Native ideally can do it, but unfortunately there are some missing features that prevent it from working.

1 Like