DOMQuad: fromRect() static method

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020.

Note: This feature is available in Web Workers.

Phương thức tĩnh fromRect() của giao diện DOMQuad trả về một đối tượng DOMQuad mới dựa trên tập tọa độ được cung cấp có dạng của một đối tượng DOMRect.

Cú pháp

DOMQuad.fromRect()
DOMQuad.fromRect(rect)

Tham số

rect Optional

Một DOMRect, DOMRectReadOnly, hoặc một đối tượng có cùng thuộc tính. Tất cả các thuộc tính mặc định là 0. Các thuộc tính bao gồm:

x Optional: Tọa độ x của góc gốc của hình chữ nhật (góc trên bên trái).
y Optional: Tọa độ y của góc gốc của hình chữ nhật (góc trên bên trái).
width Optional: Chiều rộng của hình chữ nhật.
height Optional: Chiều cao của hình chữ nhật.

const quad = DOMQuad.fromRect({ x: 10, y: 20, width: 100, height: 50 });

console.log(quad.p1); // DOMPoint {x: 10, y: 20, z: 0, w: 1}
console.log(quad.p2); // DOMPoint {x: 110, y: 20, z: 0, w: 1}
console.log(quad.p3); // DOMPoint {x: 110, y: 70, z: 0, w: 1}
console.log(quad.p4); // DOMPoint {x: 10, y: 70, z: 0, w: 1}

Tạo quad từ DOMRect

Ví dụ này cho thấy cách tạo một DOMQuad từ một đối tượng DOMRect.

const domRect = new DOMRect(50, 60, 200, 100);
const quad = DOMQuad.fromRect(domRect);

console.log(quad.p1); // DOMPoint {x: 50, y: 60, z: 0, w: 1}
console.log(quad.p2); // DOMPoint {x: 250, y: 60, z: 0, w: 1}
console.log(quad.p3); // DOMPoint {x: 250, y: 160, z: 0, w: 1}
console.log(quad.p4); // DOMPoint {x: 50, y: 160, z: 0, w: 1}