Content type
SVG verwendet eine Reihe von Datentypen. Dieser Artikel listet diese Typen zusammen mit ihrer Syntax und Beschreibungen ihrer Verwendungszwecke auf.
Angle
- <angle>
-
Winkel werden auf eine von zwei Arten angegeben. Wenn sie im Wert einer Eigenschaft in einem Stylesheet verwendet werden, wird ein <angle> wie folgt definiert:
angle ::= number (~"deg" | ~"grad" | ~"rad")?
wobei
deg
Grad,grad
Neugrad undrad
Radiant bedeutet.Für in CSS2 definierte Eigenschaften muss eine Winkel-Einheit angegeben werden. Für Winkelwerte in SVG-spezifischen Eigenschaften und deren entsprechenden Präsentationsattributen ist die Winkel-Einheit optional. Wenn nicht angegeben, wird der Winkelwert in Grad angenommen. Bei Präsentationsattributen für alle Eigenschaften, ob in SVG1.1 oder CSS2 definiert, muss die Winkelangabe, falls angegeben, in Kleinbuchstaben sein.
Wenn Winkel in einem SVG-Attribut verwendet werden, wird <angle> stattdessen wie folgt definiert:
angle ::= number ("deg" | "grad" | "rad")?
Die Einheitensymbole in solchen <angle>-Werten müssen in Kleinbuchstaben sein.
Im SVG-DOM werden <angle>-Werte durch
SVGAngle
oderSVGAnimatedAngle
Objekte dargestellt.
Anything
- <anything>
-
Der Basistyp <anything> ist eine Folge von null oder mehr Zeichen. Genauer:
anything ::= Char*
wobei Char die Definition für ein Zeichen ist, wie in XML 1.0, Abschnitt 2.2, definiert.
Clock-value
- <clock-value>
-
Uhrzeitwerte haben die gleiche Syntax wie in der SMIL Animation Spezifikation. Die Grammatik für Uhrzeitwerte wird hier wiederholt:
Clock-val ::= Full-clock-val | Partial-clock-val | Timecount-val Full-clock-val ::= Hours ":" Minutes ":" Seconds ("." Fraction)? Partial-clock-val ::= Minutes ":" Seconds ("." Fraction)? Timecount-val ::= Timecount ("." Fraction)? (Metric)? Metric ::= "h" | "min" | "s" | "ms" Hours ::= DIGIT+; any positive number Minutes ::= 2DIGIT; range from 00 to 59 Seconds ::= 2DIGIT; range from 00 to 59 Fraction ::= DIGIT+ Timecount ::= DIGIT+ 2DIGIT ::= DIGIT DIGIT DIGIT ::= [0-9]
Für
Timecount
-Werte ist das Standardsuffixs
(für Sekunden). Eingebettete Leerzeichen sind in Uhrzeitwerten nicht erlaubt, obwohl führende und nachgestellte Leerzeichen ignoriert werden.Die folgenden sind Beispiele für gültige Uhrzeitwerte:
- Volle Uhrzeitwerte:
02:30:03
= 2 Stunden, 30 Minuten und 3 Sekunden50:00:10.25
= 50 Stunden, 10 Sekunden und 250 Millisekunden
- Teil-Uhrzeitwert:
02:33
= 2 Minuten und 33 Sekunden00:10.5
= 10.5 Sekunden = 10 Sekunden und 500 Millisekunden
- Zeitwerte in Intervallen:
3.2h
= 3.2 Stunden = 3 Stunden und 12 Minuten45min
= 45 Minuten30s
= 30 Sekunden5ms
= 5 Millisekunden12.467
= 12 Sekunden und 467 Millisekunden
- Bruchteile von Werten sind einfach (Basis 10) Gleitkomma-Definitionen von Sekunden. So ergibt sich:
00.5s
= 500 Millisekunden00:00.005
= 5 Millisekunden
- Volle Uhrzeitwerte:
Color
- <color>
-
Der Basistyp <color> ist eine CSS2-kompatible Spezifikation für eine Farbe im sRGB-Farbraum. <color> gilt für SVGs Verwendung des
color
-Attributs und ist ein Bestandteil der Definitionen der Attributefill
,stroke
,stop-color
,flood-color
, undlighting-color
, die auch optionale ICC-basierte Farbspezifikationen bieten.SVG unterstützt alle Syntax-Alternativen für <color>, die in CSS2 Syntax und Basis-Datentypen definiert sind, und (abhängig von der Implementierung) zukünftig im CSS Color Module Level 3.
Ein <color> ist entweder ein Schlüsselwort oder eine numerische RGB-Spezifikation.
Zusätzlich zu diesen Farbschlüsselwörtern dürfen Benutzer Schlüsselwörter angeben, die den Farben von Objekten in der Umgebung des Benutzers entsprechen. Die normative Definition dieser Schlüsselwörter findet sich in Benutzervorgaben für Farben (CSS2, Abschnitt 18.2).
Das Format eines RGB-Werts in hexadezimaler Notation ist ein
#
, gefolgt von entweder drei oder sechs hexadezimalen Zeichen. Die dreistellige RGB-Notation (#rgb
) wird in die sechsstellige Form (#rrggbb
) umgewandelt, indem Zeichen wiederholt werden, nicht durch Hinzufügen von Nullen. Zum Beispiel expandiert#fb0
zu#ffbb00
. Dies stellt sicher, dass Weiß (#ffffff
) mit der kurzen Notation (#fff
) festgelegt werden kann und beseitigt Abhängigkeiten von der Farbtiefe des Displays. Das Format eines RGB-Werts in funktionaler Notation ist eine RGB-Startfunktion, gefolgt von einer kommaseparierten Liste von drei numerischen Werten (entweder drei ganze Zahlen oder drei Prozentwerte), gefolgt von)
. Eine RGB-Startfunktion ist die nicht auf Groß- und Kleinschreibung achtende Zeichenkettergb(
, zum BeispielRGB(
oderrGb(
. Aus Kompatibilitätsgründen wird die vollständig kleingeschriebene Formrgb(
bevorzugt. Der Ganzzahlwert255
entspricht100%
undF
oderFF
in der hexadezimalen Notation:rgb(255 255 255)
=rgb(100% 100% 100%)
=#FFF
. Leerzeichen sind um die numerischen Werte herum erlaubt. Alle RGB-Farben werden im sRGB-Farbraum angegeben. Die Verwendung von sRGB bietet eine eindeutige und objektiv messbare Definition der Farbe, die sich auf internationale Standards beziehen lässt.color ::= "#" hexdigit hexdigit hexdigit (hexdigit hexdigit hexdigit)? | "rgb("integer integer integer")" | "rgb("integer "%" integer "%" integer "%)" | color-keyword hexdigit ::= [0-9A-Fa-f]
wobei
color-keyword
(nicht auf Groß- und Kleinschreibung achtend) einem der Farbschlüsselwörter entspricht, die im CSS Color Module Level 3 aufgeführt sind, oder einem der Systemfarbschlüsselwörter, die unter Benutzervorgaben für Farben (CSS2, Abschnitt 18.2) aufgeführt sind.
Coordinate
- <coordinate>
-
Ein <coordinate> ist eine Länge im Benutzerkoordinatensystem, die den angegebenen Abstand vom Ursprung des Benutzerkoordinatensystems entlang der relevanten Achse (der x-Achse für X-Koordinaten, der y-Achse für Y-Koordinaten) darstellt. Seine Syntax ist die gleiche wie die für <length>.
Im SVG-DOM wird ein <coordinate> durch ein
SVGLength
oder einSVGAnimatedLength
dargestellt.
Frequency
- <frequency>
-
Frequenzwerte werden mit lauter Eigenschaften verwendet. Wie in CSS2 definiert, ist ein Frequenzwert ein <number>, der sofort von einem Frequenzeinheitensymbol gefolgt wird. Die Frequenzeinheitensymbole sind:
Hz
: HertzkHz
: kilo Hertz
Frequenzwerte dürfen nicht negativ sein.
FuncIRI
Integer
- <integer>
-
Ein <integer> wird als ein optionales Vorzeichen (
+
oder-
) gefolgt von einer oder mehreren Ziffern von0
bis9
angegeben:integer ::= [+-]? [0-9]+
Wenn das Vorzeichen fehlt, ist die Zahl nicht negativ.
Sofern nicht anders für ein bestimmtes Attribut oder eine Eigenschaft angegeben, reicht der Bereich für ein <integer> mindestens von
-2147483648
bis2147483647
.Im SVG-DOM wird ein <integer> als
number
oder alsSVGAnimatedInteger
dargestellt.
IRI
- <IRI>
-
Ein Internationalisierter Ressourcen-Identifikator.
Im Internet werden Ressourcen mit IRIs (Internationalisierte Ressourcenidentifikatoren) identifiziert. Beispielsweise könnte eine SVG-Datei namens
someDrawing.svg
, die sich unterhttp://example.com
befindet, den folgenden IRI haben:http://example.com/someDrawing.svg
Ein IRI kann auch ein bestimmtes Element innerhalb eines XML-Dokuments adressieren, indem er einen IRI-Fragmentbezeichner als Bestandteil des IRI enthält. Ein IRI, der einen IRI-Fragmentbezeichner enthält, besteht aus einem optionalen Basis-IRI, gefolgt von einem
#
-Zeichen und dem IRI-Fragmentbezeichner. Zum Beispiel kann der folgende IRI verwendet werden, um das Element zu spezifizieren, dessen IDLamppost
innerhalb der DateisomeDrawing.svg
ist:http://example.com/someDrawing.svg#Lamppost
IRIs werden im
href
-Attribut verwendet. Einige Attribute erlauben sowohl IRIs als auch Textzeichenfolgen als Inhalt. Um eine Textzeichenfolge von einem relativen IRI zu unterscheiden, wird die funktionale Notation <FuncIRI> verwendet. Dies ist ein IRI, der mit einer funktionalen Notation abgegrenzt ist. Hinweis: Aus historischen Gründen sind die Begrenzerurl(
und)
, um Kompatibilität mit den CSS-Spezifikationen zu gewährleisten. Die FuncIRI-Form wird in Präsentationsattributen verwendet.SVG macht umfangreichen Gebrauch von IRI-Referenzen, sowohl absolut als auch relativ, zu anderen Objekten. Zum Beispiel, um ein Rechteck mit einem linearen Gradienten zu füllen, definieren Sie zunächst ein
<linearGradient>
-Element und geben ihm eine ID, wie im folgenden Beispiel:html<linearGradient xml:id="MyGradient">...</linearGradient>
Sie verweisen dann auf den linearen Gradient als Wert des
fill
-Attributs für das Rechteck, wie im folgenden Beispiel:html<rect fill="url(#MyGradient)" />
SVG unterstützt zwei Arten von IRI-Referenzen:
-
Lokale IRI-Referenzen, bei denen die IRI-Referenz kein <absoluteIRI> oder <relativeIRI> enthält und somit nur aus einem Fragmentbezeichner besteht (d.h.
#<elementID>
oder#xpointer(id<elementID>)
). -
Nicht-lokale IRI-Referenzen, bei denen die IRI-Referenz ein <absoluteIRI> oder <relativeIRI> enthält.
Für die vollständige Spezifikation von IRI-Referenzen in SVG siehe SVG 1.1 (2. Auflage): IRI-Referenzen.
-
Length
- <length>
-
Eine Länge ist eine Entfernungsangabe, die als Zahl zusammen mit einer Einheit angegeben wird. Die SVG2-Spezifikation orientiert sich an den CSS
<length>
Datentypen und Einheiten für die Attributsyntax und -werte. Ein Längeneinheitensymbol muss angegeben werden, und die Werte der Längeneinheitensymbole sind nicht auf Groß- und Kleinschreibung festgelegt. Die Syntax folgt der CSS<length>
-Syntax:length ::= <number> (<absolute-length> | <relative-length>)?
Für SVG-spezifische Eigenschaften, die in SVG1.1 definiert sind, und ihre entsprechenden Präsentationsattribute sind die Einheitensymbole in Werten optional. Wenn sie nicht angegeben werden, stellt der Längenwert eine Entfernung im aktuellen Benutzerkoordinatensystem dar. Längenangaben müssen in Kleinbuchstaben sein, wenn sie in Präsentationsattributen für alle Eigenschaften verwendet werden, unabhängig davon, ob sie in SVG oder in CSS definiert sind. Diese Empfindlichkeit für die Groß- und Kleinschreibung wird in SVG2 gelockert, um sich an CSS anzupassen.
Beachten Sie, dass die Nicht-Eigenschafts-Definition von <length> auch ein Prozent (
%
)-Einheitensymbol zulässt. Die Bedeutung eines Prozentsatzes des Längenwertes hängt vom Attribut ab, für das der Prozentsatz des Längenwertes angegeben wurde. Zwei häufige Fälle sind:- Wenn ein prozentualer Längenwert einen Prozentsatz der Ansichtsfenster-Breite oder -Höhe darstellt
- Wenn ein prozentualer Längenwert einen Prozentsatz der Begrenzungsrahmen-Breite oder -Höhe eines gegebenen Objekts darstellt.
Im SVG-DOM werden <length>-Werte durch
SVGLength
oderSVGAnimatedLength
Objekte dargestellt.
List-of-Ts
- <list-of-Ts>
-
(Wobei T ein bestimmter Typ ist.) Eine Liste besteht aus einer getrennten Folge von Werten. Sofern nicht ausdrücklich anders beschrieben, können Listen in den XML-Attributen von SVG entweder durch Kommas getrennt (mit optionalem Leerraum vor oder nach dem Komma) oder durch Leerzeichen getrennt sein.
Leerzeichen in Listen werden als eine oder mehrere der folgenden aufeinanderfolgenden Zeichen definiert: "space" (
U+0020
), "tab" (U+0009
), "line feed" (U+000A
), "carriage return" (U+000D
), und "form-feed" (U+000C
).Das folgende ist ein Template für eine EBNF-Grammatik, die die <list-of-Ts>-Syntax beschreibt:
list-of-Ts ::= T | T, list-of-Ts
Im SVG-DOM werden die Werte eines <list-of-Ts>-Typs durch eine schnittstellenspezifische Methode für den bestimmten Typ T dargestellt. Beispielsweise wird eine <list-of-lengths> im SVG-DOM durch ein
SVGLengthList
oder einSVGAnimatedLengthList
Objekt dargestellt.
Name
- <name>
-
Ein Name, das ist eine Zeichenfolge, bei der einige zeichenbedeutende Zeichen nicht zulässig sind.
name ::= [^,()#x20#x9#xD#xA] /* any char except ",", "(", ")" or wsp */
Number
- <number>
-
Reelle Zahlen werden auf eine von zwei Arten spezifiziert. Wenn sie in einem Stylesheet verwendet werden, wird ein <number> wie folgt definiert:
number ::= integer | [+-]? [0-9]* "." [0-9]+
Diese Syntax ist die gleiche wie die Definition in CSS (CSS2, Abschnitt 4.3.1).
Wenn sie in einem SVG-Attribut verwendet wird, wird ein <number> anders definiert, um Zahlen mit großen Größenordnungen prägnanter anzugeben:
number ::= integer ([Ee] integer)? | [+-]? [0-9]* "." [0-9]+ ([Ee] integer)?
Im SVG-DOM wird ein <number> als float,
SVGNumber
oderSVGAnimatedNumber
dargestellt.
Number-optional-number
- <number-optional-number>
-
Ein Paar von <number>s, wobei der zweite <number> optional ist.
number-optional-number ::= number | number, number
Im SVG-DOM wird ein <number-optional-number> durch ein Paar
SVGAnimatedInteger
oderSVGAnimatedNumber
Objekte dargestellt.
Opacity value
- <opacity-value>
-
Die Deckkraft der Farbe oder des Inhalts, mit dem das aktuelle Objekt gefüllt ist, als <number>. Werte außerhalb des Bereichs
0.0
(vollständig transparent) bis1.0
(vollständig undurchsichtig) werden in diesen Bereich eingeklemmt.
Paint
- <paint>
-
Die Werte für die Eigenschaften
fill
undstroke
definieren die Art der Füllung oder Umrandung eines bestimmten Grafikelements. Die verfügbaren Optionen und die Syntax für <paint> sind:paint ::= none | <color> | <url> [none | <color>]? | context-fill | context-stroke
Die Werte
context-fill
undcontext-stroke
ermöglichen die Vererbung von Werten in marker- und use-Elementen.
Percentage
- <percentage>
-
Prozentsätze werden als Zahl gefolgt von einem
%
-Zeichen spezifiziert:percentage ::= number "%"
Beachten Sie, dass die Definition von <number> davon abhängt, ob der Prozentsatz in einem Stylesheet oder in einem Attribut angegeben wird, das nicht ebenfalls ein Präsentationsattribut ist.
Prozentwerte sind immer relativ zu einem anderen Wert (zum Beispiel einer Länge). Jedes Attribut oder jede Eigenschaft, das/die Prozentsätze zulässt, definiert auch die Referenz-Distanzmessung, auf die sich der Prozentsatz bezieht.
Im SVG-DOM wird ein <percentage> durch ein
SVGNumber
oderSVGAnimatedNumber
dargestellt.
Time
- <time>
-
Ein Zeitwert ist ein <number>, dem sofort ein Zeit-Einheitensymbol folgt. Die Zeit-Einheitensymbole sind:
ms
: Millisekundens
: Sekunden
Transform-list
- <transform-list>
-
Eine <transform-list> wird verwendet, um eine Liste von Koordinatensystemtransformationen zu spezifizieren. Eine detaillierte Beschreibung der möglichen Werte für eine <transform-list> wird in der Definition des
transform
-Attributs gegeben.Im SVG-DOM wird ein <transform-list>-Wert durch ein
SVGTransformList
oder einSVGAnimatedTransformList
dargestellt.