DOMPoint

由於本文件沒有此語言的翻譯版本,您閱讀的是英文版的內容。 幫助我們翻譯這篇文章!

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 is based on 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).

Constructor

DOMPoint()
Creates and returns a new 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 or a DOMPointInit dictionary to create a new point by calling the DOMPoint.fromPoint() static method.

Methods

DOMPoint inherits methods from its parent, DOMPointReadOnly.

Static methods

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

Properties

DOMPoint inherits properties from its parent, DOMPointReadOnly.

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

Examples

In the 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: position 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));
  }
}

Specifications

Specification Status Comment
Geometry Interfaces Module Level 1
The definition of 'DOMPoint' in that specification.
Candidate Recommendation

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
DOMPoint
Experimental
Chrome Full support 61Edge No support NoFirefox Full support 31IE No support NoOpera Full support 48Safari Full support 10.1WebView Android Full support 61Chrome Android Full support 61Firefox Android Full support 31Opera Android Full support 45Safari iOS Full support 10.3Samsung Internet Android ?
DOMPoint() constructor
Experimental
Chrome Full support 61Edge No support NoFirefox Full support 31IE No support NoOpera Full support 48Safari Full support 10.1WebView Android Full support 61Chrome Android Full support 61Firefox Android Full support 31Opera Android Full support 45Safari iOS Full support 10.3Samsung Internet Android ?
Available in workersChrome Full support 61Edge No support NoFirefox Full support 69IE No support NoOpera Full support 48Safari Full support 10.1WebView Android Full support 61Chrome Android Full support 61Firefox Android No support NoOpera Android Full support 45Safari iOS Full support 10.3Samsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.

See also