DOMPoint | Web API

在此页

构造函数
方法
静态方法
特性
范例
规范
浏览器兼容性
另请参阅
相关话题

A DOMPoint object represents a 2D or 3D point in a coordinate system; it includes values for the coordinates in up to three dimensions, as well as an optional perspective value. DOMPoint 基于 DOMPointReadOnly but allows its properties' values to be changed.

In general, a positive x component represents a position to the right of the origin, a positive y component is downward from the origin, and a positive z component extends outward from the screen (in other words, toward the user).

构造函数

DOMPoint(): 创建并返回新 DOMPoint object given the values of zero or more of its coordinate components and optionally the w perspective value. You can also use an existing DOMPoint or DOMPointReadOnly 或 DOMPointInit dictionary to create a new point by calling the DOMPoint.fromPoint() 静态方法。

方法

DOMPoint 继承来自其父级的方法， DOMPointReadOnly .

静态方法: DOMPoint.fromPoint(); Creates a new mutable DOMPoint object given an existing point (or a DOMPointInit dictionary) which provides the values for its properties.

特性

DOMPoint 继承的特性来自其父级， DOMPointReadOnly .

DOMPoint.x: x coordinate of the DOMPoint .
DOMPoint.y: y coordinate of the DOMPoint .
DOMPoint.z: z coordinate of the DOMPoint .
DOMPoint.w: The perspective value of the DOMPoint .

范例

在 WebXR Device API , DOMPointReadOnly values are used to represent positions and orientations. In the following snippet, the pose of the XR device (such as a VR headset or phone with AR capabilities) can be retrieved by calling using XRFrame.getViewerPose() during an XRSession animation frame, then accessing the resulting XRPose 's transform property, which contains two DOMPointReadOnly attributes: 位置 as a vector and orientation as a quaternion.

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));
  }
}

规范

规范	状态	注释
Geometry Interfaces Module Level 1 The definition of 'DOMPoint' in that specification.	候选推荐

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`DOMPoint`	Chrome 61	Edge 79	Firefox 31	IE No	Opera 48	Safari 10.1	WebView Android 61	Chrome Android 61	Firefox Android 31	Opera Android 45	Safari iOS 10.3	Samsung Internet Android 8.0
`DOMPoint()` 构造函数	Chrome 61	Edge 79	Firefox 31	IE No	Opera 48	Safari 10.1	WebView Android 61	Chrome Android 61	Firefox Android 31	Opera Android 45	Safari iOS 10.3	Samsung Internet Android 8.0
Available in workers	Chrome 61	Edge 79	Firefox 69	IE No	Opera 48	Safari 10.1	WebView Android 61	Chrome Android 61	Firefox Android No	Opera Android 45	Safari iOS 10.3	Samsung Internet Android 8.0

在此页

构造函数

方法

静态方法

特性

范例

规范

浏览器兼容性

图例

另请参阅

元数据

相关话题