Warning from threejs - "image is not power of two"



I want to render an image onto a 2d canvas. The image size is 4032x3024.
When calling

renderer.render(scene, camera);

I get a warning message:

image is not power of two (4032x3024). Resized to 2048x2048

This warning comes from the file three.js, from the function makePowerOfTwo( image )

Following the warning, the rendered image looks ok (in terms of aspect ratio)
To get rid of the warning, I can pre-process the image beforehand and resize it to be a power of 2, but this will distort the aspect ratio of the image.

How can I address the warning, and still keep the aspect ratio of the image?




This warning is only logged when using WebGL1 since you need power-of-two (POT) textures for mipmapping. There are a few options to avoid this message. You can disable mipmapping by:

  • Set Texture.minFilter to THREE.LinearFilter
  • Set Texture.generateMipmaps to false

You can also use a WebGL 2 rendering context. Or you just ensure your image is POT.