{{APIRef("DOM")}}
A DOMPoint
represents a 2D or 3D point in a coordinate system.
In general, x is to the right, y is upwards, and z is out of the screen (or the opposite way to which the user is facing.)
It inherits from its parent, {{domxref("DOMPointReadOnly")}}.
Constructor
- {{domxref("DOMPoint.DOMPoint","DOMPoint()")}}
- Creates a new
DOMPoint
object.
Methods
DOMPoint
inherits methods from its parent, {{domxref("DOMPointReadOnly")}}.
- {{domxref("DOMPointReadOnly.fromPoint")}}
- Translates the position/perspective of a
DOMPoint
to a new position (doesn't appear to be supported anywhere yet.)
Properties
DOMPoint
inherits properties from its parent, {{domxref("DOMPointReadOnly")}}.
- {{domxref("DOMPointReadOnly.x")}} {{readonlyInline}}
- The x coordinate of the
DOMPoint
. - {{domxref("DOMPointReadOnly.y")}} {{readonlyInline}}
- The y coordinate of the
DOMPoint
. - {{domxref("DOMPointReadOnly.z")}} {{readonlyInline}}
- The z coordinate of the
DOMPoint
. - {{domxref("DOMPointReadOnly.w")}} {{readonlyInline}}
- The perspective value of the
DOMPoint
.
Examples
In the WebVR API, DOMPoint
values are used to represent points in the coordinate space that the user's head mounted display exists in. In the following snippet, the position of the VR HMD can be retrieved by first grabbing a reference to the position sensor's current state using {{domxref("PositionSensorVRDevice.getState")}}, then accessing the resulting {{domxref("VRPositionState")}}'s {{domxref("VRPositionState.position","position")}} property, which returns a DOMPoint
. Note below the usage of position.x
, position.y
, and position.z
.
function setView() { var posState = gPositionSensor.getState(); if(posState.hasPosition) { posPara.textContent = 'Position: x' + roundToTwo(posState.position.x) + " y" + roundToTwo(posState.position.y) + " z" + roundToTwo(posState.position.z); xPos = -posState.position.x * WIDTH * 2; yPos = posState.position.y * HEIGHT * 2; if(-posState.position.z > 0.01) { zPos = -posState.position.z; } else { zPos = 0.01; } } ... }
Note: See our positionsensorvrdevice demo for the full code.
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('Geometry Interfaces', '#DOMPoint', 'DOMPoint')}} | {{Spec2('Geometry Interfaces')}} | Latest spec version is an ED. |
Browser compatibility
{{ CompatibilityTable() }}
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | {{CompatNo}} |
{{CompatVersionUnknown}} |
{{ CompatNo }} |
{{ CompatNo }} |
{{ CompatNo }} |
Feature | Android | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|
Basic support | {{ CompatNo }} | {{CompatVersionUnknown}} | {{ CompatNo }} | {{ CompatNo }} | {{ CompatNo }} | {{ CompatNo }} | {{ CompatNo }} |
See also
- {{domxref("DOMRect")}}