Image Texture Change

Customization
1

Hello!

I have a question about changing the texture.

There is a frame on the wall, and the pictures in the frame must be managed in a database.

Shapespark added JPG as BaseColor to the frame.
I did the same for the video in advance.

Receive image and video links through a “GET” request to strAPI.

The video texture was changed successfully.
This fixed the safari video texture loading problem.

However, an error occurs when changing the image texture.
It works in the same way as the video texture change code.

The code is below.

const handleImageTexture = (data) => {
  var material = "";
  var image = new Image();
  image.src = "Link from here";
  image.crossOrigin = "anonymous";
  var imageTexture = viewer.createTextureFromHtmlImage(image);

  if (content name comparison) {
       material = viewer.findMaterial("material name");
  }
  ...
  else {
      return null;
  }

  material.baseColorTexture = imageTexture;
  viewer.requestFrame();
  return true;
}

The “GET” request is processed after Shapespark is loaded.
Again, the video texture will change normally.
An error occurs when changing the image texture.

Chrome Developer Mode Console:

[.WebGL-0x7faf25075200]RENDER WARNING: texture bound to texture unit 1 is not renderable. It might be non-power-of-2 or have incompatible texture filtering (maybe)?

Do you have a good idea?

2

The textures are required to have power of two dimensions, see: [API] Resolution of a texture when changing via script - #2 by jan

3

Thank you for answer.

Let’s try the image resolution as a power of two dimensions.

This was very helpful.