DOMPoint
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Please take two minutes to fill out our short survey.
DOMPoint
オブジェクトは、座標系における二次元または三次元の点を表します。最大三次元までの座標の値、およびオプションで視点の値も含まれます。 DOMPoint
は DOMPointReadOnly
に基づいていますが、そのプロパティの値を変更することができます。
一般的には、正の x
成分は原点よりも右側の位置を表し、正の y
成分は原点よりも下側の位置を表し、正の z
成分は画面の外側(言い換えれば、ユーザーの方向)に向かって広がっています。
コンストラクター
DOMPoint()
-
0 個以上の座標成分の値、およびオプションとして
w
の視点位置を与えられた新しいDOMPoint
オブジェクトを作成し、それを返します。また、既存のDOMPoint
やDOMPointReadOnly
、あるいはオブジェクトを使用して、DOMPoint.fromPoint()
静的メソッドを呼び出し、新しい点を作成することができます。
インスタンスプロパティ
DOMPoint
には親である DOMPointReadOnly
から継承したプロパティがあります。
DOMPoint.x
-
この
DOMPoint
の水平座標であるx
です。 DOMPoint.y
-
この
DOMPoint
の垂直座標であるy
です。 DOMPoint.z
-
この
DOMPoint
の奥行き座標であるz
です。 DOMPoint.w
-
この
DOMPoint
の視点位置であるw
です。
インスタンスメソッド
DOMPoint
には親である DOMPointReadOnly
から継承したインスタンスメソッドがあります。
静的メソッド
DOMPoint
には親である DOMPointReadOnly
から継承した静的メソッドがあります。
DOMPoint.fromPoint()
-
既存の点(または、一致するプロパティを含むオブジェクト)を指定して、そのプロパティの値を提供する、新しい変更可能な
DOMPoint
オブジェクトを作成します。
例
WebXR 機器 API では、位置や向きを表すために DOMPointReadOnly
値が使用されます。以下のスニペットでは、 XR 機器(VR ヘッドセットや AR 機能付き携帯電話など)のポーズは XRSession
アニメーションフレームの中で XRFrame.getViewerPose()
を呼び出すことで取得することができ、それから結果の XRPose
の transform
プロパティにアクセスしています。これには 2 つの DOMPointReadOnly
属性があります。ベクトルを表す position
と、クォータニオンを表す orientation
です。
function onXRFrame(time, xrFrame) {
let viewerPose = xrFrame.getViewerPose(xrReferenceSpace);
if (viewerPose) {
let position = viewerPose.transform.position;
let orientation = viewerPose.transform.orientation;
console.log(
`XR Viewer Position: {x: ${roundToTwo(position.x)}, y: ${roundToTwo(
position.y,
)}, z: ${roundToTwo(position.z)}`,
);
console.log(
`XR Viewer Orientation: {x: ${roundToTwo(orientation.x)}, y: ${roundToTwo(
orientation.y,
)}, z: ${roundToTwo(orientation.z)}, w: ${roundToTwo(orientation.w)}`,
);
}
}
仕様書
Specification |
---|
Geometry Interfaces Module Level 1 # DOMPoint |