Error: Unsupported babylon environment map version "2"

Hello,
I’d need to export a .env file to set as environment texture.
I’m setting it with this cubeTexture instance as written in the docs:

this.scene.environmentTexture = new CubeTexture("./assets/images/configurator/environment2.env", this.scene);

And it works fine when using your example .env texture (country.env).

I tried to generate a .dds texture through this process ( Resource → BabylonJS Documentation )

  • Downloaded IBLBaker app
  • Loaded an hdr texture
  • Saved the environment

Then I followed your steps about creating a compressed environment texture using the Sandbox (Doc → Using An HDR Environment For PBR | Babylon.js Documentation )

  • Uploaded a PBR scene
  • Uploaded the generated .dds file
  • Exported the .env texture

But, when i load it i get this error (that didn’t occurred with the country.env):

Error: Unsupported babylon environment map version "2"

In fact, when I open in the text editor the .env, the first part has this infos:

{"version":2,"width":256,"imageType":"image/png","irradiance"....ecc

while the country.env one has:

{"version":1,"width":128,"irradiance"...ecc

I’ve searched for solutions but couldn’t find a way to have a final .env texture with the version 1.

Do you have some advice, by any chance?

Thank you very much in advance

Two solutions:

  1. (preferred) You upgrade your code to the latest preview so you benefit as well from our latest improvments.
  2. you could use the code snippet from this answer: .env conversion from .hdr throws an error - #6 by sebavan
2 Likes

Hello @sebavan and thank you for your fast answer.
I tried both of your solutions but encountered some problems:

  1. I’m using Angular framework with typescript. The library I had installed was this:
"@babylonjs/core": "^4.2.0",
"@babylonjs/inspector": "^4.2.0",

I updated the library to the latest alpha as you suggested:

    "@babylonjs/core": "^5.0.0-alpha.60",
    "@babylonjs/inspector": "^5.0.0-alpha.60",

but now i’m getting some blocking errors while serving the app (and probably other more once the app is served):


The following, are the dependencies of this project. Do you know if Babylon relies on some of them that need to be updated too?

  "dependencies": {
    "@angular/animations": "~11.0.9",
    "@angular/cdk": "^11.1.0",
    "@angular/common": "~11.0.9",
    "@angular/compiler": "~11.0.9",
    "@angular/core": "~11.0.9",
    "@angular/forms": "~11.0.9",
    "@angular/localize": "^9.0.6",
    "@angular/material": "^11.1.0",
    "@angular/platform-browser": "~11.0.9",
    "@angular/platform-browser-dynamic": "~11.0.9",
    "@angular/platform-server": "~11.0.9",
    "@angular/router": "~11.0.9",
    "@babylonjs/core": "^5.0.0-alpha.60",
    "@babylonjs/inspector": "^5.0.0-alpha.60",
    "@ckeditor/ckeditor5-build-classic": "^19.0.0",
    "@ng-bootstrap/ng-bootstrap": "^6.0.0",
    "@nguniversal/express-engine": "^11.0.1",
    "@ngx-translate/core": "^12.1.2",
    "@ngx-translate/http-loader": "^4.0.0",
    "@types/jquery": "^3.3.32",
    "bowser": "^2.9.0",
    "ckeditor4-angular": "^1.1.0",
    "domino": "^2.1.6",
    "express": "^4.15.2",
    "font-awesome": "^4.7.0",
    "gsap": "^3.1.1",
    "jquery": "^3.4.1",
    "localstorage-polyfill": "^1.0.1",
    "locomotive-scroll": "^3.3.9",
    "ngx-auto-unsubscribe": "^3.0.1",
    "ngx-infinite-scroll": "^8.0.1",
    "ngx-slick-carousel": "^0.4.7",
    "rxjs": "~6.5.4",
    "scrollmagic": "^2.0.7",
    "scrollmagic-plugin-gsap": "^1.0.4",
    "slick-carousel": "^1.8.1",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1100.7",
    "@angular/cli": "~11.0.7",
    "@angular/compiler-cli": "~11.0.9",
    "@angular/language-service": "~9.0.1",
    "@nguniversal/builders": "^11.0.1",
    "@types/express": "^4.17.0",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.1.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2",
    "ws": "^7.4.4",
    "xmlhttprequest": "^1.8.0"
  }

Or could it be a Typescript problem?

  1. After failing with the first way I tried the second process, but after the download of the downgraded version, the new .env seems to lose the main part, so it doesn’t read it correctly and throws an error:
����֖6{"version":1,"width":0,"irradiance":null,"specular":{"mipmaps":[],"lodGenerationScale":0.8}}

It’s only made of this line of code…

Thank you :slight_smile:

I guess you should update your version of typescript, @RaananW could help with this ?

1 Like

This would be my answer as well. What version of typescript are you using?

TypeScript 4.4 should have this defined.

1 Like

@sebavan @RaananW thank you to the both of you!
I was using 4.0.2, now i’ve updated it to the latest version (4.4.4) and it works perfectly.
Thanks again for the support :sunny:

3 Likes