@Author Masasi.Sanae (sunny@nikonet.or.jp)
@Version 1.00;10.Jan.1998

このぺーじにはVRML2を用いて作成した画像が用いられているため
VRML2をサポートしたブラウザでご覧ください。

VRML2 for Building Cyber Space

 2大ブラウザのうちIE4.0がリリースされ、VRML2が動作するようになりました。このことにより、先行していたNCと合わせ、より一般的なインターネット上でのサイバースペース構築が可能になりました。すでに'96年8月にはVRML2の仕様が確定している訳ですから、1年以上も普及させるのに時間がかかったといえます。

 VRML1より改良された主な点としては、

などが挙げられます。前回の仕様よりは、かなりinteractiveになったといえます。

 シーン記述言語としてより手軽に3次元空間を表現できるため、数学教材への可能性も高いといえるのではないでしょうか。今回、主として用いたのはルート制御機能です。VRMLノードによって描かれた幾何図形を、例えばクリックするといったeventが発生すると、特定の幾何図形を動かしたりすることができるのです。

 次に見るように基本的な3次元図形の切断面をいろいろな角度から見ることにより、空間的な理解力を身につけることを考えましょう。VRML1では回転させるなどの操作は全体のオブジェクトに対してだけでしたが、VRML2では個々のオブジェクトも動かすことが可能です。

 次の1番目の立方体の場合を例にあげてみます。立方体にマウスを近づけるとマウスがの形になります(IE4.0の場合)。これはセンサーが働いていることを表わしています。そして立方体上でマウスを右ドラッグすると、立方体だけを移動させることができます。同様に平面上でセンサーを働かせ右ドラッグすると、今度は平面が回転するようになります。それ以外の場所で右マウスドラッグすると、全体のオブジェクトに移動や回転をさせることができます。こうした操作を組み合わせることにより、いろいろな角度からの切断面を見ることが可能となります。

 このようにVRML2ではよりinteractiveな操作を可能にし、数学的な題材のイメージ化に大きな可能性をもたらしたといえます。実際に次の様々な3次元図形の切断面を操作してみましょう。

基本的な3次元物体の切断面

  1. 立方体の切断面

  2. 円錐の切断面

  3. 円柱の切断面

  4. 四角錘の切断面

  5. 三角錘の切断面


SAMPLE SOURCE FILE

上に上げたVRMLファイルのうち、立方体の切断面のファイル「box.wrl」を参考までに載せておきます。詳しくは最後にあげたRESOURCEを参考にしてください。

#VRML V2.0 utf8
#box.wrl

Group {
    children [
        DEF Fig Transform {
            rotation 0 0 1 1.57079
            children Shape {
                appearance Appearance {
                    material Material { diffuseColor 1 1 0 }
                }
                geometry IndexedFaceSet {
                    coord Coordinate {
                        point [ 
          1 1 1,
          1 1 -1,
          -1 1 -1,
                           -1 1 1,
                           1 -1 1,
                           1 -1 -1,
                           -1 -1 -1,
                           -1 -1 1
                        ]
                    }
                    solid FALSE
                    coordIndex [ 
                        0, 1, 2, 3, -1,     # side 0
                        0, 1, 5, 4, -1,     # side 1
                        1, 2, 6, 5, -1,     # side 2
                        2, 3, 7, 6, -1,     # side 3
                        3, 7, 4, 0, -1,     # side 4
                        4, 5, 6, 7, -1      # side 5
                    ]
                    color Color {
                        color [
                            1 0 0,    # color 0
                            0 1 0,    # color 1
                            0 0 1,    # color 2
                            0 1 0,    # color 3
                            0 0 1,    # color 4
                            1 0 0     # color 5
                        ]
                    }
                    colorPerVertex FALSE
                }
            }
        },
        DEF Trans PlaneSensor { }
    ]
}

Group {
    children [
        DEF CutPlane Transform {
            children Shape {
                appearance Appearance {
                    material Material {
                        diffuseColor 1 1 1
                    } 
                }
                geometry Box { size 5 0.05 5 }
            }
        },
        DEF Rot SphereSensor { }
    ]
}

ROUTE Trans.translation_changed TO Fig.set_translation
ROUTE Rot.rotation_changed TO CutPlane.set_rotation


RESOURCE