lo-th / phy

Physics for three. Game engine
https://lo-th.github.io/phy/
MIT License
507 stars 42 forks source link

How to load custom glb model using phy engine? #38

Open prolove15 opened 1 month ago

prolove15 commented 1 month ago

I am making a web app using ThreeJS and React It's very similar with the museum example of phy I implemented almost of functionalities using Phy However I encountered in issue to load custom museum model

phy.load( 'dices.glb', onComplete )

phy.load( ['dices.glb', 'yo.jpg'], onComplete )

This code are wrotten at the Phy engine guide https://lo-th.github.io/phy/docs/index.html#manual/phy-load

But this code doesn't works in my project

I will share my main code:

const loadModels = () => {
    const models = ["./assets/models/musee.glb"];

    phy.load([...models], onCompleteLoadModels);
};

const onCompleteLoadModels = () => {}

This code occured errors at the crhome console like the following:

 index.tsx:86 SyntaxError: Unexpected token '<', "<!doctype "... is not valid JSON
at JSON.parse (<anonymous>)
at GLTFLoader.parse (Phy.module.js:17994:17)
at Object.onLoad (Phy.module.js:17889:11)
at three.module.js:44245:38

If I remove the above code, all works well
In one word, if I use simple model like box, the project works well
But if I gonna load new model, it occur error

It's a urgent project, so I would be happy anyone let me know how to overcome this issue

Best regards
lo-th commented 1 month ago

Hi do you try with native three loader ? is maybe a problem's on your model what exporter you use ? what compression ? i only include the draco compression in phy.

you can use the loader of three if is work and use your model in phy.

prolove15 commented 1 month ago

Thank you for your kind support. Regarding the model compression, I tested it using museum models in phy repository But the error was same

When I use ThreeJS's default loader, there wasn't any problem Could you write the code how to use model that loaded through ThreeJS's default loader in phy?

lo-th commented 1 month ago

you can use any model you want in phy i use pool only to manage demo switch and don't reload model. You have to take care of your model name and not use too complex mesh on simulation

phy.load(['./assets/models/chess.glb', './assets/models/chessclock.glb'], onComplete )
onComplete = () => {
    // get a object with list of model
    const clockMesh = phy.getMesh('chessclock');
    // add a box shape and remplace by the model. here is clockMesh.clock
    phy.add({ type:'box', size:[3,1.6,1.1], pos:[0, 0.8-0.02, -5.2], mass:1, mesh:clockMesh.clock, material:'Clock' })
}

don't set material:'Clock' if you want keep original material of your model