I have given each entity a unique url for the url attribute using the script shown in the demo, however when I go to load this on my server, it returns a random texture for all the multiple entities which have a unique url instead of showing the individual images as textures. So it half works but it must show each entity with it’s own applied texture.
Now I am fairly sure I am missing something obvious here but having trouble figuring out what, each entity has a unique url as I said.
Code here
var LoadExternalImage = pc.createScript('loadExternalImage');
LoadExternalImage.attributes.add("imageUrl", {type: "string"});
// initialize code called once per entity
LoadExternalImage.prototype.initialize = function() {
var self = this;
// allow cross origin texture requests
this.app.loader.getHandler("texture").crossOrigin = "anonymous";
var asset = new pc.Asset("myTexture", "texture", {
url: this.imageUrl
});
this.app.assets.add(asset);
asset.on("error", function (message) {
console.log(message);
});
asset.on("load", function (asset) {
var material = self.entity.model.material;
material.diffuseMap = asset.resource;
material.update();
});
this.app.assets.load(asset);
};
// update code called every frame
LoadExternalImage.prototype.update = function(dt) {
};
// swap method called for script hot-reloading
// inherit your script state here
// LoadExternalImage.prototype.swap = function(old) { };
Do the picture models in the gallery all have the same material?
If so, that’s your issue. They are all referencing the same material asset. I would either clone the material in the editor and give reference each picture their own material asset or clone the material and reassign at runtime.
The 5 entities I’m using to test have no material assigned, the material textures are being applied at runtime by the script, but it is randomly assigning one of the 5 images to everything instead of applying the individual image urls for each entity as expected. The script I thought would grab an image from the images folder and then create a material from it. I thought maybe it was the entities didn’t have unique names or something but they do, though they are grouped as one, so not sure if that could create issues?
I just copied the script from the example I found that I linked to as a first step, I guess I will experiment with scope. Thanks for the link.
Here’s a variation of the project that you have linked to that has two boxes loading different images by cloning the model’s material and assigning it back to the model: https://playcanvas.com/editor/scene/734178
for those interested in using imgur, be aware of:
Correct linking: Use direct linking (i.imgur and not just imgur …etc)
Be also aware that the material needs a; transparent png attached, on beforehand (not a must at ‘yogi bear-image’ -> the box that only loads a regular png).
