※ データが 12メガあるので、最初のロードはしばらく時間がかかります。 WebGL に対応しているブラウザでないと動作しません 日本語入力状態になっているとキーが効かないので注意して下さい好きな角度から見る事ができます。 ( 前回のマウス位置をカメラ位置としたのは こちら ) マウスをドラッグすると、『Fly』効果です( ふわふわ飛んでいるような移動 ) 以下は、カメラから見た移動キーです。( キーの同時押しは有効です )
W | 前進 | S | 後退 | A | 左移動 | D | 右移動 |
R | 上移動 | F | 下移動 | Q | 左回転 | E | 右回転 |
Y | 同一視点上移動 | H | 同一視点下移動 | G | 同一視点左移動 | J | 同一視点右移動 |
O | 対象物縦回転 | L | 対象物縦回転 | K | 対象物横回転 | ; | 対象物横回転 |
『同一視点』は、結果的に、表示エリアを移動させる『トリミング』のようなものです。通常の移動では、視点が移動するので、見えなかったものが見えるようになりますが、『同一視点』では、ずっとそのままです。
|
【Three.jsの最新記事】
- Three.js で『画像を群れで飛ばす』- 背景画像を設定したら結構素敵になりました
- 『初音ミクを群れで飛ばす』-- Three.js の Canvas サンプルで『鳥が群れで飛ぶ』という凄いのがあるんですが、平面の画像をテクスチャとして差し替えてブログに貼れるようしました。
- Google Chrome または Firefox で( WebGL ) フリーフォントを 3D 化して表示して画像を取得
- まだ、遊べるほどではありませんが、Cube World + 3D モデル 空間をカメラ目線で移動
- WebGL Miku / ioqueさん
- 天使キャラ( 3D ローポリゴン ) を Three.js で、ブラウザが表示可能なら、WebGL で表示。そうでないなら Canvas で表示しています。ぜひ、キーでぐりぐり動かして下さい。
- WebGL 限定 miku( カーソルがカメラになります )
- 最新の Three.js でできる事。JavaScript+WebGLの凄さを体験してみましょう
- メタセコイアの素材からまわりまわってこんな画像に例えばなる訳ですが( Google+の クリエイティブキット )
- Canvas を使って 3D データを描画する JavaScript ライブラリ『Three.js』のバグ対応( Firefox、IE9、Opera で正しくテクスチャが適用されない )
- Three.js と言います。JavaScript だけでこんな事ができる時代になりました( IE8 はダメです )