DOMQuad: fromRect() statische Methode
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2020.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die statische Methode fromRect() der DOMQuad-Schnittstelle gibt ein neues DOMQuad-Objekt basierend auf den bereitgestellten Koordinatensätzen in Form eines DOMRect-Objekts zurück.
Syntax
DOMQuad.fromRect()
DOMQuad.fromRect(rect)
Parameter
rectOptional-
Ein
DOMRect,DOMRectReadOnlyoder ein Objekt mit denselben Eigenschaften. Alle Eigenschaften haben standardmäßig den Wert0. Die Eigenschaften sind:
Rückgabewert
Ein DOMQuad-Objekt.
Beispiele
Erstellen eines rechteckigen Quads
Dieses Beispiel erstellt ein DOMQuad von Grund auf neu, das zufällig rechteckig ist. Die Verwendung von fromRect() ist bequemer als die Verwendung des DOMQuad()-Konstruktors.
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}
Erstellen eines Quads von DOMRect
Dieses Beispiel zeigt, wie man ein DOMQuad aus einem DOMRect-Objekt erstellt.
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}
Spezifikationen
| Specification |
|---|
| Geometry Interfaces Module Level 1 # dom-domquad-fromrect |
Browser-Kompatibilität
Loading…