gradientUnits

Das gradientUnits-Attribut definiert das Koordinatensystem, das für auf den Gradientenelementen spezifizierte Attribute verwendet wird.

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 gibt an, dass die Attribute Werte im Koordinatensystem darstellen, das resultiert, wenn das aktuelle Benutzerkoordinatensystem zur Zeit, zu der das Gradientelement referenziert wird (d.h. das Benutzerkoordinatensystem für das Element, das das Gradientelement über eine fill- oder stroke-Eigenschaft referenziert), und dann die durch das Attribut gradientTransform angegebene Transformation angewendet wird. Prozentsätze repräsentieren Werte relativ zum aktuellen SVG-Anzeigebereich.

objectBoundingBox

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

Prozentsätze repräsentieren Werte relativ zum Begrenzungsrahmen des Objekts.

Mit diesem Wert und gradientTransform als Identitätsmatrix ist die Normale des linearen Gradienten senkrecht zum Gradientvektor im Objektbegrenzungsrahmenraum (d.h. das abstrakte Koordinatensystem, in dem (0,0) sich oben/links im Objektbegrenzungsrahmen und (1,1) unten/rechts im Objektbegrenzungsrahmen befindet). Wenn der Begrenzungsrahmen des Objekts nicht quadratisch ist, kann die Normale, die ursprünglich im Objektbegrenzungsrahmenraum senkrecht zum Gradientvektor ist, relativ zum Gradientvektor im Benutzerraum nicht senkrecht erscheinen. Wenn der Gradientvektor parallel zu einer der Achsen des Begrenzungsrahmens ist, bleibt die Gradientennormale senkrecht. Diese Transformation entsteht durch die Anwendung der nicht-uniformen Skalentransformation vom Begrenzungsrahmenraum in den 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 resultiert, wenn das aktuelle Benutzerkoordinatensystem zur Zeit, zu der das Gradientelement referenziert wird (d.h. das Benutzerkoordinatensystem für das Element, das das Gradientelement über eine fill- oder stroke-Eigenschaft referenziert) und dann die durch das Attribut gradientTransform angegebene Transformation angewendet wird.

objectBoundingBox

für <radialGradient>: das Benutzerkoordinatensystem für die Attribute cx, cy, r, fx, fy und fr wird unter Verwendung des Begrenzungsrahmens des Elements, auf das der Gradient angewendet wird (siehe Einheiten des Objektbegrenzungsrahmens), festgelegt und dann die durch das Attribut gradientTransform angegebene Transformation angewendet. Mit diesem Wert und gradientTransform als Identitätsmatrix sind die Ringe des radialen Gradienten kreisförmig in Bezug auf den Objektbegrenzungsrahmenraum (d.h. das abstrakte Koordinatensystem, in dem (0,0) sich oben/links im Objektbegrenzungsrahmen und (1,1) unten/rechts im Objektbegrenzungsrahmen befindet). Wenn der Begrenzungsrahmen des Objekts nicht quadratisch ist, werden die konzeptionell kreisförmigen Ringe im Objektbegrenzungsrahmenraum aufgrund der Anwendung der nicht-uniformen Skalentransformation vom Begrenzungsrahmenraum in den Benutzerraum als elliptisch dargestellt.

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