Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.
SVGPatternElement: patternTransform-Eigenschaft
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Die patternTransform-Eigenschaft nur-lesbar des SVGPatternElement-Interfaces spiegelt das patternTransform-Attribut des gegebenen <pattern>-Elements wider. Diese Eigenschaft hält die auf das Muster selbst angewendete Transformation und ermöglicht Operationen wie translate, rotate, scale und skew.
Wert
Ein SVGAnimatedTransformList-Objekt.
Beispiel
In diesem Beispiel wird das Muster um 20 Grad gedreht, auf der X-Achse um 30 Grad geneigt und um einen Faktor von 1 horizontal und 0,5 vertikal skaliert:
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<!-- Apply a transform on the tile -->
<pattern
id="p1"
width=".25"
height=".25"
patternTransform="rotate(20)
skewX(30)
scale(1 0.5)">
<circle cx="10" cy="10" r="10" />
</pattern>
<!-- Apply the transformed pattern tile -->
<rect x="10" y="10" width="80" height="80" fill="url(#p1)" />
</svg>
Spezifikationen
| Spezifikation |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGPatternElement__patternTransform |
Browser-Kompatibilität
JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.