Flash3Dの最近のブログ記事

現時点で3000件以上投稿されています。
いろんな作品があって楽しいです。
特に上手な作品をピックアップしてみました。

作者別:
POKEMONさん

NAOSUKEさん

HEEさん

WEEPYMOONさん

TOADさん

景色、建物:

キャラクター:

ゲーム機、コンピュータ:

乗り物:

その他:

立体ブロックを使ってお絵描きできるサイト「Q-BLOCK」を公開しました。
ぜひ遊んでください。

メモリを大量に消費しちゃいます。動かない人は新しいPC買うと良いよ。
短期間でサクッと作れたので割と満足してます。
Papervisionのおかげ。


FLV動画をマテリアルにする場合は、VideoStreamMaterial()を使います。

//FLV読み込み
var nc:NetConnection = new NetConnection();
nc.connect(null);
var ns: NetStream = new NetStream(nc);
var video:Video = new Video();
video.attachNetStream(ns);
ns.client = {};
ns.play("http://kyucon.com/nekotv/012.flv");
//マテリアル生成
var material:VideoStreamMaterial = new VideoStreamMaterial(video,ns);
//平面にマテリアルを適用
plane = new Plane( material, 320, 240);
scene.addChild(plane);

・サンプルSWF
・ソースファイル


オブジェクト同士の接触判定はhitTestObject()で可能です。

if(objA.hitTestObject(objB)){
	//接触している
}

ただしバウンディングボックス同士での判定なので、
形状によっては本当は当たってないのにtrueになったりします。
回転やスケールを変えてもバウンディングボックスは変化しないようです。
正確に判定したい場合は自前で実装するしかないですね。
・サンプルSWF
・ソースファイル

関連する情報として下記があります。
DisplayObject3D.geometry.boundingSphere バウンディングスフィア情報
DisplayObject3D.geometry.aabb ローカル座標軸に沿ったバウンディングボックス情報
Vertices3D.boundingBox() ローカル座標でのバウンディングボックス情報
Vertices3D.worldBoundingBox() グローバル座標でのバウンディングボックス情報


被写界深度のぼかし表現をシンプルに再現してみます。
ポイントは下記です。
・ぼかしをかける対象となるVieportLayerをviewport.getChildLayer()を使って作成。
・カメラからオブジェクトまでの距離はcamera.distanceTo()を使って求める。
・距離に応じてVieportLayerにBlurFilterをかける。

//ぼかし対象となるビューポートレイヤーを格納する配列
private var layers:Array = [];
//カメラから注視点までの距離(この距離にある物が一番はっきり見える)
private var offset:Number = 1000;
//レンダリングのたびに更新
override protected function onRenderTick(event:Event):void {
 for (var i:uint = 0; i < layers.length; i++) {
  //注視点からオブジェクトまでの距離
  var distance:Number=Math.abs(camera.distanceTo(layers[i].displayObject3D)-offset);
  //距離に応じてぼかし量を調節
  var v:uint = Math.min(30, distance* 0.02);
  //ViewportLayerにフィルターを掛ける
  layers[i].filters = [new BlurFilter(v,v,2)];
 }
}
・サンプルSWF ・ソースファイル


頂点を指定してポリゴンを作成するには下記のようにします。

//メッシュのマテリアル
var material:ColorMaterial = new ColorMaterial(0x00AA00);
//メッシュを作成
mesh = new TriangleMesh3D(material, [], []);
scene.addChild( mesh );
//頂点作成
var v0:Vertex3D = new Vertex3D(-25, 0, 0 ) ;
var v1:Vertex3D = new Vertex3D(25, 0, 0 ) ;
var v2:Vertex3D = new Vertex3D(0, 50, 0 );
//表面からみて反時計周りになるように頂点を選ぶ
var vertices:Array = [v0, v1, v2];
//メッシュに頂点の配列を追加
mesh.geometry.vertices=vertices;
//メッシュに面を追加
mesh.geometry.faces.push( new Triangle3D(mesh, vertices));
//頂点の法線計算実行(やらなくても支障ないかも、シェーディングに使うのかな)
mesh.geometry.ready = true;
・サンプルSWF ・ソースファイル

BitmapViewportMaterialを使うとBitmapViewport3Dをテクスチャにすることができます。
別のカメラで映している景色を壁面に投影したい時や、または鏡の表現を行う時などに使います。

//ビューポート生成
bmpView= new BitmapViewport3D(600, 600, false, false, 0xeeeeee);
//ビューポートをマテリアル化
var material:BitmapViewportMaterial = new BitmapViewportMaterial(bmpView);
//平面のマテリアルとして適用
var plane:Plane= new Plane(material, 200, 200);
//レンダリングのたびに更新
override protected function onRenderTick(event:Event = null):void {
 //cameraで映したsceneをbmpViewにレンダリング
 renderer.renderScene(scene, camera, bmpView);
 super.onRenderTick();
}
・サンプルSWF ・ソースファイル


ReflectionViewを継承することで、床(XZ平面)の反射表現を行えます。

public class World extends ReflectionView{
 public function World(){
  super(600, 600, false);
  //鏡面のY座標を設定
  surfaceHeight = -100;
  //鏡面の色を調整
  setReflectionColor(0.7, 0.7, 0.7);
  //鏡面をぼかしたい場合は下記フィルターを使う
  viewportReflection.filters = [new BlurFilter(10,10,2)]; 
 }
}
・サンプルSWF ・ソースファイル


残像エフェクトをかける場合は、通常のViewport3Dは使わずに
BitmapViewport3Dクラスを使います。このエフェクトは描画負荷がかなり高いです。

//BitmapViewport3Dを生成
viewport = new BitmapViewport3D(600, 600, true, true, 0xcccccc);
addChild(viewport);
//残像効果を描画するためには下記をfalseにする
viewport.fillBeforeRender = false;
そして、レンダリングのたびに残像をぼかす処理と徐々に消す処理を行う
override protected function onRenderTick(event:Event = null):void {
 var bmd:BitmapData=viewport.bitmapData;
 //残像をぼかす
 bmd.applyFilter(bmd, bmd.rect, point, blur);
 //古い残像が消えていくように
 bmd.colorTransform(bmd.rect, alphaTrans);
 super.onRenderTick();
}

・サンプルSWF
・ソースファイル


ベクターデータの文字を表示したい時はText3Dクラスを使います。

//マテリアル生成(色とアルファ指定)
var textMaterial:Letter3DMaterial = new Letter3DMaterial(0xFF0000,1);
//フォント生成
var font:HelveticaBold = new HelveticaBold();
//テキスト3D生成
var text3D:Text3D = new Text3D("Hello World.", font, textMaterial);
scene.addChild(text3D);

Papervision3Dライブラリに付属しているフォントクラスはHelveticaファミリーだけですが、
他のフォントを使いたい場合は、PotrAsなどを使ってフォントクラスを作るみたい。
参考:Papervision3DのText3Dで日本語使ってみたのをWonderflでforkした

・サンプルSWF
・ソースファイル

追記:09/06/16 19:54
フォントクラスの作り方は下記に載っています。FIVe3Dのmake_typographyツールを使います。
MAD VERTICES: PV3D Text Primitive
※日本語フォントを全文字変換するのは非常に時間がかかるので現実的ではないです。
※全角スペースはエラーが出るので変換対象に含めてはいけないようです。

1 2 3