Packagecom.gestureworks.cml.elements
Classpublic class Panoramic
InheritancePanoramic Inheritance com.gestureworks.cml.elements.TouchContainer

The Panoramic element provides a touch-enabled, 3-Dimensional panorama using the Away3D 4 library.

The Panoramic element has two projection types: sphere, or cube, which may be set using the projectionType attribute/property.

For a sphere projectionType, a single, spherical panoramic image needs to be provided in an Image element. The maximum size of the panorama's longest edge can be no greater than 2048, and this may be set in the CML or Actionscript rather than resizing the actual image file itself. If using CML, this Image element tag should be added between the open and close tags of the Panoramic element to make it a child of the Panoramic; in AS3 the Image should be added to the Panoramic element object as a child, and the object should be initialized after the image's Event.Complete is called.

For a cube projectionType, six cubic panorama images need to be provided in CML or AS3 in the same way as the sphere. In AS3 each image should have its Event.Complete called and added to the Panoramic element's display list before the init() method is called. Cubic faces must be sized in powers of 2. The maximum size for cubic faces is 2,048 pixels wide, and 2,048 tall. Cubic faces should be perfectly square.

The Panoramic element will actually consist of two objects, the Away3D projection/view, and a TouchContainer which holds the projection and provides the enabled touch interaction.

     
        var pano = new Panoramic();
        pano.projectionType = "cube";
        pano.cubeFace = true;
        pano.width = 700;
        pano.height = 500;
        pano.x = 500;
        pano.fovMin = 30;
        pano.fovMax = 200;
        pano.mouseChildren = true;
        
        var touchC:TouchContainer = new TouchContainer();
        touchC.nestedTransform = false;
        touchC.gestureEvents = true;
        touchC.mouseChildren = false;
        touchC.disableAffineTransform = true;
        touchC.disableNativeTransform = true;
        touchC.gestureList = { "n-drag":true, "n-scale":true };
        touchC.init();
        
        var imageRight:Image = new Image();
        imageRight.width = 1024;
        imageRight.open("../../../../assets/panoramic/30kabah_r.jpg");
        imageRight.addEventListener(Event.COMPLETE, imageComplete);
        
        var imageLeft:Image = new Image();
        imageLeft.width = 1024;
        imageLeft.open("../../../../assets/panoramic/30kabah_l.jpg");
        imageLeft.addEventListener(Event.COMPLETE, imageComplete);
        
        var imageUp:Image = new Image();
        imageUp.width = 1024;
        imageUp.open("../../../../assets/panoramic/30kabah_u.jpg");
        imageUp.addEventListener(Event.COMPLETE, imageComplete);
        
        var imageDown:Image = new Image();
        imageDown.width = 1024;
        imageDown.open("../../../../assets/panoramic/30kabah_d.jpg");
        imageDown.addEventListener(Event.COMPLETE, imageComplete);
        
        var imageFront:Image = new Image();
        imageFront.width = 1024;
        imageFront.open("../../../../assets/panoramic/30kabah_f.jpg");
        imageFront.addEventListener(Event.COMPLETE, imageComplete);
        
        var imageBack:Image = new Image();
        imageBack.width = 1024;
        imageBack.open("../../../../assets/panoramic/30kabah_b.jpg");
        imageBack.addEventListener(Event.COMPLETE, imageComplete);
        
        function imageComplete(e:Event):void {
            e.target.removeEventListener(Event.COMPLETE, imageComplete);
            e.target.init();
            
            if ( counter == 5 ) {
                
                pano.addChild(imageRight);
                pano.addChild(imageLeft);
                pano.addChild(imageUp);
                pano.addChild(imageDown);
                pano.addChild(imageFront);
                pano.addChild(imageBack);
                
                pano.addChild(touchC);
                
                pano.init();
                
                addChild(pano);
            }
            else { counter++; }
        }
     
     

See also

Gigapixel


Public Properties
 PropertyDefined By
  cubeFace : Boolean
Sets default projection geometry
Panoramic
  fovMax : Number
Sets maximum spread of the field of view.
Panoramic
  fovMin : Number
Sets the minimum spread of the field of view.
Panoramic
  projectionType : String
Sets default projection geometry
Panoramic
Public Methods
 MethodDefined By
  
Constructor
Panoramic
  
dispose():void
[override] Dispose methods to nullify children
Panoramic
  
init():void
[override] Initialisation method
Panoramic
  
update(e:GWEvent):void
updates camera angle
Panoramic
Property Detail
cubeFaceproperty
cubeFace:Boolean

Sets default projection geometry

The default value is false.


Implementation
    public function get cubeFace():Boolean
    public function set cubeFace(value:Boolean):void
fovMaxproperty 
fovMax:Number

Sets maximum spread of the field of view. This is how wide the viewing angle can be. Larger means more of the panorama is seen at once, but too large can mean things can look skewed or warped, or even get turned inside out.

The default value is 150.


Implementation
    public function get fovMax():Number
    public function set fovMax(value:Number):void
fovMinproperty 
fovMin:Number

Sets the minimum spread of the field of view. This is how narrow the viewing angle can be. Smaller means less total area of the panorama can be seen, but the viewing area that is available is in much greater detail, and appears "foved" in.

The default value is 50.


Implementation
    public function get fovMin():Number
    public function set fovMin(value:Number):void
projectionTypeproperty 
projectionType:String

Sets default projection geometry

The default value is "cube".


Implementation
    public function get projectionType():String
    public function set projectionType(value:String):void
Constructor Detail
Panoramic()Constructor
public function Panoramic()

Constructor

Method Detail
dispose()method
override public function dispose():void

Dispose methods to nullify children

init()method 
override public function init():void

Initialisation method

update()method 
public function update(e:GWEvent):void

updates camera angle

Parameters

e:GWEvent