Geometry interfaces

Geometrie-Interfaces ist ein CSS-Modul, das Schnittstellen für die Arbeit mit 3D- und 2D-Grafiken bietet – insbesondere für die Arbeit mit Punkten, Rechtecken, Vierecken und Transformationsmatrizen (für Operationen, die Grafiken verschieben/bewegen, skalieren, drehen, verzerren/scheren/neigen und umkehren, sowie zum Multiplizieren/Verketten und zum Invertieren/Rückgängigmachen dieser Operationen).

Als Webentwickler verwenden Sie die Geometrie-Interfaces nicht immer direkt, sondern nutzen andere Funktionen, die im Hintergrund auf ihnen basieren: Teile von CSS Transforms, die Canvas API, die WebXR Device API und (direkter) VideoFrame.visibleRect, Element.getClientRects() und Element.getBoundingClientRect().

Schnittstellen

DOMMatrix

Repräsentiert eine Transformationsmatrix für Operationen, die Grafiken verschieben/bewegen, skalieren, drehen, verzerren/scheren/neigen und umkehren, sowie zum Multiplizieren/Verketten und zum Invertieren/Rückgängigmachen dieser Operationen.

DOMMatrixReadOnly

Schreibgeschützte Version von DOMMatrix.

DOMPoint

Repräsentiert einen 2D- oder 3D-Punkt in einem Koordinatensystem; es enthält Werte für die Koordinaten in bis zu drei Dimensionen sowie einen optionalen Perspektivenwert.

DOMPointReadOnly

Schreibgeschützte Version von DOMPoint.

DOMQuad

Repräsentiert eine Sammlung von vier DOMPoint-Objekten, die die Ecken eines Vierecks definieren.

DOMRect

Repräsentiert die Größe und Position eines Rechtecks.

DOMRectReadOnly

Schreibgeschützte Version von DOMRect.

Beispiele

Die Artikel Path2D.addPath() und CanvasPattern.setTransform() enthalten Beispiele, die einige der Geometrie-Interfaces verwenden.

Spezifikationen

Specification
Geometry Interfaces Module Level 1
# DOMMatrix
Geometry Interfaces Module Level 1
# DOMPoint
Geometry Interfaces Module Level 1
# DOMQuad
Geometry Interfaces Module Level 1
# DOMRect

Browser-Kompatibilität

api.DOMMatrix

api.DOMMatrixReadOnly

api.DOMPoint

api.DOMPointReadOnly

api.DOMQuad

api.DOMRect

api.DOMRectReadOnly

Siehe auch