Mouse Notifications

Goal: execute function or launch url in reaction to mouse click on specific object.

Objects in FinalMesh WebGL may be selected in the same way as in regular 3d application. Selection may be used for marking objects for any operation or to highlight them*.

This example loads 3d file and selects two nodes.

function sampleCheckObject(event)
{
var h=event.wnd.hitTest(event);
      if(h)
      {
        var node=h.node;
        while(node)
        {
         if(node.meta && node.meta.url)// any condition here
         {
           return node;
	 }
         node=node.parent;
        }

      }
    return null;
}
function sampleFunction(event)
{
  switch(event.code)
  {
   case "mousedown":{
      var node=sampleCheckObject(event);
      if(node)
      {
        var link=node.meta.url;
        event.doDef=false;
        alert("LINK:"+link);
      }
    }break;
   case "mousehover":
    {
       var node=sampleCheckObject(event);
       var canvas=event.wnd.canvas;
       var style=canvas.style;
       if(node){style.cursor="pointer";canvas.title=node.meta.url;}
       else {style.cursor="default";canvas.title="";}
       event.doDef=false; // prevent default cursor
    }break;
  }
}
  • Where iv.initViewe3d function related to specific template used in this example. 
  • Where space is view3d.space. And view3d is variable or 3d window object.

Example

*Highlighting itself may be implemented with creating special material and assigning it to node without using selection.

In this article