DOMPointReadOnly

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.

Note: This feature is available in Web Workers.

The DOMPointReadOnly interface specifies the coordinate and perspective fields used by DOMPoint to define a 2D or 3D point in a coordinate system.

There are two ways to create a new DOMPointReadOnly instance. First, you can use its constructor, passing in the values of the parameters for each dimension and, optionally, the perspective:

js
/* 2D */
const point2D = new DOMPointReadOnly(50, 50);

/* 3D */
const point3D = new DOMPointReadOnly(50, 50, 25);

/* 3D with perspective */
const point3DPerspective = new DOMPointReadOnly(100, 100, 100, 1.0);

The other option is to use the static DOMPointReadOnly.fromPoint() method:

js
const point = DOMPointReadOnly.fromPoint({ x: 100, y: 100, z: 50, w: 1.0 });

Constructor

DOMPointReadOnly()

Creates a new DOMPointReadOnly object given the values of its coordinates and perspective. To create a point using an object, you can instead use DOMPointReadOnly.fromPoint().

Instance properties

DOMPointReadOnly.x Read only

The point's horizontal coordinate, x.

DOMPointReadOnly.y Read only

The point's vertical coordinate, y.

DOMPointReadOnly.z Read only

The point's depth coordinate, z.

DOMPointReadOnly.w Read only

The point's perspective value, w.

Static methods

DOMPointReadOnly.fromPoint()

A static method that creates a new DOMPointReadOnly object given the coordinates provided in the specified object.

Instance methods

matrixTransform()

Applies a matrix transform specified as an object to the DOMPointReadOnly object.

toJSON()

Returns a JSON representation of the DOMPointReadOnly object.

Specifications

Specification
Geometry Interfaces Module Level 1
# DOMPoint

Browser compatibility

BCD tables only load in the browser

See also