mpetroff / pannellum

Pannellum is a lightweight, free, and open source panorama viewer for the web.

Home Page:https://pannellum.org/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

gl.REPEAT is used for non-power-of-two images when in dynamic mode and the image size changes

bartzy opened this issue · comments

Hi,

Following your changes in #1135, I tried to implement it and I think I stumbled on an unrelated bug:
When we change images, their dimensions might change. In libpannellum.js:501, TEXTURE_WRAP_S is set to REPEAT, which is only allowed for POT (power-of-two) images. This is not changed when the dynamic flag is true and the texture is uploaded again:

gl.texParameteri(glBindType, gl.TEXTURE_WRAP_S, gl.REPEAT); // Only supported for power-of-two images in WebGL 1

How to reproduce:

  1. Use dynamic = true and pass a POT canvas (512x256 in our case).
  2. Change the canvas size to NPOT (3840x2160 in some of our cases).
  3. Execute viewer.updateOnce() or viewer.setUpdate(true) - You should see a black screen.

Why TEXTURE_WRAP_S is set to REPEAT when the image is a power-of-two?

Note: I didn't encounter this issue so far in production, because our pannellum code was pretty old. I'm not upgrading it to incorporate the changes in #1135 and found this issue.

Thanks!

Why TEXTURE_WRAP_S is set to REPEAT when the image is a power-of-two?

This makes it less likely that an artifact is visible at the seam where the panorama texture wraps, although it becomes less of an issue the larger the texture gets (it was a significant issue for the low-resolution SHT hash previews). It would be applied all the time when haov is 2 pi, except WebGL 1 only supports it for power-of-two textures.

This is not changed when the dynamic flag is true and the texture is uploaded again

Changing the size is not a case that I considered. I would generally recommend against it, since it also bypasses other checks, such as making sure the texture isn't too big for the graphics card / driver.

Changing the size is not a case that I considered. I would generally recommend against it, since it also bypasses other checks, such as making sure the texture isn't too big for the graphics card / driver.

What should I do in the case that the image dimensions is resized from time to time? For now, I manually commented out this line and made all use cases use CLAMP_TO_EDGE, but obviously this is hacky.

That's currently the simplest way, other than ensuring that the initial width is never a power of two.

Now that Safari has supported WebGL2 for more than a year, the longer term solution will be to switch Pannellum to use WebGL2, which will allow REPEAT to be used regardless of whether or not the image has a power of two width.

As an alternative, I could add a check for the image width in the render function, but that would require additional changes, since haov is not currently accessible from that function. I'm not sure I want to make this change, given that I would probably classify changing the image dimension an unsupported use case. However, I'm interested in knowing what your use case is and how that necessitates this. Are you passing a <canvas> element as the source or something else?