0

I have a 3D model loaded in my web page using jsc3d. Is there a way to place a hot spot (a clickable area) over my model so that when it is clicked I could zoom in and rotate the model to a specific set or coordinates?

Peter O.
  • 32,158
  • 14
  • 82
  • 96
gemega
  • 23
  • 6

1 Answers1

0

I think the "hotspot" for mesh selection is already built in. Let say you have correctly initialized a viewer:

var viewer;
/* Set viewer Options */
...
viewer.init();
...

Set the callback function:

viewer.onmousedown = onViewerMouseDown;

Then you need something like this:

function onViewerMouseDown(x, y, button, depth, mesh) {     
    if (button == 0/*left button down*/ && mesh != null) {
        var meshName = mesh.name;
        var pivot = mesh.aabb.center();
        /* do something with the selected mesh */
        console.log('Mesh center: ' + JSON.stringify(pivot));
    }
}

If you have more than one mesh, you should rotate/translate by your self, for example by implementing a mesh rotation matrix in jsc3d prototype.

More info:

http://jsc3d.googlecode.com/svn/trunk/jsc3d/docs/symbols/JSC3D.Viewer.html#onmousedown

deblocker
  • 7,629
  • 2
  • 24
  • 59
  • thanks for your answer @deblocker. I'd made some progress since I posted this. Now, I know I can rotate the mesh using viewer.rotate and even change viewer.zoomFactor, do you know how can I also set the panning value? – gemega Jul 07 '15 at 19:25
  • like the name says... panning[x,y] . Look in `JSC3D.Viewer.prototype.mouseMoveHandler` for usage. Pleased to help you. If my answer gives you more information than simply point to the PickInfo structure, please accept it! – deblocker Jul 07 '15 at 21:48
  • trying viewer.panning[10,20] has no effect, do you have any idea of how to use it along with viewer.onmousedown? thanks for your help, really – gemega Jul 07 '15 at 22:16
  • for smooth movement try simply: viewer.panning[0] += 100; viewer.update(); – deblocker Jul 07 '15 at 22:29