Transform、MatrixTransformを使った
変形オブジェクト

#VRML V1.0 ascii

　　　　　　　 DEF BackgroundColor Info{　　　　　　 string "0.8 0.9 1" }

　　　　　　　 PerspectiveCamera {
　　　　　　　　　　　　　　　 position　　　　　　　 -0.5 0.2 1.8
　　　　　　　　　　　　　　　 orientation　　　　 0 0 0 0
　　　　　　　　　　　　　　　 focalDistance　　 2
#　　　　　　　　　　　　　　 heightAngle　　　　 0
　　　　　　　 }　　　　　

　　　　　　　 Texture2 { filename "wood.gif" }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 DEF edge Separator {
　　　　　　　　　　　　　　　　　　　　　　　 Transform {
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 translation　　　　　　　 0 0.45 -0.8
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 rotation　　　　　　　　　　 -1 0 0　 0.8
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 scaleFactor　　　　　　　 0.05 1.2 0.2
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 scaleOrientation　　 -1 0 0　 0.3
　　　　　　　　　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　　　　　　　　　 Texture2Transform {
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 rotation　　　　 1.3
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 scaleFactor　 2 1
　　　　　　　　　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　　　　　　　　　 Cube {　 }
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Translation { translation -1 0 0 }
　　　　　　　　　　　　　　　 USE edge
　　　　　　　 }
　　　　　　　 Separator {
　　　　　　　 Translation {translation -0.5 0 0 }
　　　　　　　　
　　　　　　　 DEF Step Cube {
　　　　　　　　　　　　　　　　　　　　　　　 height 0.05
　　　　　　　　　　　　　　　　　　　　　　　 width 1
　　　　　　　　　　　　　　　　　　　　　　　 depth 0.45
　　　　　　　 }

　　　　　　　 DEF StepUp Group {
　　　　　　　　　　　　　　　 DEF Up Translation { translation 0 0.2 -0.35 }
　　　　　　　　　　　　　　　 USE Step
　　　　　　　 }
　　　　　　　　
　　　　　　　 USE StepUp

　　　　　　　 USE StepUp

　　　　　　　 USE StepUp
　　　　　　　 }

　　　　　　　 Translation { translation -0.5 1.25 -1.4 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 0.6 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0.7 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0 0.6 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0 0 1
　　　　　　　　　　　　　　　 }

　　　　　　　　　　　　　　　 Texture2 { filename "face.gif" }
　　　　　　　　　　　　　　　 Sphere { radius 0.4 }
　　　　　　　 }

　　　　　　　 Texture2 { }

　　　　　　　 Material {
　　　　　　　　　　　　　　　 ambientColor 1 1 1
　　　　　　　　　　　　　　　 diffuseColor 0.9 0.9 0.9
　　　　　　　　　　　　　　　 specularColor 0.1 0.1 0.1
　　　　　　　　　　　　　　　 shininess 1
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 1 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0.04 0.1 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0 1 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.16 -0.3 0 1
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Cylinder { radius 0.03 }
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 1 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.04 0.1 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0 1 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0.16 -0.3 0 1
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Cylinder { radius 0.03 }
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 1 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.1 0.1 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0 1 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.25 0.15 0 1
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Cylinder { radius 0.03 }
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 1 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.08 0.15 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0 1 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0.25 -0.02 0 1
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Cylinder { radius 0.03 }
　　　　　　　 }

　　　　　　　 Material {
　　　　　　　　　　　　　　　　　　　　　　　 diffuseColor 0.96 0.88 0.68
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 Translation { translation　　　　　　 0.33 -0.2 0 }
　　　　　　　　　　　　　　　 Sphere { radius 0.05 }
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 Translation { translation　　　　　　 -0.36 0.27 0 }
　　　　　　　　　　　　　　　 Sphere { radius 0.05 }
　　　　　　　 }

　　　　　　　 Material {
　　　　　　　　　　　　　　　　　　　　　　　 diffuseColor 0.9 0.2 0.2
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 0.7 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0.3 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0.2 0 1 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0.21 -0.4 0.05 1
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Sphere { radius 0.1 }
　　　　　　　 }

　　　　　　　 Separator {
　　　　　　　　　　　　　　　 MatrixTransform {
　　　　　　　　　　　　　　　　　　　　　　　 matrix　 0.7 0 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 0 0.3 0 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.2 0 1 0
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 -0.21 -0.4 0.05 1
　　　　　　　　　　　　　　　 }
　　　　　　　　　　　　　　　 Sphere { radius 0.1 }
　　　　　　　 }

　　　　　　　 Translation { translation 0 -1.4 0 }
　　　　　　　 Texture2Transform {
　　　　　　　　　　　　　　　 scaleFactor 10 10
　　　　　　　 }
　　　　　　　 Texture2 { filename "brick.gif" }
　　　　　　　 Cube {
　　　　　　　　　　　　　　　 height 0.1
　　　　　　　　　　　　　　　 width 6
　　　　　　　　　　　　　　　 depth 6
　　　　　　　 }

このサンプルのタイトルは「Transform、MatrixTransformを使った変形オブジェクト」ですが、新規に登場したのはMatrixTransform nodeだけです。では、説明です。
MatrixTransform { }　
MatrixTransformというnodeは強力なnodeで、オブジェクトを様々な形に変形させることができます。機能的にはTransform nodeと近いのですが、Transform nodeより少ない文字数で変形が可能です。
表記方法はMatrixというくらいなので、数字の配列の形式を取っています。ところが、妙なことにVRMLは３次元の世界であるはずなのに、MatrixTransformは４ｘ４の配列を使っています。３ｘ３の配列ならなんとなく、それぞれ、x,y,zに対応してるんだろうなぁ、と想像できますが、４ｘ４になっているというのはどういうことか？４列目と４行目は何に使えるのだろうと考えてしまいます。
まぁ、しかし、そのようなことは気にせずに、どこに何を入れるとどうなるかということだけ説明します(ことが数学的な論議になると私もよう分からんのです)。
MatrixTransform nodeは以下のように記述されます。
MatrixTransform {
matrix1000
0100
0010
0001
}

上記の数値は最低でも設定しておかなければならないものです。上記の指定をしてもオブジェクトは一切変形されませんが、上記のうちの"1"が一つでも"0"に置き換わっていたらオブジェクトが表示されません。

最初の３行と３桁はそれぞれ下に書いたような性格を持つと考えましょう。
x
方
向
面
↓		y
方
向
面
↓		z
方
向
面
↓
1000<---x軸方向
0100<---y軸方向
0010<---z軸方向
0001

その前提で考えると、例えば、左上の"1"の意味するところは、x方向の面をx軸の方向へ1変形させるということです。つまり、それじゃ何も起こらないのです。そこで、この"1"を"2"に変更してみると横幅のある図形に変形されるわけです。下みたいな感じですね。

上の赤くなっている数字は上から順にx方向、y方向, z方向それぞれについて同様のことが言えるわけです。

さて、それではそれ以外の部分、例えば一番左側の上から2番目の数字はどんな意味があるのかというと、x方向の面をy軸方向へ変形させる訳ですから、左右の面が傾くのです。下に示したのは一番左側の上から2番目の数字を1にしたものです。

それでは左から２番目の一番上の数字を1にするとｙ方向の面つまり上下の面が傾く訳です。以下のような感じですね。

それに加えて、数字を組み合わせるともう少し面白い形もできますね。下の左のような設定にすると、下の右のようなダイアモンドみたいな形も作れるという訳です。

MatrixTransform {
matrix1.500
0100
0.510
0001
}

TransformMatrixの3 x 3の配列の説明はこんなところです。これが使えれば作成したオブジェクトを変形させたり拡大縮小したりするのが楽になりますし、記述する行数も少なくて済みますね。しかし、このMatrixは組み合わせを一つ間違えるとオブジェクトがへんてこりんな形になってしまうので、気をつけましょう。

これだけできれば、まぁ大したものなんですが、実はMatrixTransformの真骨頂は4桁目の配列にあります。4 x 4の配列で一体何ができるのでしょう？
しち面倒くさい話はやめて(できないんですけどね)、端的に書きます。
一番下の列は一番右側の数字を除いて無意味です。

一番下の列の一番右側はオブジェクトのサイズを変更できます。ただし、1より大きい数字を指定するとオブジェクトが小さくなり、1より小さい数字(0より大きい数字)を指定するとオブジェクトが大きくなることに注意してください。

最後に一番右側の上から３つの数字ですが、この数字でオブジェクトを先細りの形に変形させることができるのです。
ところが、私が今まで使ったことのあるVRMLブラウザ(Cosmo Player, Live 3D, Community Place browser, VRML plugin for Internet Explorer等)では、これをサポートしていないのです。VRMLに相当入れ込んでいる人ならともかく、通常はLive ３DやIEのplug-inを使っているはずなので、せっかくの仕様も無意味になっているのが現状です。

ちなみにTGSという会社が出しているWindows版のWebSpaceがこの機能のサポートしているので、実際にどのよう見えるかを下にスクリーンショットを載せておきます。

WebSpace screen Shot

ちなみに、指定方法ですが、上から順番にx, y, zに対応していて、1以下の正の数字を指定すると、正の方向に向かって先が細くなっていきます。上の例で説明すると、一番右の上から二番目に0.7(だったと思う)を指定してあります。つまりy軸の正(上の方ってことです)の方向に向かって先が細くなっているのです。

とまぁ、こんなところですね。

　 戻る　 　 次のサンプルへ　 　 メインページ