Papervision3Dの最近のブログ記事

閃いたので書きなぐる。後でまとめる。実装するまでのドラフト

/*
* キモの部分。
* 細かい条件分岐などは割愛
* 以下全体を render で呼んどいてENTER_FRAME しとく
*/

// 現在の角度
var nDegree:Number = 現在の角度;

// 目標の角度
var dDegree:Number = 例えば45とか;

// 1フレームで回転する角度（その都度目的角度までの2/1度）
var rad:Number = ((dDegree - nDegree)/2)*Math.PI/180;
        
// 現在の座標
var pX:Number = camera.x;
var pZ:Number = camera.Z;

// 回転後の座標
camera.x = pX*Math.cos(rad) - pZ*Math.sin(rad);
camera.z = pZ*Math.cos(rad) + pX*Math.sin(rad);

無理かなぁ...

デザイン固まったら試す。

とりあえずテクスチャの貼り付けまでやってしまう。とりあえずリファレンスを軸にいろんな先人達のブログを参考にしつつ...。

気になってたViewport3Dのパラメータ、autoClippingとautoCullingについてはどうやら初期値のまま触ることは無さそうなので忘れてよさそう。

viewport = new Viewport3D(0,   //viewportWidth
						  0,   //viewportHeight
						  true, //autoScaleToStage:Boolean
						  false, //interactive:Boolean
						  );

テクスチャの貼り付けは、別途用意したjpg画像をFlash上でライブラリに読み込んでおいてリンケージしてそれをBitmapAssetMaterialで読み込んで単純にSphereコンストラクタの第１パラメータとした。単純に外部データを読み込む場合はBitmapFileMaterialを利用するらしいが、これは問題があるっぽい。画像のロードが完了する前にプリミティブの描画が始まっちゃうと、テクスチャ無視されて表示されなくなる場合があるとかないとか。重い画像データを読み込んだりする場合は、ロードの完了タイミングを計測してからプリミティブの描画、といった順序が必要になるらしい。

//texture
var material:BitmapAssetMaterial = new BitmapAssetMaterial("earthMap");
			
//material
earthBase = new Sphere(material, //material:MaterialObject3D
					   240,      //radius
					   40,　　　//segmentsW:int
					   40       //segmentsH:int
					   );

まぁそんなこんなでとりあえず地球。あとはシリンダーの中にすっぽり入れてしまって、シリンダーの中身に宇宙テクスチャを貼り付ければとりあえず完成なんだろうか。その前に、何やらGreatWhiteではBasicViewなるクラスがあってこれが便利らしいので、その辺りの調査が先かなぁ。まぁ仕事の合間なので歩みは遅いがちょびちょびと。

Viewportのパラメータ、viewportWidthとviewportHeightの概念がよく分からない。数値を色々変えてコンパイルしてみるも、表示結果に変化がない。調査巡回してもとりあえず0,0にしてる人が多いみたいなので、ここはひとつ盲目的に0,0で進めるか。いずれ分かる日が来るんかな。

//viewport
viewport = new Viewport3D(0,   //viewportWidth
						  0,   //viewportHeight
						  true, //autoScaleToStage:Boolean
						  false, //interactive:Boolean
						  true,  //autoClipping:Boolean
						  true   //autoCulling:Boolean
						  );

あとcameraのzoomメソッドとfocusメソッド。無設定でコンパイルした時と、zoom = 40でコンパイルした時とで球体の表示サイズが同じなので、cameraの標準倍率は40ってことかいな？
さらにfocusメソッドが絡むとまた変な感じ。単純にzoom * focus的なサイズで表示されるけど、合焦値的なパラメータではないのか。

その辺りの検証をnote.xさんがやってた。でもやっぱfocusの概念がよくわからない。← そういえば、とOOPas3.0読み直して理解した。視野角な。（P250）じゃzoomが変なのか。単焦点なのにズームできる、みたいな。そりゃピクセル等倍どうすんの、て話になるよなｗ

それにしても「SyntaxHighlighter」の挙動にイライラ。なんで個別アーカイブになると反映されないのかなぁ。

とグダグダ言いつつ、最終目標に関係ないが球体の回転をマウスに反応させてみた。

protected function onRenderTick(e:Event):void
{
	var xDist:Number = mouseX - stage.stageWidth * 0.5;
	var yDist:Number = mouseY - stage.stageHeight * 0.5;
	earthBase.rotationX += yDist * 0.02;
	earthBase.rotationY += xDist * 0.02;
	renderer.renderScene(scene, camera, viewport);
}

ピーク前にからくもAdobe CS3の Production Premiumを手に入れ、今更ながらFlashやらAfter Effectsにも本腰を入れられる環境が整った。

今までFlexSDKやらでAS3の勉強はしてたけど、やっとFlashのIDEでまともに作業できるようになってホッとした。Flash Developとか使いたいけどOSはまだ10.4.*なのでガマンガマン。AEも含めて試したいこと・試すべきこと山ほどある中、よせばいいのにPapervision3Dに手を出した。

うーん、背景黒にしたのに黒にならないわ（情けない話、wmodeをそう設定してただけでした）、読み込むたびにメッシュラインのカラーが違うわ、分からんことが多いけど、とりあえず宇宙空間に浮かんで自転する地球を表現できるまでやってみる。

そんなこんなでついでに「SyntaxHighlighter」も試してみようということで、駄コードを晒してみる。

package
{
	import flash.display.Sprite;
	import flash.events.Event;
	
	import org.papervision3d.cameras.Camera3D;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.view.Viewport3D;
	import org.papervision3d.scenes.Scene3D;
	
	import org.papervision3d.objects.primitives.Sphere;
	
	public class Main extends Sprite
	{
		private var viewport:Viewport3D;
		private var scene:Scene3D;
		private var camera:Camera3D;
		
		private var renderer:BasicRenderEngine;
		private var earthBase:Sphere;
		
		public function Main():void
		{
			init();
		}
		
		public function init():void
		{
			//viewport
			viewport = new Viewport3D(470,   //viewportWidth
									  350,   //viewportHeight
									  false, //autoScaleToStage:Boolean
									  false, //interactive:Boolean
									  true,  //autoClipping:Boolean
									  true   //autoCulling:Boolean
									  );
			addChild(viewport);
			
			//render
            renderer = new BasicRenderEngine();
			
			//camera
            camera = new Camera3D();
			
			//scene
			scene = new Scene3D();
			
			//material
			earthBase = new Sphere(null,
								   240,
								   20,
								   20);
			
			scene.addChild(earthBase);
			addEventListener(Event.ENTER_FRAME, onRenderTick);
		}

		protected function onRenderTick(e:Event):void
		{
			earthBase.rotationX += 2;
			earthBase.rotationY += 1.5;
			earthBase.rotationZ += 1;
			renderer.renderScene(scene, camera, viewport);
		}
	}
}

なぜだ。「SyntaxHighlighter」が効いてないみたい... orz