-2

I have a project where I want to load/use/display 3D models in a web browser, and provide control/interactivity over these models.. (add more than one to the stage/canvas..upon button events/clicks..etc)

I saw a similar project to mine, and after some digging on how they approached it.. I was led to Three.js (and they used Angular as well, but I dont have much experience with that)

I am starting my path down Three.js, but have some basic questions to understand my task(s) at hand.

http://threejs.org/

I am not creating the models.. they are from an outside source. I believe they use SolidWorks..

question: upon reading up on Three.js I was left with thinking exporting to .obj is the correct format to use/have...... is this correct?

I have read things about 'textures'.... but this is an external/outside image to be applied to the model?

question: Can you not just import/load the model/source file have it already 'look' like how it was exported? or do you need to have some image as a texture?

Are there any very -BASIC- examples. (nothing more than loading an external .obj file.. and adding it to the stage/canvas) anywhere?

I'm having trouble getting things to work. but all the examples have some much other stuff/code in there, I cant figure what is wrong..what can be removed.. to just get a basic .obj model loaded to the stage?

whispers
  • 962
  • 1
  • 22
  • 48
  • plenty of examples [here](http://threejs.org/examples/) – 2pha Jan 31 '16 at 00:10
  • Thanks for the reply.. any answer for the questions above? – whispers Jan 31 '16 at 02:12
  • do you always have to have an external 'image' for texture? can you just load an .obj that has everything needed 'inside' the model itself? I took the OBJ example (same page you linked to).. added an .obj file into the same directory.. updated sample code to ONLY CHANGE the obj file name/path... and it didnt load anything? Is there a specific way to export your models from Solidworks to OBJ to work in Three.js? – whispers Jan 31 '16 at 02:31
  • I'd like to just get an OBJ model on the stage.. nothing more for right now. There seems to be so many 'ways', and so many dependencies, some pathing/importing error... error console is always red with something. LOL.. Just a simple .OBJ loaded model example.. nothing more.. no animation...etc I'll change out the path to the .obj model to my version.. and I guess take things from there. (anybody?) :) – whispers Jan 31 '16 at 02:53
  • Three.js can load many formats, .OBJ file format can not hold texture information. I don't use solidworks. Exporting from solidworks will probably not give you a model that is good to use in three.js. Did you check for JS errors when trying to load your model? I suggest you do read up some more and find tutorials of which there are plenty on the interwebs. – 2pha Jan 31 '16 at 02:57
  • I havent found anything (I think one post) about how to export form Solidworks. That is what the source files were created in.. so I would image that is what will need to be used to get me whatever format I need to work with (Solidworks)... I didnt eventually find some JS errors in Firefox error console.. (referencing the # Free SolidWorks .OBJ Exporter - C# version of v2.0).. and another line pointing to this line of code: – whispers Jan 31 '16 at 05:36
  • And in the OBJMITLoader.. this line throws an error: normals[ parseInt( normals_inds[ 2 ] ) - 1 ].clone() I have searched for tutorials.. but I havent found any that start from scratch.. or cover the basics. My 3D skills is lacking as well which I'm sure already puts me at a disadvantage..etc (ie: I'm not sure why the .obj file comes with a .mit file?) – whispers Jan 31 '16 at 05:40
  • OBJ file itself does not contain material information, so it often comes with an MTL file. It contains material definitions, and it can refer to images to use as texture. Maybe you can take a look at http://3dviewer.net if it can open your obj files. It has an embeddable version, too. – kovacsv Jan 31 '16 at 09:38
  • Thank you for the link, I will check it out today. I eventually got the .obj file to load (with the matching .mtl file)... however the 'zoom/animation' made it really hard to see on the stage (canvas).. so I guess I need to start playing around with that stuff. – whispers Jan 31 '16 at 16:18
  • I was hoping to just a get a simple .obj loader example. * 1 x .obj file (with matching .mtl file) * simple load to the stage * default placement (middle of screen) * default zoom (100% correct size the model is at) * no animation or oddities happening when the mouse moves around the stage (odd movement and axis points rotate/zoom/scale the model based on mouse movement) seems like is difficult to find.. so I need to work through each line/section changing values/commenting out lines to understand what is doing what. – whispers Jan 31 '16 at 16:18

1 Answers1

0

In the link proposed by @2pha you can find a while list of loaders:

enter image description here

What format to use depends on what you can export to. Only you can answer that.

If you can export to obj format, then here is a link to an object loader example. But you could also consider collada format for example.

Wilt
  • 41,477
  • 12
  • 152
  • 203
  • thanks for the reply.. but I already (eventually) got an .obj file to open (if you read the comments/post, you'll see I am getting .obj files.. and also wasnt clear about the .mlt files.... I am still looking for a PLAN .obj loader example.. the ones you posted I have already seen, and they do much more than just load an .obj file.) I want to load an external .obj file...at 100% (true scale) in the middle of the stage. (scene?) Thats it.. no odd mouse 3D movement for now.. not super small so I cant see it. Just a trimmed down , barebones version of loading an external .obj file – whispers Feb 02 '16 at 01:36
  • @whispers How more basic should it be? Can you not just strip the unneeded code from the example yourself? – Wilt Feb 02 '16 at 08:17
  • Thats what I have been attempting. but knowing what can be removed and what cant has been a 'journey'.. as well how to just load the model at default spot/location and 100% 'size' that model was designed at. I have been playing around with it..but the values just havent been making sense. scale = 100 is not 100% (for example) – whispers Feb 02 '16 at 13:49
  • no answers on that stuff? (just 'strip stuff out' is the solution for understanding how to load models at the default 100% designed size?) – whispers Feb 04 '16 at 23:50
  • @whispers Scale 1 is 100% – Wilt Feb 05 '16 at 06:45