Flashで3Dを実現する素材集
 Kurukuru  for Flashplayer6 and FlashMX


Flashで3D表現を実現する素材集です。
Flashユーザの方のために、ソースファイルも同梱してあります。
もちろん、Flashユーザでない方も、お使いいただけます。

実験的に作ったので、実行速度も特別速いわけではありませんし、
単純なモデルでないと、リアルタイムに動かしたりはできません。

リアルタイムに動かすのでなければ、かなりつかえると思います。

10/14 Shade2KurukuruをMacでも使えるように修正
10/6 現在確認されている不具合を追加 設置方法に追記
10/5 大事なことを書き忘れていました。(Shade用スクリプトについて)


説明
使い方
Flashムービーの設置方法
設定ファイルの文法
Shade用スクリプトShade2Kurukuruについて
アクションスクリプトについて
さらなる改造
現在確認されている不具合




ダウンロード



サンプル <- ダウンロードファイルに含まれているものと同じものも含まれています。


download  kurukuru2.lzh  84kb Windowsで動作確認済み 
<-new!
Macでも使えますが、私がMacを持っていないため、未確認です。情報お待ちしています。
また、同梱のShade用スクリプトは、Winのみ対応とさせていただきます。
Shade用スクリプトを修正したので、Mac版でも使えます、作者がWinしか持っていないので未確認ではありますが。。
暇があれば、動作状況を知らせていただけるとうれしいです。

Shade2Kurukuru.tcl  for Win/Mac
 <-new!
以前配布していた、kurukuru1.lzhに含まれているShade用スクリプトは、Win用でしたが、現在配布中の、kurukuru2.lzhには、WinでもMacでも使えるスクリプトが含まれています。
このtclファイルは、lzhファイルをダウンロードするのがめんどくさい人のために用意してあります。lzhファイルに含まれるものと全く同じものです。




説明


まずは、ダウンロードしたファイルを解凍して、その中に入っているhtmlファイルを実行してみてください。
3D形状が表示され、マウスでドラッグするとクルクルまわります。
(一部、まわらないものもあります)

kurukuruの仕組みを説明します。

kurukuru.swf を、ページに設置します。

実行時に、Flashムービーは、poly.txt、camera.txt、config.txtの3つのファイルを読み込んで、3D処理をして描画します。

3つの設定ファイルは、XMLの文法で書かれております。
kurukuru.lzhには、 Shadeから、この設定ファイルを書き出すスクリプトを同梱してあります。
また、サンプルファイルを書き換えたり、自作したりすることも可能ですし、
他の3Dソフトでも、プラグインの機能を備えたソフトであれば、データを書き出すことも可能です。

Flashユーザでない人は、この3つの設定ファイルと、ダウンロードしたファイルのswfsフォルダ内のswfファイルを用意してページに貼り付けるだけです。
なお、この場合、設定ファイルのファイル名は変更できません。

また、Flashユーザの方は、3つの設定ファイルはもちろん、swfファイルを書き換えたり、自分のムービーファイルにkurukuruを組み込む事もできます。


追記!10/6
swfファイルを埋め込むhtmlファイルも、同じディレクトリに入れてください。

自分で改造する人は、この制限はありませんが、設定ファイル名をパラメータに入力する時に注意が必要です。







使い方

Flashユーザでない方(Flashでのオーサリングをしない方)


解凍したファイルに入っている、swfsフォルダの中のkurukuru1〜kurukuru4.swf と、3つの設定ファイルを同じディレクトリに入れて、自分のページに張り込みます。
それだけです。

Flashユーザーの方(Flashで、さらなるオーサリングを行う方)

解凍したファイルの中の、lirbaryフォルダの中に入っている、kurukuru.flaを開きます。
このファイルをさらに変更するか、このファイルのライブラリに入っている 「3Dkurukuru」フォルダを、自分のflaファイルにインポートします。
また、kurukuru.flaを、Flashのconfigフォルダ内に設置すれば、Flashのメニューの、「サンプルライブラリ」内からすぐにアクセスできるようになります。

まず、Kurukuruコンポーネントをステージ内にドラッグして設置します。このインスタンスの場所が、3Dモデルの中心(カメラの方向)になります。
次に、そのインスタンスを選択した状態で、プロパティインスペクタを開き、「パラメータ」タブをクリックして、パラメータを入力します。
デフォルトでは、「camera.txt」「poly.txt」「config.txt」 になっています。必要に応じて変更してください。ムービーに1つしかkurukuruを置かない場合は、デフォルトのままで差し支えありません。

