A-FRAMEを触り始めました。
3D空間が簡単に作れて楽しいです。
とりあえず形状を作成してクルクル回して楽しんでるだけなのですが、どんな形状があるのか公式ドキュメントをチラ見すると、ちょっと疑問を持ちました。
dodecahedron
なんだこれ？？
circle とか box はわかるのですが、dodecahedronこれはパッとわかりません。
まず、A-FRAMEにおけるプリミティブを理解する為、
名称と概要の和訳の一覧を作成してみました。
直線平面
| プリミティブ名 | 画像 | 概要の翻訳 |
|---|---|---|
| a-triangle |  |
プリミティブ三角形は、三角形に設定タイプのジオメトリコンポーネントを使用して、三角形の面を作成します。 |
| a-plane |  |
プリミティブ面は平面に設定タイプのジオメトリコンポーネントを使用して平坦な表面を作成します。 |
| a-text |  |
テキストコンポーネントをラップします。 |
| a-image |  |
原始画像が平面上の像を示しています。 |
| a-video |  |
ビデオプリミティブは、平面上のテクスチャとしてビデオを再生します。 |
直線多面体
| プリミティブ名 | 画像 | 概要の翻訳 |
|---|---|---|
| a-tetrahedron |  |
四面体 |
| a-box |  |
プリミティブボックスは、箱、立方体、又は壁のような形状を作成します。 |
| a-octahedron |  |
八面体 |
| a-dodecahedron |  |
十二面体 |
| a-icosahedron |  |
二十面体 |
曲線平面
| プリミティブ名 | 画像 | 概要の翻訳 |
|---|---|---|
| a-circle |  |
プリミティブ円は、円を作成する円に設定タイプのジオメトリコンポーネントを使用して表面。 |
| a-ring |  |
プリミティブリングは、リング又はディスク形状を作成します。 |
| a-link |  |
プリミティブリンクが似ているリンクを定義するためのコンパクトなAPIを提供します 伝統的なタグ。 |
曲面多面体
| プリミティブ名 | 画像 | 概要の翻訳 |
|---|---|---|
| a-cone |  |
プリミティブコーンは、円錐形状を作成します。 |
| a-cylinder |  |
プリミティブシリンダは管と曲面を作成するために使用されます。 |
| a-sphere |  |
プリミティブ球体は、球形または多面体形状を作成します。これは、ラップ球にその幾何学的プリミティブのセットとジオメトリコンポーネントを規定するエンティティ。 |
| a-videosphere |  |
プリミティブvideosphereは、シーンの背景に360°のビデオを果たしています。Videospheresは、内部にマッピングされた映像の質感を持つ大規模な球です。 |
| a-sky | 空プリミティブは、シーンに背景色や360度の画像を追加します。スカイ内部にマッピングされた色や質感のある大きな球です。 | |
| a-curvedimage |  |
プリミティブ湾曲した画像は、ユーザの周囲にその曲げ画像を作成します。曲がりました カメラの周囲に配置された画像は各ので視認性のために喜ばせることができます ピクセルは、ユーザから同じ距離に位置します。彼らは、より良い選択することができ複雑なレイアウトのための角度のついたフラットな面よりも、彼らがスムーズに確保するため、表面ではなく平面間の厄介な継ぎ目の一連。 |
| a-torus |  |
プリミティブトーラストーラスに設定タイプのジオメトリコンポーネントを使用して、ドーナツまたはチューブ形状を作成します。 |
| a-torus-knot |  |
トーラス結び目プリミティブはtorusKnotに設定タイプのジオメトリコンポーネントを使用して、プレッツェル形状を作成します。 |
インポート
| プリミティブ名 | 画像 | 概要の翻訳 |
|---|---|---|
| a-gltf-model |  |
3D glTFモデルが3Dで作成したglTFモデルプリミティブを表示モデリングプログラムまたはWebからダウンロードしました。 |
| a-obj-model |  |
.OBJモデルプリミティブは、3D波面モデルを表示します。 |
シーンの設定などの形状以外
| プリミティブ名 | 画像 | 概要の翻訳 |
|---|---|---|
| a-camera | 原始的なカメラは、ユーザーが見ているものを決定します。我々変更することができます カメラエンティティの位置と回転を変更することで、ビューポート。 | |
| a-cursor | 原始的なカーソルはクリックして基本を可能にしたレチクルであります ハンドコントローラを持っていないデバイス上のシーンとの対話。デフォルトの外観は、リング形状です。カーソルが通常のように配置されています カメラの子。 | |
| a-light | 光は、シーンのライティングやシェーディングを変更します。 | |
| a-sound | 原始的な音は、音成分をラップします。 |
まとめ
各プリミティブを一通りレンダリングしてみました。
うまく動いていないところや良くわからない部分もたくさんあるので、もう少し詳しく各形状を見ていきたいと思います。
a-video-sphere ところどころ欠けてしまうa-obj-model テクスチャが表示されていないa-link カーソルを合わせなくても勝手に画面遷移するa-torus-knot 何に使えばいいのかな、う○こかな
ほとんどわからないながらも、 a-gltf-model のようにどこかからパクってきたモデルが、簡単にブラウザ上でレンダリングできるのはすごく楽しいです。
