In the above tutorial instead of using heavy 1MB .CUBE files, 26kb image files are used to generate the lut filter .
I was wondering if it was possible to use the same image in the LutPass ?
I tried using the method where the image is loaded on canvas then its written into the image key of a dataTexture . but the results seem way off. but works without errors.
is there something i’m missing here or is my entire approach wrong ?
i tried loading this image in https://threejsfundamentals.org/threejs/lessons/resources/images/identity-lut-s16.png (256x16)
and this is the result i got (its supposed to be the neutral LUT and should not have any effect)
JS fiddle https://jsfiddle.net/orion_prime/a4gpydes/38/
The banding in the sky makes me think you’re probably reading a HDRI texture as a linear texture. Maybe you need to set the encoding to THREE.RGBEEncoding as demonstrated in this answer? I’m not entirely sure if this is the issue, but worth a shot.
It does not. It should support a 16x256 image lut, though, because that is how the webgl api expects 3d textures to be arranged.
https://jsfiddle.net/orion_prime/a4gpydes/38/
Updated the fiddle with a toggle button and the lut image canvas is displayed on top the viewer
@marquizzo hdri is fine, its a problem with the lut texture not being read correctly. The lut image is a png so i’m using THREE.RGBFormat for the lut dataTexture (I removed every 4th element so i don’t need RGBA just like the the .CUBE files which dont have 4th value)
@gkjohnson its 256x16 and not 16 x256 right ? width x height
No. 256x16 would not work. 16x256 should work.