これだけでパブリッシュすれば、3Dモデルが表示されます。

次に、マウス操作が可能なようにします。

さきほど設置した、「Kurukuruコンポーネント」のインスタンスを選択した状態でプロパティインスペクタを開き、「プロパティ」タブを クリックし、インスタンス名に好きな名前を入力します。ここでは、「kurukuru」と入力したとします。

次に、ライブラリ内から、「mousereciever」コンポーネントをステージ内にドラッグして設置します。 そのインスタンスを選択した状態で「プロパティインスペクタ」を開き、「パラメータ」タブをクリックして、「target」の値を、「kurukuru」にします。「mousereciever」のインスタンスは、どこの場所に設置してもかまいません。また、これを設置すると、Flashムービーの全体で、マウスドラッグによる回転が有効になります。

これで、マウスドラッグによる操作が可能になりました。パブリッシュして確認してください。

さらに複雑な操作は、スクリプトを組んで実装することになります。





Flashムービーの設置方法

ダウンロードしたファイルに入っているhtmlファイルは、FlashMXでパブリッシュしたファイルですので、DreamWeaverなどのMacromedia製品をお使いの方は、簡単にページに配置できると思います。
ホームページの作成ソフトをお持ちでない方も、ダウンロードしたファイルに入っているhtmlファイルを参考にして自分のページに設置してください。
追記!10/6
swfファイルを埋め込むhtmlファイルも、同じディレクトリに入れてください。

自分で改造する人は、この制限はありませんが、設定ファイル名をパラメータに入力する時に注意が必要です。






設定ファイルの文法


設定ファイルは、自分で書き換えることが出来ます。これによって、3D形状の辺や頂点の表示、非表示、頂点のサイズなど、を書き換えることができます。
設定ファイルは、どれもXMLによって定義されます。ファイル名は、同梱されているswfファイルをそのまま
使う場合は、「camera.txt」「poly.txt」「config.txt」となります。
Flashを使って自分で組み込む場合は、ファイル名に制限はありません。

注意!
 XMLの操作には細心の注意を払ってください。すこしでも書式がくずれると、正しく読み込まれません。特に、データの間にスペースを入れたり、全角文字を入れたりすると、エラーになります。(なにも表示されません)


camera.txt


<camera>
<eye>2078.336182,600,-1538.040527</eye>     <--  カメラ位置の座標をカンマで区切って入力します。
<target>0,0,0</target>              <--   カメラの注視するポイントです。3D形状が回転する時の中心にもなります。
<zoom>26.391129<zoom>              <--   焦点距離です。
</camera>


poly.txt


<poly> <number point="3" line="3"></number>    <-- 頂点、辺の数です。これより多くの頂点や辺は読み込まれません <points> <p>0.000000,0.000000,-1500.000000</p>    <-- 頂点の座標をカンマで区切って書き込みます。 <p>-1299.038086,0.000000,750.000061</p>      いくつでも入力可能です <p>1299.038208,0.000000,749.999878</p> </points> <lines> <l>0,1</l>                 <-- 辺の情報です。辺の両端のポイントが、頂点座標の何番目かを入力します。 <l>0,2</l>                   辺は、2点からなる辺しか入力できません。 <l>1,2</l> </lines> </poly>




config.txt


<config> <mul>8</mul>            <-- 形状がFlashムービーで表示される時の拡大率です。これで大きさを調節してください。 <speed>40</speed>         <-- マウス操作での回転の速さです。スクリプトで制御させる時にも影響します。 <pointvisible>1</pointvisible>   <-- ポイントを表示させる時は 1 させない時は 0 <linevisible>0</linevisible>    <-- 辺を表示させる時は 1  させない時は 0 <pointcolor>0x99ff99</pointcolor> <-- 頂点の色を「0x」に続いて、HTMLでの色指定と同じ、6桁を入力します。 <linecolor>0x000000</linecolor>  <-- 同じく、辺の色です <bgcolor>0xffffff</bgcolor>    <-- 背景色です。同梱のswfファイルを使う場合のみ影響します <handlemode>0</handlemode>     <-- マウス操作と回転が同方向なら 0  逆方向なら 1  スクリプト操作にも影響 <fraction>1</fraction>      <-- マウス操作後のブレーキのかかり具合を、0から1での数値で指定します。 <pointsize>5000</pointsize>    <-- 頂点の大きさです。通常は、ピクセル数、頂点の大きさに遠近をつける場合は、実際の大きさになります。 <pointalpha>60</pointalpha>    <-- 頂点の不透明度を、0から100の数値で指定します。 <pointresize>1</pointresize>   <-- 頂点の大きさに遠近をつける場合は 1 つけない場合は 0 </config>



