alexchuang650730 / jsc3d

Automatically exported from code.google.com/p/jsc3d
0 stars 0 forks source link

How to use StlLoader and loadFromUrl properly? #36

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
What steps will reproduce the problem?
1. I want to load .stl via STLLoader
2. Can't get it work.
3. There is no documentation or examples for this method online.

What is the expected output? What do you see instead?
I want to load .stl into viewer but it's not working.

What version of the product are you using? On what operating system?
JSC3D 0.9.8 full release / Windwos XP 64

Please provide any additional information below.
Could anybodu please write me a simple code that will load .stl into a 
viewer/scene using StlLoader? I just want to know how it works. I don't want to 
use setParameter method.

Original issue reported on code.google.com by radas...@gmail.com on 15 Jul 2013 at 5:09

Attachments:

GoogleCodeExporter commented 8 years ago
I'm sorry for the bad documentation.

Since all resource requests should be asynchronous, the STL loader provides an 
event handler named 'onload' which should be overridden to get the parsed scene 
object when loading is done.

So the simplest snnipet to demonstrate this may be:

  var stl_loader = new JSC3D.StlLoader();
  stl_loader.onload = function(scene) {
    viewer.replaceScene(scene);
  };
  stl_loader.loadFromUrl('your-model.stl');

That's it.

Original comment by Humu2...@gmail.com on 15 Jul 2013 at 7:09

GoogleCodeExporter commented 8 years ago
alright
what im realy trying to achieve is to load many .stl files as parts, not as
a scene

so i could build one model from many stl files
is that even possible with jsc3D?

Original comment by radas...@gmail.com on 16 Jul 2013 at 11:08

GoogleCodeExporter commented 8 years ago
Each model file (obj or stl) will be parsed into a JSC3D.Scene object. You can 
get its meshes using scene.getChildren() method which returns an array of 
JSC3D.Mesh objects. When you have all models loaded, create a new JSC3D.Scene 
objects and add in loaded meshes with scene.addChild() method. Then call 
viewer.replaceScene() to send them to display.

The implementation may be something like this:

  var components = ['part1.stl', 'part2.stl', 'part3.stl'];
  var theScene = new JSC3D.Scene;
  var numOfLoaded = 0;  
  var onModelLoaded = function(scene) {
    var meshes = scene.getChildren();
    for (var i=0; i<meshes.length; i++) {
      theScene.addChild(meshes[i]);
    }
    if (++numOfLoaded == components.length)
      viewer.replaceScene(theScene);
  };
  for (var i=0; i<components.length; i++) {
    var loader = new JSC3D.StlLoader;
    loader.onload = onModelLoaded;
    loader.loadFromUrl(components[i]);
  }

Please note that since jsc3d does not make use of transform hierachy, all the 
models that are to be used as parts of a scene should be generated in the same 
model space. Otherwise the scene will be a mess.

Original comment by Humu2...@gmail.com on 16 Jul 2013 at 5:44

GoogleCodeExporter commented 8 years ago
hi it's me again

i modified the code so now i'm able to reach .vertexBuffer of all loaded
parts.
check line 45 in js/script.js

i got all parts presented as an array.
now i need to write the functions to scale and rotate each part (moving
parts also would be cool).

do i have to recalculate .vertexBuffer?
how can i use .math3d and .matrix3x4?

Original comment by radas...@gmail.com on 18 Jul 2013 at 7:07

GoogleCodeExporter commented 8 years ago
That's right. You will have to rewrite content of vertexBuffers to perform 
transformation on seperate meshes. This can be done by accumulating rotation, 
scaling and translation successively into a matrix, then transforming and 
rewriting data in mesh.vertexBuffer by JSC3D.Math3D.transformVectors() method. 

Additionally, if there are rotations, data in the mesh.faceNormalBuffer and 
mesh.vertexNormalBuffer also need to be transformed, in the same way, by a 
rotation matrix and written back. Otherwise you'll get wrong face-culled and 
lit results.

A rough implementation is shown as follows:

  var xformMat = new JSC3D.Matrix3x4;
  var rotMat = new JSC3D.Matrix3x4;
  ...
  xformMat.identity();
  rotMat.identity();

  // generate the rotation matrix, using the center point of mesh's aabb as the the pivot 
  rotMat.translate(-(mesh.aabb.minX+mesh.aabb.maxX)/2, -(mesh.aabb.minY+mesh.aabb.maxY)/2, -(mesh.aabb.minZ+mesh.aabb.maxZ)/2);
  rotMat.rotateAboutXAxis(...);
  rotMat.rotateAboutYAxis(...);
  rotMat.rotateAboutZAxis(...);
  rotMat.translate((mesh.aabb.minX+mesh.aabb.maxX)/2, (mesh.aabb.minY+mesh.aabb.maxY)/2, (mesh.aabb.minZ+mesh.aabb.maxZ)/2);

  // then generate the full transformation matrix
  // the rotation component
  xformMat.multiply(rotMat);
  // the scaling component
  xformMat.scale(...);
  // the translation component
  xformMat.translate(...);

  // transform and rewrite vertex coordinates
  JSC3D.Math3D.transformVectors(xformMat, mesh.vertexBuffer, mesh.vertexBuffer);
  // transform and rewrite face normals
  JSC3D.Math3D.transformVectors(rotMat, mesh.faceNormalBuffer, mesh.faceNormalBuffer);
  // transform and rewrite vertex normals
  JSC3D.Math3D.transformVectors(rotMat, mesh.vertexNormalBuffer, mesh.vertexNormalBuffer);

  // now the mesh can be put to pipeline to be rendered
  ...

It is interesting but I don't think jsc3d excels in this kind of applications.

Original comment by Humu2...@gmail.com on 19 Jul 2013 at 4:01

GoogleCodeExporter commented 8 years ago
Your rough code helps a lot. But there is a small problem.
You cannot use translated-rotate-tranlated rotMat to rotate the 
faceNormalBuffer and vertexNormalBuffer.

It has to be a pure rotate matrx to do that.

Original comment by DakeF...@gmail.com on 8 Oct 2013 at 4:29

GoogleCodeExporter commented 8 years ago
P.S. after transform the vertex in mesh, you need manually call 
Mesh.calcAABB(); and Scene.calcAABB(); to update the AABB otherwise the model 
is not centered.

Original comment by DakeF...@gmail.com on 8 Oct 2013 at 4:40

GoogleCodeExporter commented 8 years ago
Hii. I ant to use stl loader to load stl images in browser.Plz provide me full 
details .I am new to this

Original comment by aswanipo...@gmail.com on 19 Nov 2013 at 4:33

GoogleCodeExporter commented 8 years ago
You can refer to this document 
http://code.google.com/p/jsc3d/wiki/GettingStarted for a detailed tutorial but 
replace the SceneUrl with the URL of your own STL model.

Original comment by Humu2...@gmail.com on 3 Dec 2013 at 2:10