Forked from: siouxcitizen2's Babylon.js v3.3.0 で衝突判定つき3Dオブジェクトを操作してみるテスト View Diff (260)

Fork
1
Fav
0
View
271
  • Play

Fullscreen

Smart Phone

Fork tree

  • Readme
  • JavaScript 461 lines
  • HTML 7 lines
  • CSS 13 lines
// forked from siouxcitizen2's "Babylon.js v3.3.0 で衝突判定つき3Dオブジェクトを操作してみるテスト" http://jsdo.it/siouxcitizen2/mM6o
// forked from siouxcitizen2's "Babylon.js v3.3.0 でGUIボタンでBox操作してみるテスト" http://jsdo.it/siouxcitizen2/qSTT
// forked from siouxcitizen2's "Babylon.js v3.3.0 でGUIのボタン・ラベルの機能いろいろテスト" http://jsdo.it/siouxcitizen2/Q9ug
// forked from siouxcitizen2's "Babylon.js v3.3.0 でSound on Mesh再生機能テスト" http://jsdo.it/siouxcitizen2/qI2M
// forked from siouxcitizen2's "Babylon.js v3.3.0 でSound再生機能テスト" http://jsdo.it/siouxcitizen2/Cpqv
// forked from siouxcitizen2's "Babylon.js v3.3.0 で3D GUI(MeshButton3D)機能テスト" http://jsdo.it/siouxcitizen2/S5i8
// forked from siouxcitizen2's "Babylon.js v3.3.0 でGUI機能テスト" http://jsdo.it/siouxcitizen2/08qP
// forked from siouxcitizen2's "Babylon.js v3.3.0 で3D GUI機能テスト" http://jsdo.it/siouxcitizen2/aTB7

Babylon.js Version 3.3.0 のライブラリを使用してみました

Babylon.jsのサンプルがある「Babylon.js Playground」からのコードを参考にして
カメラがターゲット対象として3Dオブジェクト(box)の周りを移動できるようにしてみました
以下のような操作ができます

「LeftRot」でカメラがboxのまわりを左周り(な感じで)回転
「RightRot」でカメラがboxのまわりを右周り(な感じで)回転
「Height」でカメラの高さを変更
「Distance」でカメラのboxからの距離を変更
「Default」でカメラの位置を最初の場所にもどす




前に作成した以下の自分のコードを参考にしました

Three.js r70 で自前でカメラ操作機能作成(WebGL使用)
http://jsdo.it/siouxcitizen/8bYv

Three.js r70(WebGL使用)とCreateJSでインターフェース実験
http://jsdo.it/siouxcitizen/4Knh

Three.js r70(WebGL使用)とCreateJSでインターフェース実験2
http://jsdo.it/siouxcitizen/sIW9



以下のサイト・コードも参考にさせていただきました

Position and Rotation
https://doc.babylonjs.com/babylon101/position

https://ics.media/tutorial-three/camera_position.html
Three.jsのカメラの制御

WebGL版Away3D入門―第4回 カメラの制御方法
http://ics-web.jp/lab/archives/2632
  • Babylon.js v3.3.0 でカメラの位置操作を対象オブジェクト周りでできるようにしてみるテスト
  • Babylon.js v3.3.0 でカメラの位置操作を対象オブジェクト周りでできるようにしてみるテスト

play

Complete!

Description どんなゲームですか?

Control Device

jsdo.it websocket controller

Mouse

keyboard

smartphone

Fullscreen

siouxcitizen2

Author

Yahoo Open ID が機能しなくなったのでjsdo.itの第二アカウント作成しました

jsdo.itの第一アカウント http://jsdo.it/siouxcitizen

第一アカウントも含めて混沌としてきたので、投稿コードを以下のようにまとめてみました Naver : http://matome.naver.jp/odai/2142288467101177901

作業用BGMにYoutube動画を連続再生するプログラムもまとめてみました 直リンク : http://matome.naver.jp/odai/2143666226200730001 アーティスト別の再生動画の一覧付きリスト : http://matome.naver.jp/odai/2142630899820574901

ブログ : http://oreorekaihatsu.blogspot.jp/

Default Panel

Size

  • Width: px
  • Height: px

code

QR Code

実行画面をスマートフォンで確認できます。

Discussion

このコードについて質問してみる!

Tags

Forked