[SOLVED] What's the best file format for importing models into playcanvas?

Help & Support
1

Is there any difference in performance/browser compatibility depending on whether I use glTF, obj or USDZ? If not, which is your personal preference?

2

USDZ is a Safari native model format. AFAIK, PlayCanvas doesn’t support it.

gLTF is the accepted runtime model and scene standard across most WebGL engines now.

1 Like
3

Oh, forgot to say that glTF import into the editor is not fully supported yet (you have to load at runtime)

FBX is still the best choice to import models and animations into PlayCanvas Editor

1 Like
4

Thanks for the clarification because in the GitHub examples I couldn’t find how to load glTF so I was confused.

5

However there are only two examples, for loading glb and obj, but not for fbx…

6

Hi @Gamer_Wael,

For FBX you don’t have to do anything special, just drag and drop it in editor, on the assets panel.

And it will get converted automatically to a model asset which you can easily drag and drop in scene.

1 Like
7

GLB is the binary container format for glTF. It not only holds the model data, it can also contain materials, animations, cameras etc. Most 3D tools will export out to GLB. Most of the GitHub examples that have a model, is likely to be loading a GLB.

1 Like
8

For completeness, here is an example of loading a glTF file:
Scene: https://playcanvas.com/editor/scene/849686
Code: https://playcanvas.com/editor/code/655732?tabs=26279043

2 Likes
9

Ok so I’m still having trouble with this. I’ve imported my obj model but it looks like there’s no way to import the mtl file. I converted it into glb and tried importing that but it didn’t work. I did it like this:

    var url = "./Tambourine.glb";
    app.assets.loadFromUrl(url, "container", function (err, asset) {

        var entity = new pc.Entity();
        entity.addComponent("model", {
            type: "asset",
            asset: asset.resource.model,
            castShadows: true
        });
        app.root.addChild(entity);
    });

But I got an error: Cannot read property ‘resource’ of undefined.

What’s the best way to programmatically import a model along with textures?

I’m trying to make this project without the editor. I know I’m just making it unnecessarily difficult for myself, but I’d like to complete this without using the editor.

10

It’s a bit difficult to debug without a reproducible. Can you create a JSFiddle version of this? Or upload the build somewhere we can take a look please?

11

Right, with the engine you can only load FBX files directly.

You will have to upload them in the editor, and download the converted to .json model. That file can be loaded by the engine then.

12

The best way is GLB. You can test the GLB model you exported using our viewer tool:
https://playcanvas.com/viewer

1 Like
13

Thanks a lot for the help. It turns out I was using an older version of playcanvas saved on my device. I have now updated to latest stable version and that fixed the issue.