BabylonJS-カメラ

BabylonJSには、使用できるカメラがたくさんあります。一度に、1つのシーンでアクティブになるカメラは1つだけです。

この章では、BabylonJSでカメラを使用する方法を学びます。

FreeCamera

FreeCameraの仕組みを見てみましょう。

構文

以下はFreeCameraの構文です-

var camera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 1, -15), scene);

これは、カメラが配置される位置です-新しいBABYLON.Vector3（0、1、-15）。

方向を変えると方向も変わります。値を変更して、シーンでのカメラの動作を確認できます。

以下はFreeCameraで使用されるパラメータです-

Name
ポジション
シーン

ArcRotateCamera

このカメラは、指定されたターゲットピボットを中心に回転します。カーソルとマウス、またはタッチイベントで制御できます。パラメータは、名前、アルファ、ベータ、半径、およびターゲットです。

構文

var camera = new BABYLON.ArcRotateCamera("ArcRotateCamera", 1, 0.8, 10, new BABYLON.Vector3(0, 0, 0), scene);

*ArcRotateCamera* は+ x方向を指します。 カメラの位置を変更するには、 *setPosition* プロパティを使用します。

camera.setPosition(new BABYLON.Vector3(0, 0, -100));

ArcRotateCameraは、アニメーション化に最適なカメラです。次のコマンドは、ターゲットの周りにカメラを回転させるのに役立ちます-

scene.activeCamera.alpha += .01;

TouchCamera

タッチは「ジェスチャー」の一種です。指、スタイラス、手袋、足、またはレーザーポインターを使用して、パッドまたはスクリーン上に置くことができます。感知できるあらゆる動き… ジェスチャーと見なすことができます。

構文

以下はTouchCameraの構文です-

var camera = new BABYLON.TouchCamera("TouchCamera", new BABYLON.Vector3(0, 1, -15), scene);

ゲームパッドカメラ

このカメラは、ゲームパッドで使用するために特別に設計されています。

構文

ゲームパッドカメラの構文は次のとおりです-

var camera = new BABYLON.GamepadCamera("Camera", new BABYLON.Vector3(0, 15, -45), scene);

DeviceOrientationCamera

このカメラは、デバイスを前後または左右に傾けたときなど、デバイスの方向イベントに反応するように特別に設計されています。

構文

var camera = new BABYLON.DeviceOrientationCamera("DevOr_camera", new BABYLON.Vector3(0, 1, -15), scene);

フォローカメラ

FollowCameraは、位置を持つ任意のシーンアイテムを追跡するように設計されています。後方、前方、または任意の角度から追従できます。

構文

FollowCameraの構文は次のとおりです-

var camera = new BABYLON.FollowCamera("FollowCam", new BABYLON.Vector3(0, 15, -45), scene);

VirtualJoysticksCamera

このカメラは、仮想ジョイスティックイベントに反応するように設計されています。仮想ジョイスティックは、カメラやその他のシーンアイテムの制御に使用される画面上の2Dグラフィックです。

構文

以下はVirtualJoysticksCameraの構文です-

var camera = new BABYLON.VirtualJoysticksCamera("VJ_camera", new BABYLON.Vector3(0, 1, -15), scene);

アナグリフカメラ

AnaglyphCameraは、赤とシアンの3Dメガネで使用します。後処理フィルタリング技術を使用します。

AnaglyphArcRotateCamera

以下は、AnaglyphArcRotateCameraの構文です-

var camera = new BABYLON.AnaglyphArcRotateCamera("aar_cam", -Math.PI/2, Math.PI/4, 20, new BABYLON.Vector3.Zero(), 0.033, scene);

AnaglyphFreeCamera

以下は、 AnaglyphFreeCamera の構文です-

var camera = new BABYLON.AnaglyphFreeCamera("af_cam", new BABYLON.Vector3(0, 1, -15), 0.033, scene);

VRDeviceOrientationFreeCamera

VRDeviceOrientationFreeCameraはFreeCameraを基礎として使用しているため、FreeCameraのプロパティとメソッドはVRDeviceOrientationFreeCameraにもあります。

構文

以下は VRDeviceOrientationFreeCamera の構文です-

var camera = new BABYLON.VRDeviceOrientationFreeCamera ("Camera", new BABYLON.Vector3 (-6.7, 1.2, -1.3), scene, 0);

WebVRFreeCamera

WebVRFreeCameraはFreeCameraを基礎として使用しているため、FreeCameraのプロパティとメソッドはWebVRFreeCameraにもあります。

構文

以下は WebVRFreeCamera の構文です-

var camera = new BABYLON.WebVRFreeCamera("WVR", new BABYLON.Vector3(0, 1, -15), scene);

ほとんどのデモでは、カメラがキャンバスに接続されている attachControl が表示されます。

例

camera.attachControl(canvas, true);

Babylonjs-cameras

目次