11 How to make 360 HDRI background three.js
Learn how to set an equirectangular HDRI image as your 360 degree background in three.js.
Learn how to find and download RBGELoader.js for three.module.js.
Learn how to put RGBELoader in code editor directory.
Learn how to change path in RGBELoader to find three.module.js in code editor directory.
Learn how to get free HDRI from Poly Haven.
Learn how to import and use RGBELoader to load HDRI into three.js.
Learn how to change render settings for HDRI.
You will need controls (e.g. Orbit Controls) to look around the environment.
Timestamps:
00:00 Intro/demo
00:18 How to find and download RGBELoader for three.module.js
00:57 How to put RGBELoader into code editor
01:06 How to change path in RGBE Loader to find three.module.js
01:30 How to get free HDRI at Poly Haven
02:20 How to import and use RGBELoader to load HDRI image to background in three.js
03:24 How to change render settings for HDRI three.js
Resources:
Poly Haven for free HDRIs:
https://polyhaven.com/
RGBELoader.js for three.module.js:
https://github.com/mrdoob/three.js/bl...