Shade用スクリプト Shade2kurukuruについて   大事なことを書き忘れてました!!

ダウンロードファイルの中の、shadeフォルダには、Shade用のスクリプト「shade2kurukuru.tcl」が含まれています。
Shadeで、ポリゴンを1つ選択して、これを実行すれば、3つの設定ファイルを書き出すことができます。
カメラの設定は、視点、注視点、焦点距離のみが適用されます。
大事なことを書き忘れてました!!
スクリプトを実行する前に、shadeの形状ファイルを、保存して置いてください。その保存先のフォルダに設定ファイルが作成されます。
特に、別ファイルをインポートした時などは、フォルダの位置が変わってしまいますので、しっかり、「保存」をしてください。


アクションスクリプトについて

Flashユーザが、このkurukuruを使って、さらに自由な操作を利用できるように、Flashのアクションスクリプトによる操作が可能です。
利用可能なメソッドやプロパティを解説します。

Kurukuru コンポーネントが、非常に重要な部品で、中身は単なるムービークリップです。
このインスタンスを作成することで、3D形状の表示を行います。
また、これにインスタンス名をつけて、外部から操作することによって、さまざまな操作を行います。

メソッド go();
         これを呼び出すことによって、3D形状の描画を更新します。下記の、pressedがtrueになっている時のみ有効です。
プロパティ  difx
プロパティ  dify
         これの値を変更することで、3D形状の回転具合を操作します。
         difxは、緯度方向、difyは軽度方向の回転です。
プロパティ pressed
        この値をtrueにすると、マウスドラッグによる操作が可能となります。falseにすると、マウスドラッグを受け付けなくなります。
        ライブラリ内にある、「mousereciever」コンポーネントは、mouseDown、mouseUpイベントにより、常時pressed=trueとしているために、常にマウス操作を受け付けます。
        マウス操作を受け付けるタイミングを自分で設定する場合はこのプロパティを、自分で設定する必要があります。
プロパティ speed
        形状の回転する速さです。マウスドラッグによる操作を受け付けている場合は、マウスの速さと、この速さとが加味されたスピードになります。
        また、スクリプトによる操作の際にも影響します。
プロパティ mul  
        3D形状を表示するサイズです。

以下未稿 まだまだありますが、文章化は非常にやっかいですので、も少しお時間をください。



さらなる改造

ライブラリ内のアイテムを改造することで、さらに改造することが出来ます。
ライブラリの、「3Dkurukuru」-「asset」内のアイテムを改造することで、辺や頂点を改造することが出来ます。
改造してもいいアイテムは、「ball」と「「line」です。
アクションスクリプトを使った制御よりはるかに簡単なので、気楽に改造してみてください。




現在確認されている不具合 (仕様?)

Kurukuruには、現在確認されている不具合が多少あります。
どれも、致命的なものではないですが、一読しておいてください。

・緯度方向に回転を続けると、カメラ位置が赤道上に漸近していく。(カメラ処理のアルゴリズムが稚拙なための、仕様)
  スピードをべらぼうに大きくしていなければ、マウス操作ならば、気にならない範囲です。スクリプトで操作する場合、この現象を回避することは無理です。
  しかし、カメラを緯度方向にしか回さないのであれば、軽度方向に一定の値だけ回転させてやることで、赤道以外の緯線に収束します。
・回転させてないのに、Flash開始時に、回転運動をする。
 カメラ位置が遠すぎる、あるいは近すぎる時に発生するようです。(原因不明)正常に動作するモデルデータをバックアップしておいて、そのシーンで、別のデータも作成すると、正常な結果を100%で再現できます。
・実行速度が遅すぎる。(これは、永遠の課題か。。。)
 これといった回避策は無し。多くは、作者のプログラムが稚拙なためですが、もちろん、頂点、辺の表示、頂点のパースの有無をはずせば、それだけ軽くなります。
 また、色設定は、これといって負荷に関係ありませんが、頂点の透明度を設定すると負荷も重くなるようです。
 Flashの表示品質を落とすのも有効です。


カメラ移動のアルゴリズムは改善する予定です。
また、さらなる機能アップの際に、プログラムの見直しをする予定なので、多少負荷が少なくなると思われます。




当ホームページで配布するツールによって生じたいかなる損害も、私は責任をもちません。
スクリプトの実行の前に、バックアップをとっておくなどしてから、各自の自己責任でおつかいください。