Questions about beginner tutorial

Hey guys,

so i just started out with threejs and ive been watching as to how to load models onto the platform so people can view them,

well, i watched a video and i learned on how to import texttures and to export them out.
well, after i did that, the youtube video said that i needed to download a converter for obj to js which i did download via the github from mr. doob.

the next thing that he did was that he seemed to open the command line and typed out this (https://imgur.com/a/PEnb3YO) but idk where he typed that out and what I am supposed to type out because i used a different model as an example. This is where i saved everything btw (https://imgur.com/a/z0bTEvO)…

lastly, i need to get the index.html to where i can insert the model, but he never explained where he ot it.

this is the video that im talkin about and the part that i do not understand starts at 7:50 ish

(https://www.youtube.com/watch?v=NtRrYUAd8rs)

Havent seen the tutorial myself obviously, but the index.html is selfmade. Probably he made a file called index.html in which he includes the needed ThreeJS files. In that same code you put / render your canvas et cetera.

What I did (and is a better way I beleve, not sure though) is export everything to glTF. I think that is kinda the “new standard” for this stuff.

I’m a beginner myself so I am not sure if my answer is 100% correctly, but it doesnt kill you to check out the exporter haha, maybe it will help you :slight_smile:

And as said, make your own index.html and use tags to include the needed TreeJS JS files and write your code to load your model in that file too and that is all you need.

I wrote my own editor in 3 files.

index.html
style.css
scripts.js

I can view any model, and do real-time changes like switching the background color, switching speed on which animations are run, switch to normal view or wireframe view, and some other things.

Good luck!

The workflow presented in the video is actually not up to date since all python scripts are now removed. I suggest you directly load your OBJ file with OBJLoader. There is a very suitable example for your use case that shows how to load an OBJ with the respective MTL. Use the code of the following example as your personal index.html.

https://threejs.org/examples/webgl_loader_obj_mtl.html

I made a very simple basic example.
Maybe it is useful.

http://threejs.hofk.de/OBJLoader/loadExampleObject.html

Use Ctrl U to view the code.
The license information (poly.google.com/ Spinner Hennadiy Kyseliov )
for the object is in German. (Lizenz)

1 Like

This one seems up-to-date though, hope it helps you a bit :slight_smile: