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 inWeb Workers.

TheDOMPointReadOnly interface specifies the coordinate and perspective fields used byDOMPoint to define a 2D or 3D point in a coordinate system.

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

/* 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 staticDOMPointReadOnly.fromPoint() method:

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

Constructor

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

Instance properties

DOMPointReadOnly.xRead only: The point's horizontal coordinate,x.
DOMPointReadOnly.yRead only: The point's vertical coordinate,y.
DOMPointReadOnly.zRead only: The point's depth coordinate,z.
DOMPointReadOnly.wRead only: The point's perspective value,w.

Static methods

DOMPointReadOnly.fromPoint(): A static method that creates a newDOMPointReadOnly object given the coordinates provided in the specified object.

Instance methods

matrixTransform(): Applies a matrix transform specified as an object to theDOMPointReadOnly object.
toJSON(): Returns a JSON representation of theDOMPointReadOnly object.