views:

983

answers:

2

Hi all,

It's my first time with Papervision3D and I have created a slide show of images that is skewed on the y-axis. Smallest photos on the left, and they increase in size going to the right. So they zoom from left to right, smallest to biggest.

I have a tooltip that pops up when you hovers over the photo, but the tooltip also gets skewed proportionate to the camera view (slanted). I want the tooltip's angle to be independent of the entire camera view.

Any idea how to rotate objects independent of the parent's camera angle?

Thanks!

A: 

my_obj = new DisplayObject3D(); my_plane = my_obj.addChild(new Plane(bla bla)); my_obj.lookAt(camera);

The 'lookAt' bit is what you need.

lookAt, for some annoying reason, makes the object look *away* from the camera (use a text object with a double-sided material to see what I mean). Also, the text will be drawn onto a plane that is angled towards the camera, not on a plane parallel to the cameras near plane (which is probably what he wants).
James Fassett
A: 

Why not draw the tooltips in 2d? You can get the on-screen position of the images and then just draw a regular Sprite like so:

package 
{
import flash.display.Sprite;
import flash.text.TextField;

import org.papervision3d.events.InteractiveScene3DEvent;
import org.papervision3d.materials.ColorMaterial;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.objects.primitives.Plane;
import org.papervision3d.typography.Text3D;
import org.papervision3d.view.BasicView;

public class PVTest extends Sprite
{
 private var world:BasicView;
 private var text:Text3D;
 private var text2d:TextField;

 public function PVTest()
 {
  world = new BasicView(stage.width, stage.height, true, true);

  var colorMat:ColorMaterial = new ColorMaterial();
  colorMat.interactive = true;

  var planeContainer:DisplayObject3D = new DisplayObject3D();
  var plane:Plane;
  for(var i:int = 0; i < 11; i++)
  {
   plane= new Plane(
    colorMat,
    100, 100,
    10);
   plane.x = (i * 105) - 500;
   plane.addEventListener(InteractiveScene3DEvent.OBJECT_OVER, handleMouseOver);
   plane.addEventListener(InteractiveScene3DEvent.OBJECT_OUT, handleMouseOut);
   planeContainer.addChild(plane);
  }

  planeContainer.rotationY = 10;
  world.scene.addChild(planeContainer);

  world.camera.z = -500;

  addChild(world);
  world.startRendering();
 }

 private function handleMouseOver(event:InteractiveScene3DEvent):void
 {
  var plane:Plane = Plane(event.displayObject3D);
  plane.calculateScreenCoords(world.camera);

  const OFFSET_X:int = -20;
  const OFFSET_Y:int = 30;
  text2d = new TextField();
  text2d.text = "toolTip";
  text2d.x = plane.screen.x + (stage.width/2) + OFFSET_X;
  text2d.y = plane.screen.y + (stage.height/2) + OFFSET_Y;
  addChild(text2d);
 }

 private function handleMouseOut(event:InteractiveScene3DEvent):void
 {
  removeChild(text2d);
 }
}

}

Even for this example you'd have to offset the y position of the tooltip based on the objects scale but it may be easier than working out the rotations and is the best way to get a consistent looking result.

James Fassett