Load image from URL

Hi!

How can I load an image from a URL and use it as a material for a Plane object inside ZapWorks Studio?

This is the code I’m currently using to fetch a json with some fields with images URLs:

Z.getJSON("https://juanmaramon.com/Test/json.json", function(data) {
    console.log(data.sample[0].imageurl);


}, function() {
    console.log("Unable to retrieve information. Check your network connection.");
});

How can I use the result URL to replace a plane material?

Kind regards,
Juanma

1 Like

I just posted something like this the other week for someone else.
Let me know if this works for you as well.
Load material/texture from URL

Steve

Thanks @stevesanerd!

I tested the code snipped, it works on Zappar desktop but not in web mobile (after clicking the buttons the material disappears).

Do you know what could be wrong?

Juanma

I didn’t know you were looking at using WebAR.
I changed the files to my S3 server thinking it was a CORS problem but the problem is still there. Hay @George any thought?

Steve

Hi @juan.m.ramon.vigo,

So it looks the image you are trying to skin isn’t a power of two so you’ll need to set the image texture wrap mode to clamp. Something like this -

Z.ImageTexture("https://juanmaramon.com/Test/video_white.png").wrap(Z.Texture.Wrap.clamp);

Let me know if that solves it!

George

1 Like

Hi @George !

Yes, with this code now it is working.

Thanks!
Juan

1 Like

Thanks @George I didn’t even look t that. I just uploaded the images and went.

Steve

1 Like