papervision3d学习笔记:螺旋效果

很久之前就想实现螺旋的旋转效果，没想到看了外国的一篇博文，已经把他实现了。我把他的代码改了一个简单的方式，实现了旋转的效果：

这种效果，涉及到圆的知识，以及螺旋梯形原理。把他切开平面图可以看到，圆柱的底形是一个圆，我们可以将这个圆分割成10份，每一份36度。然后，随着高度的上升，相应的z 轴高度也相应增加。这样就可以实现以上的效果了

{

x：平面x

y：平面y

z： 涉及到高度

}

package
{
import flash.display.Sprite;
import flash.events.*;
import org.papervision3d.cameras.Camera3D;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.materials.*;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.view.Viewport3D;
import org.papervision3d.render.BasicRenderEngine;
import org.papervision3d.objects.primitives.*;
import org.papervision3d.materials.utils.MaterialsList;

public class Example extends Sprite
{
private var viewport:Viewport3D=new Viewport3D(800,600);//创建窗口
private var renderer:BasicRenderEngine= new BasicRenderEngine();//渲染引擎
private var camera:Camera3D = new Camera3D();//´摄影机
private var pc:Plane = new Plane();
private var scene:Scene3D = new Scene3D();//创建一个三维场景
private var angle:Number = 0;//角度
public function Example()
{
init3D();//初始化3d模型
}
private function init3D():void
{
addChild(viewport);//添加显示窗口
camera.z =400;
camera.target = pc;
var num:int = 100;
var numOfRotations:Number = 5;
var anglePer:Number = ((Math.PI*2) * numOfRotations) / num;
var yPos:Number = 0;
// Create the planes
//var pa:Array = new Array();
//创建平面，并且赋予贴图
for (var i:uint=0; i<100; i++)
{
var cm:BitmapAssetMaterial = new BitmapAssetMaterial("air");
cm.oneSide = false;
var p:Plane = new Plane(cm, 100, 100);
p.x = Math.cos(i * anglePer) * 500;
p.z = Math.sin(i * anglePer) * 500;
p.y = yPos += 50;//实现螺旋一个地方
p.rotationY = (-i*anglePer) * (180/Math.PI) + 270;
scene.addChild(p);
}
addEventListener(Event.ENTER_FRAME, Run);

}
private function Run(event:Event):void
{
var dist:Number = ((stage.mouseY) - stage.stageHeight * 0.5) * -0.1;
var dist2:Number = ((stage.mouseX) - stage.stageWidth * 0.5) * 0.0005;
angle += dist2;
camera.x = Math.cos(angle) * 1000;
camera.z = Math.sin(angle) * 1000;
camera.y += dist;
if (camera.y < 369)
{
camera.y = 369;
}
if (camera.y > 4755)
{
camera.y = 4755;
}
pc.y = camera.y;
renderer.renderScene(scene, camera, viewport);//渲染图形
}
}
}

如果你有兴趣修改

p.x = Math.cos(i * anglePer) * 500;
p.z = Math.sin(i * anglePer) * 500;
p.y = yPos += 50;//实现螺旋一个地方

变成：

p.x = Math.cos(i * anglePer) * 500;
p.y = Math.sin(i * anglePer) * 500;
p.z = yPos += 50;//实现螺旋一个地方

你会发现又有一 个不同的效果出现。

这个地方主要涉及到就是一个坐标的巧妙应用。结合三维的引擎强大功能实现炫的效果。

大概介绍是这样，顺便将这篇文章作者发一下：http://theflashblog.com 有兴趣可以到这里看看。

注意：由于作者使用的版本是旧版本，所以编译的时候会出错，注意版本，这个编译的版本是pv3d 2.8的版本。

下面是网络上的一个源文件：原理大概和上面相同，采取xml+图片的技术 进行外部图片加载，并且对plane对象进行贴图。 同样为了增加一下交互性，效果可以看起来更加cool，可以进行鼠标监听监听。看起来效果更加酷：

基本用到的技术：flash+xml配搭 +鼠标交互应用。总的来讲pv3d封装了这些类让实现效果变得更加容易。