gradientUnits

Das gradientUnits-Attribut definiert das Koordinatensystem, das für Attribute verwendet wird, die an den Gradienten-Elementen angegeben sind.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

linearGradient

Für <linearGradient> definiert gradientUnits das Koordinatensystem, das für die Attribute x1, y1, x2 und y2 verwendet wird.

Wert userSpaceOnUse | objectBoundingBox
Standardwert objectBoundingBox
Animierbar Ja
userSpaceOnUse

Dieser Wert zeigt an, dass die Attribute Werte im Koordinatensystem repräsentieren, das sich ergibt, wenn das aktuelle Benutzerkoordinatensystem zum Zeitpunkt des Referenzierens des Gradienten-Elements verwendet wird (d.h. das Benutzerkoordinatensystem für das Element, das das Gradienten-Element über eine fill- oder stroke-Eigenschaft referenziert) und dann die durch das Attribut gradientTransform angegebene Transformation anwenden. Prozentsätze repräsentieren Werte relativ zum aktuellen SVG-Viewport.

objectBoundingBox

Dieser Wert zeigt an, dass das Benutzerkoordinatensystem für die Attribute unter Verwendung der Umrandung des Elements festgelegt wird, auf das der Verlauf angewendet wird, und dann die durch das Attribut gradientTransform angegebene Transformation anwenden.

Prozentsätze repräsentieren Werte relativ zur Umrandung des Objekts.

Mit diesem Wert und gradientTransform als Identitätsmatrix ist die Normale des linearen Verlaufs senkrecht zum Gradientenvektor im Raum der Objektumrandung (d.h. das abstrakte Koordinatensystem, wobei (0,0) oben/links an der Objektumrandung und (1,1) unten/rechts an der Objektumrandung ist). Wenn die Objektumrandung nicht quadratisch ist, kann die Normale des Verlaufs, die ursprünglich senkrecht zum Gradientenvektor im Raum der Objektumrandung ist, relativ zum Gradientenvektor im Benutzerraum nicht senkrecht erscheinen. Wenn der Gradientenvektor parallel zu einer der Achsen der Umrandung ist, bleibt die Verlaufnormale senkrecht. Diese Transformation resultiert aus der Anwendung der nicht einheitlichen Skalierungstransformation vom Raum der Objektumrandung zum Benutzerraum.

radialGradient

Für <radialGradient> definiert gradientUnits das Koordinatensystem, das für die Attribute cx, cy, r, fx, fy und fr verwendet wird.

Wert userSpaceOnUse | objectBoundingBox
Standardwert objectBoundingBox
Animierbar Ja
userSpaceOnUse

cx, cy, r, fx, fy und fr repräsentieren Werte im Koordinatensystem, das sich ergibt, wenn das aktuelle Benutzerkoordinatensystem zum Zeitpunkt der Referenzierung des Gradienten-Elements verwendet wird (d.h. das Benutzerkoordinatensystem für das Element, das das Gradienten-Element über eine fill- oder stroke-Eigenschaft referenziert) und dann die durch das Attribut gradientTransform angegebene Transformation anwenden.

objectBoundingBox

für <radialGradient>: das Benutzerkoordinatensystem für die Attribute cx, cy, r, fx, fy und fr wird unter Verwendung der Umrandung des Elements, auf das der Verlauf angewendet wird, festgelegt (siehe Objektumrandungseinheiten) und dann die durch das Attribut gradientTransform angegebene Transformation anwenden. Mit diesem Wert und gradientTransform als Identitätsmatrix sind die Ringe des radialen Verlaufs im Raum der Objektumrandung kreisförmig (d.h. das abstrakte Koordinatensystem, wobei (0,0) oben/links an der Objektumrandung und (1,1) unten/rechts an der Objektumrandung ist). Wenn die Objektumrandung nicht quadratisch ist, erscheinen die im Raum der Objektumrandung konzeptionell kreisförmigen Ringe aufgrund der Anwendung der nicht einheitlichen Skalierungstransformation vom Raum der Objektumrandung zum Benutzerraum als elliptisch.

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# LinearGradientElementGradientUnitsAttribute
Scalable Vector Graphics (SVG) 2
# RadialGradientElementGradientUnitsAttribute

Browser-Kompatibilität

svg.elements.linearGradient.gradientUnits

svg.elements.radialGradient.gradientUnits