用PV3D在Flex中实现全景360(转)

PV3D采用的是左手坐标系,默认的X正向指向屏幕右侧,Y正向指向屏幕上方,Z正向垂直屏幕向内,下图左侧为左手坐标系,用户默认的观察视角是沿着Z轴的负半轴方向。

将实景360场景封装为一个类,代码如下:
[java] view plaincopy
package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;

import mx.controls.Alert;

import org.papervision3d.cameras.Camera3D;
import org.papervision3d.materials.BitmapFileMaterial;
import org.papervision3d.materials.utils.BitmapMaterialTools;
import org.papervision3d.objects.primitives.Cylinder;
import org.papervision3d.objects.primitives.Sphere;
import org.papervision3d.render.BasicRenderEngine;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.view.Viewport3D;


public class MyPV3D extends Sprite
{
private var sphere:Sphere;
private var myMouseDown:Boolean = false;
private var viewport:Viewport3D;
private var scene:Scene3D;
private var camera:Camera3D;
private var render:BasicRenderEngine;

private var bMouseMove:Boolean = false;
private var OldMouseX:Number = -1;
private var OldMouseY:Number = -1;

public function MyPV3D(str:String)
{
super();
init(str);
}

private function init(str:String):void
{
initObj(str);

//注册帧频侦听用于不断刷新屏幕,每出现一帧就触发该事件
addEventListener(Event.ENTER_FRAME,onEnterFrame);

addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
//addEventListener(MouseEvent.ROLL_OVER, onMouseUp);
addEventListener(MouseEvent.MOUSE_MOVE,onMouseMove);
addEventListener(MouseEvent.MOUSE_WHEEL,onMouseWheel);
}

private function initObj(str:String):void
{
viewport=new Viewport3D(700,500);
addChild(viewport);
scene = new Scene3D();
camera = new Camera3D();
render=new BasicRenderEngine();


var material:BitmapFileMaterial=new BitmapFileMaterial(str);

//PV3D默认情况下不显示背面,doubleSided属性应设为true
material.doubleSided = true;
material.opposite = false;
material.smooth = true;

//实例化球体
sphere=new Sphere(material,200,50,50);
sphere.scaleX = sphere.scaleX*(-1);
scene.addChild(sphere);

//把摄像机移到中心位置,PV3D摄像机的默认位置是camera.z=-1000
camera.z=0;
//摄象机的缩放参数,
camera.zoom=.8;
//摄象机的焦距
camera.focus=300;
render.renderScene(scene, camera, viewport);
//this.useHandCursor = true;显示为手型
//this.buttonMode = true;
}

private function onEnterFrame(e:Event):void
{
render.renderScene(scene, camera, viewport);
}

private function onMouseDown(event:MouseEvent):void
{
myMouseDown = true;
this.OldMouseX = this.mouseX;
this.OldMouseY = this.mouseY;

}


private function onMouseUp(event:MouseEvent):void
{
myMouseDown = false;
this.OldMouseX = -1;
this.OldMouseY = -1;
}

private function onMouseMove(event:MouseEvent):void
{
if(myMouseDown)
{
if(this.OldMouseX < 0 || this.OldMouseY < 0 )
{
this.OldMouseX = this.mouseX;
this.OldMouseY = this.mouseY;
}
else
{
var DeltaX:Number = this.mouseX - this.OldMouseX;
var DeltaY:Number = this.mouseY - this.OldMouseY;
camera.rotationY += DeltaX*0.5;
camera.rotationX += DeltaY*0.5;

if (camera.rotationX <= -90)
{
camera.rotationX = -90;
}
else if (camera.rotationX >= 90)
{
camera.rotationX = 90;
}
render.renderScene(scene, camera, viewport);
this.OldMouseX = this.mouseX;
this.OldMouseY = this.mouseY;
}
}
}

private function onMouseWheel(event:MouseEvent):void
{
if(event.delta > 0)
{
if(camera.zoom > 0.6)
{
camera.zoom *= 0.95;
}
}
else if(event.delta < 0)
{
camera.zoom *= 1.05;
}
}

}
}
然后在一个Flex程序中使用该全景类,如下图所示:
[java] view plaincopy
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
creationComplete="App_creationCompleteHandler(event)" >
<fx:Script>
<![CDATA[
import mx.core.UIComponent;
import mx.events.FlexEvent;

protected function App_creationCompleteHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
this.CreatePV3D();

}

private function CreatePV3D():void
{
var Path:String = "../Images/pv3d.jpg";
var iPV3D:MyPV3D = new MyPV3D(Path);
var iUI:UIComponent = new UIComponent();
iUI.addChild(iPV3D);
iCanvas.addChild(iUI);
}

]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<mx:Canvas id="iCanvas" width="700" height="500"/>
</s:Application>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值