How to load a glb file into scene

How to load a glb file into scene. I want to import the alien in the scene from an external github link and bring it to the scene.

I tried writing an async function but the mesh is not getting imported.
https://playground.babylonjs.com/#4R6WFR#2

Then I want to transform/ work on it just like meshes created through MeshBuilder inside createScene().

its because you are using the filter passing in a node name that doesnt exist ,

either just pass an empty string :

const result = await BABYLON.SceneLoader.ImportMeshAsync("", "https://raw.githubusercontent.com/BabylonJS/MeshesLibrary/master/", "alien.glb", scene);

or pass a valid node name , with your model , the node name starts with a capital “Alien” ( this can be seen when inspecting the model by first loading it with the above code.

So if you did want to pass the filter then it would be :

const result = await BABYLON.SceneLoader.ImportMeshAsync(["Alien"], "https://raw.githubusercontent.com/BabylonJS/MeshesLibrary/master/", "alien.glb", scene);

https://playground.babylonjs.com/#4R6WFR#3

I tried const result = await BABYLON.SceneLoader.ImportMeshAsync("", "https://raw.githubusercontent.com/BabylonJS/MeshesLibrary/master/", "alien.glb", scene);

and getting errors.


e.send @ webRequest.ts:167
f @ fileTools.ts:528
(anonymous) @ fileTools.ts:517
setTimeout (async)
e @ fileTools.ts:517
XMLHttpRequest.send (async)
e.send @ webRequest.ts:167
f @ fileTools.ts:528
h @ fileTools.ts:530
ci @ fileTools.ts:564
li @ fileTools.ts:387
t._loadFile @ scene.ts:4514
e._loadFile @ glTFFileLoader.ts:843
e.loadFile @ glTFFileLoader.ts:620
g @ sceneLoader.ts:582
e @ database.ts:69
Sr.OfflineProviderFactory @ database.ts:11
e._LoadData @ sceneLoader.ts:603
e.ImportMesh @ sceneLoader.ts:765
(anonymous) @ sceneLoader.ts:832
e.ImportMeshAsync @ sceneLoader.ts:831
getModel @ VM353:2
createScene @ VM353:31
window.initFunction @ VM353:51
await in window.initFunction (async)
_compileAndRunAsync @ rendererComponent.tsx:295
await in _compileAndRunAsync (async)
(anonymous) @ rendererComponent.tsx:42
e.notifyObservers @ observable.ts:359
(anonymous) @ monacoManager.ts:75
e.notifyObservers @ observable.ts:359
t.onreadystatechange @ loadManager.ts:146
XMLHttpRequest.send (async)
_loadPlayground @ loadManager.ts:166
_checkHash @ loadManager.ts:91
(anonymous) @ loadManager.ts:29
hashchange (async)
e.onreadystatechange @ saveManager.ts:51
XMLHttpRequest.send (async)
_saveSnippet @ saveManager.ts:86
(anonymous) @ saveManager.ts:11
e.notifyObservers @ observable.ts:359
onOk @ metadataComponent.tsx:60
onClick @ metadataComponent.tsx:89
He @ react-dom.production.min.js:52
Ze @ react-dom.production.min.js:52
(anonymous) @ react-dom.production.min.js:53
ki @ react-dom.production.min.js:100
Li @ react-dom.production.min.js:101
(anonymous) @ react-dom.production.min.js:113
Re @ react-dom.production.min.js:292
(anonymous) @ react-dom.production.min.js:50
Ti @ react-dom.production.min.js:105
Qt @ react-dom.production.min.js:75
Gt @ react-dom.production.min.js:74
t.unstable_runWithPriority @ scheduler.production.min.js:18
Ko @ react-dom.production.min.js:122
Te @ react-dom.production.min.js:292
Zt @ react-dom.production.min.js:73
webRequest.ts:167     GET https://raw.githubusercontent.com/BabylonJS/MeshesLibrary/master/alien.glb net::ERR_CONNECTION_TIMED_OUT

you playground works for me and it looks like you have a network issue.

cc @RaananW

Works for me as well,but this would be better for you - Babylon.js Playground (babylonjs.com)

Why use github user content when we offer a more reliable CDN with all of the assets in our Assets repository? :slight_smile:

1 Like

This is coming as root → model.
How can I use the model and transform/ do operations like models that are generated through MeshBuilder class. I want to make the transformations inside createScene();

Till now I knew the synchronous way to do transformations on meshes.

all glb models will have a root container , just get reference to the transform node you want to work on using the scene method/function getNodeByName()

1 Like