[SOLVED] Load glb from url and set its position

Help & Support
,
1

Hi there, I was wondering is it possible to load model from external url into the world?

What I’m trying to achieve:

Created a ground element and attached a new script, the script should load model from url and set (+get) new model position relative to created ground

What are the steps? Been looking at examples but couldn’t find any similar ones

2

You will basically be doing this but with a URL instead of a binary asset in the project

https://developer.playcanvas.com/en/tutorials/loading-gltf-glbs/

Once the asset has been loaded from URL, you create an entity from the GLB container asset and position to wherever you like.

The helper script in the project has a function to load a GLB as a container asset from URL.

3

That would work indeed but in my case I want the model url not to be setten in editor but instead, written as a script.js

This would do it right?

4

The project has a helper script with a function that loads a GLB as a container asset from a URL that you can use to create an entity from at runtime. Look at glb-utils.js in the project.

5

I have an entity ‘Model’ and added a script
getting

Cannot read properties of undefined (reading ‘addChild’)

var Test = pc.createScript('test');

// initialize code called once per entity
Test.prototype.initialize = function() {
this.model = this.app.root.findByName('Model');
var app = this.app;

    var test = new pc.Entity();
app.assets.loadFromUrl('https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/2CylinderEngine/glTF-Binary/2CylinderEngine.glb', 'container', function(err, asset) {
    test.addComponent('model', {
        type: 'asset',
        asset: asset.resource.model,
    });
   this.model.addChild(test);
});

};

// update code called every frame
Test.prototype.update = function(dt) {

};

// swap method called for script hot-reloading
// inherit your script state here
// Test.prototype.swap = function(old) { };

// to learn more about script anatomy, please read:
// https://developer.playcanvas.com/en/user-manual/scripting/
6

Are you sure there is an entity with the name ‘Model’ in your scene?

7 
    var app = this.app;
    var self = this;

    app.assets.loadFromUrlAndFilename('https://cdn.glitch.global/168e0451-dc78-4fa9-9a84-028ef51d9561/File.glb?v=1651912125168', null, "container", function (err, asset) {
        // Add the loaded scene to the hierarchy
        self.entity.addComponent('model', {
            asset: asset.resource.model
        });

               self.entity.addComponent('collision', {
        type: 'mesh',
         asset: asset.resource.model
    });
    
   self.entity.addComponent('rigidbody', {
        type: pc.BODYTYPE_KINEMATIC
    });
         
        if (asset.resource.animations.length > 0) {
            self.entity.addComponent('animation', {
                assets: asset.resource.animations    
            });
        }
    });
};

This works as expected if the entity is in root, let’s say I add entity as a child of a ground and then model does not appear, why would it happen?

9

Chances are that entity that you are adding this new entity to as a child is scaled/rotated in some way that it doesn’t look like it has appeared/rendered in the scene