SVG-Elemente
| Element | Beschreibung | Attribute |
|---|---|---|
| <a> | Erzeugt einen Link um SVG-Elemente | xlink:show xlink:actuate xlink:href target |
| <altGlyph> | Glyphen ermöglicht die Kontrolle über verwendet, um bestimmte Zeichendaten zu machen | x y dx dy rotate glyphRef format xlink:href |
| <altGlyphDef> | Definiert eine Substitution Satz für Glyphen | id |
| <altGlyphItem> | Definiert einen Kandidatensatz von Glyph-Substitutionen | id |
| <animate> | Legt fest, wie ein Attribut eines Elements im Laufe der Zeit ändert | attributeName="the name of the target attribute" by="a relative offset value" from="the starting value" to="the ending value" dur="the duration" repeatCount="the number of time the animation will take place" |
| <animateMotion> | Verursacht ein referenzierte Element entlang einem Bewegungspfad zu bewegen | calcMode="the interpolation mode for the animation. Can be 'discrete',
'linear', 'paced', 'spline'" path="the motion path" keyPoints="how far along the motion path the object shall move at the moment in time" rotate="applies a rotation transformation" xlink:href="an URI reference to the <path> element which defines the motion path" |
| <animateTransform> | Animiert eine Transformationsattribut auf einem Zielelement, wodurch Animationen Übersetzungs Skalierung zu steuern, Drehung und / oder Schrägstellung | by="a relative offset value" from="the starting value" to="the ending value" type="the type of transformation which is to have its values change over time. Can be 'translate', 'scale', 'rotate', 'skewX', 'skewY'" |
| <circle> | Definiert einen Kreis | cx="the x-axis center of the circle" cy="the y-axis center of the circle" r="The circle's radius". Required. + presentation attributes: Color, FillStroke, Graphics |
| <clipPath> | Clipping ist etwa versteckt, was normalerweise gezogen werden würde. Die Schablone, die, was definiert ist und was ist ein Beschneidungspfad nicht gezogen genannt | clip-path="the referenced clipping path is intersected with the
referencing clipping path" clipPathUnits="'userSpaceOnUse' or 'objectBoundingBox'. The second value makes units of children a fraction of the object bounding box which uses the mask (default: 'userSpaceOnUse') " |
| <color-profile> | Gibt ein Farbprofil Beschreibung (wenn das Dokument mit Hilfe von CSS) | local="the unique ID for a locally stored color profile" name="" rendering-intent="auto|perceptual|relative-colorimetric|saturation|absolute-colorimetric" xlink:href="the URI of an ICC profile resource" |
| <cursor> | Definiert eine plattformunabhängige benutzerdefinierten Cursor | x="the x-axis top-left corner of the cursor (default is 0) " y="the y-axis top-left corner of the cursor (default is 0) " xlink:href="the URI of the image to use as the cursor |
| <defs> | Ein Behälter für referenzierte Elemente | |
| <desc> | Eine Nur-Text-Beschreibung für Containerelemente oder grafischen Elementen in SVG (Benutzerprogramme können den Text als Tooltip angezeigt) | |
| <ellipse> | Definiert eine Ellipse | cx="the x-axis center of the ellipse" cy="the y-axis center of the ellipse" rx="the length of the ellipse's radius along the x-axis". Required. ry="the length of the ellipse's radius along the y-axis". Required. + presentation attributes: Color, FillStroke, Graphics |
| <feBlend> | Komponiert zwei Objekte zusammen nach einem bestimmten Mischmodus | mode="the image blending modes: normal|multiply|screen|darken|lighten" in="identifies input for the given filter primitive: SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <filter-primitive-reference>" in2="the second input image to the blending operation" |
| feColorMatrix | SVG-Filter. Wendet eine Matrix-Transformation | |
| feComponentTransfer | SVG-Filter. Führt komponentenweise Neuzuordnung von Daten | |
| feComposite | SVG-Filter. | |
| feConvolveMatrix | SVG-Filter. | |
| feDiffuseLighting | SVG-Filter. | |
| feDisplacementMap | SVG-Filter. | |
| feDistantLight | SVG-Filter. Definiert eine Lichtquelle | |
| feFlood | SVG-Filter. | |
| feFuncA | SVG-Filter. Unterelement feComponentTransfer | |
| feFuncB | SVG-Filter. Unterelement feComponentTransfer | |
| feFuncG | SVG-Filter. Unterelement feComponentTransfer | |
| feFuncR | SVG-Filter. Unterelement feComponentTransfer | |
| feGaussianBlur | SVG-Filter. Führt eine Gaußsche Unschärfe auf das Bild | |
| feImage | SVG-Filter. | |
| feMerge | SVG-Filter. Erzeugt Bildschichten auf der jeweils anderen | |
| feMergeNode | SVG-Filter. Unterelement feMerge | |
| feMorphology | SVG-Filter. Führt eine "fattening" oder "thinning" auf eine Quelle Grafik | |
| feOffset | SVG-Filter. Verschiebt ein Bild in Bezug auf seine aktuelle Position | |
| fePointLight | SVG-Filter. | |
| feSpecularLighting | SVG-Filter. | |
| feSpotLight | SVG-Filter. | |
| feTile | SVG-Filter. | |
| feTurbulence | SVG-Filter. | |
| filter | Container für Filtereffekte | |
| font | Definiert eine Schriftart | |
| font-face | Beschreibt die Eigenschaften einer Schriftart | |
| font-face-format | ||
| font-face-name | ||
| font-face-src | ||
| font-face-uri | ||
| foreignObject | ||
| <g> | Wird verwendet, um Gruppe zusammen Elemente | id="the name of the group" fill="the fill color for the group" opacity="the opacity for the group" + presentation attributes: All |
| glyph | Definiert die Grafik für eine bestimmte Glyphe | |
| glyphRef | Definiert eine mögliche Glyphe zu verwenden | |
| hkern | ||
| <image> | Definiert ein Bild | x="the x-axis top-left corner of the image" y="the y-axis top-left corner of the image" width="the width of the image". Required. height="the height of the image". Required. xlink:href="the path to the image". Required. + presentation attributes: Color, Graphics, Images, Viewports |
| <line> | Definiert eine Linie | x1="the x start point of the line" y1="the y start point of the line" x2="the x end point of the line" y2="the y end point of the line" + presentation attributes: Color, FillStroke, Graphics, Markers |
| <linearGradient> | Definiert einen linearen Gradienten. Linearen Gradienten füllen das Objekt durch einen Vektor verwendet, und kann als horizontal, vertikal oder eckig Gradienten festgelegt werden. | id="the unique id used to reference this pattern. Required to reference
it" gradientUnits="'userSpaceOnUse' or 'objectBoundingBox'. Use the view box or object to determine relative position of vector points. (Default 'objectBoundingBox') " gradientTransform="the transformation to apply to the gradient" x1="the x start point of the gradient vector (number or % - 0% is default) " y1="the y start point of the gradient vector. (0% default) " x2="the x end point of the gradient vector. (100% default) " y2="the y end point of the gradient vector. (0% default) " spreadMethod="'pad' or 'reflect' or 'repeat'" xlink:href="reference to another gradient whose attribute values are used as defaults and stops included. Recursive" |
| <marker> | Marker können an den Ecken von Linien, Polylinien, Polygone und Pfade gesetzt werden. Diese Elemente können die Verwendung marker Attribute "marker-start" , "marker-mid" und "Marker-end" ', die standardmäßig erben oder kann eingestellt werden auf ' none 'oder der URI eines definierten Marker. Sie müssen zuerst die Marker definieren, bevor Sie es über seine URI verweisen kann. Jede Art von Form kann innerhalb Marker gesetzt werden. Sie sind auf der Oberseite des Elementes gezogen sie gebunden sind, | markerUnits="'strokeWidth' or 'userSpaceOnUse'. If 'strokeWidth' is used
then one unit equals one stroke width. Otherwise, the marker does not scale
and uses the the same view units as the referencing element (default 'strokeWidth') " refx="the position where the marker connects with the vertex (default 0) " refy="the position where the marker connects with the vertex (default 0) " orient="'auto' or an angle to always show the marker at. 'auto' will compute an angle that makes the x-axis a tangent of the vertex (default 0) " markerWidth="the width of the marker (default 3) " markerHeight="the height of the marker (default 3) " viewBox="the points "seen" in this SVG drawing area. 4 values separated by white space or commas. (min x, min y, width, height) " + presentation attributes: All |
| <mask> | Maskierung ist eine Kombination von Opazitätswerten und Clipping. Wie Clipping Sie Formen verwenden können, Text oder Pfade Abschnitte der Maske zu definieren. Der Standardzustand einer Maske ist vollständig transparent, was ist das Gegenteil Ebene Clipping. Die Grafiken in einer Maske legt fest, wie undurchsichtigen Bereiche der Maske sind | maskUnits="'userSpaceOnUse' or 'objectBoundingBox'. Set whether the
clipping plane is relative the full view port or object (default: 'objectBoundingBox') " maskContentUnits="Use the second with percentages to make mask graphic positions relative the object. 'userSpaceOnUse' or 'objectBoundingBox' (default: 'userSpaceOnUse') " x="the clipping plane of the mask (default: -10%) " y="the clipping plane of the mask (default: -10%) " width="the clipping plane of the mask (default: 120%) " height="the clipping plane of the mask (default: 120%) " |
| metadata | Gibt Metadaten | |
| missing-glyph | ||
| mpath | ||
| <path> | Definiert einen Pfad | d="a set of commands which define the path" pathLength="If present, the path will be scaled so that the computed path length of the points equals this value" transform="a list of transformations" + presentation attributes: Color, FillStroke, Graphics, Markers |
| <pattern> | Definiert die Koordinaten, die Sie die Ansicht wollen zeigen, und die Größe der Ansicht. Dann fügen Sie Formen in Ihrem Muster. Das Muster wiederholt sich, wenn eine Kante des Ansichtsfeld (viewing area) getroffen wird | id="the unique id used to reference this pattern." Required. patternUnits="'userSpaceOnUse' or 'objectBoundingBox'. The second value makes units of x, y, width, height a fraction (or %) of the object bounding box which uses the pattern." patternContentUnits="'userSpaceOnUse' or 'objectBoundingBox'" patternTransform="allows the whole pattern to be transformed" x="pattern's offset from the top-left corner (default 0) " y="pattern's offset from the top-left corner. (default 0) " width="the width of the pattern tile (default 100%) " height="the height of the pattern tile (default 100%) " viewBox="the points "seen" in this SVG drawing area. 4 values separated by white space or commas. (min x, min y, width, height) " xlink:href="reference to another pattern whose attribute values are used as defaults and any children are inherited. Recursive" |
| <polygon> | Definiert eine Grafik, die mit mindestens drei Seiten enthält | points="the points of the polygon. The total number of points must be
even". Required. fill-rule="part of the FillStroke presentation attributes" + presentation attributes: Color, FillStroke, Graphics, Markers |
| <polyline> | Definiert eine beliebige Form, die nur aus geraden Linien besteht | points="the points on the polyline". Required. + presentation attributes: Color, FillStroke, Graphics, Markers |
| <radialGradient> | Definiert einen radialen Verlauf. Radial-Gradienten werden erstellt, indem Sie einen Kreis zu nehmen und sanft Werte zwischen Gradienten Stationen vom Fokuspunkt auf den Außenradius zu verändern. | gradientUnits="'userSpaceOnUse' or 'objectBoundingBox'. Use the view box
or object to determine relative position of vector points. (Default 'objectBoundingBox') " gradientTransform="the transformation to apply to the gradient" cx="the center point of the gradient (number or % - 50% is default) " cy="the center point of the gradient. (50% default) " r="the radius of the gradient. (50% default) " fx="the focus point of the gradient. (0% default) " fy="The focus point of the gradient. (0% default) " spreadMethod="'pad' or 'reflect' or 'repeat'" xlink:href="Reference to another gradient whose attribute values are used as defaults and stops included. Recursive" |
| <rect> | Definiert ein Rechteck | x="the x-axis top-left corner of the rectangle" y="the y-axis top-left corner of the rectangle" rx="the x-axis radius (to round the element) " ry="the y-axis radius (to round the element) " width="the width of the rectangle". Required. height="the height of the rectangle" Required. + presentation attributes: Color, FillStroke, Graphics |
| script | Container für Skripte (eg, ECMAScript) | |
| set | Setzt den Wert eines Attributs für eine bestimmte Dauer | |
| <stop> | Die Anschläge für einen Gradienten | offset="the offset for this stop (0 to 1/0% to 100%) ". Required. stop-color="the color of this stop" stop-opacity="the opacity of this stop (0 to 1) " |
| style | Ermöglicht Stylesheets direkt im SVG-Inhalt eingebettet werden | |
| <svg> | Erstellt ein SVG-Dokumentfragment | x="top left corner when embedded (default 0) " y="top left corner when embedded (default 0) " width="the width of the svg fragment (default 100%) " height="the height of the svg fragment (default 100%) " viewBox="the points "seen" in this SVG drawing area. 4 values separated by white space or commas. (min x, min y, width, height) " preserveAspectRatio="'none' or any of the 9 combinations of 'xVALYVAL' where VAL is 'min', 'mid' or 'max'. (default xMidYMid) " zoomAndPan="'magnify' or 'disable'. Magnify option allows users to pan and zoom your file (default magnify) " xml="outermost <svg> element needs to setup SVG and its namespace: xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"" + presentation attributes: All |
| switch | ||
| symbol | ||
| <text> | Definiert einen Text | x="a list of x-axis positions. The nth x-axis position is given to the
nth character in the text. If there are additional characters after the
positions run out they are placed after the last character. 0 is default" y="a list of y-axis positions. (see x) . 0 is default" dx="a list of lengths which moves the characters relative to the absolute position of the last glyph drawn. (see x) " dy="a list of lengths which moves the characters relative to the absolute position of the last glyph drawn. (see x) " rotate="a list of rotations. The nth rotation is performed on the nth character. Additional characters are NOT given the last rotation value" textLength="a target length for the text that the SVG viewer will attempt to display the text between by adjusting the spacing and/or the glyphs. (default: The text's normal length) " lengthAdjust="tells the viewer what to adjust to try to accomplish rendering the text if the length is specified. The two values are 'spacing' and 'spacingAndGlyphs'" + presentation attributes: Color, FillStroke, Graphics, FontSpecification, TextContentElements |
| textPath | ||
| title | Eine Nur-Text-Beschreibung für Elemente in SVG - nicht als Teil der Grafik dargestellt. Benutzerprogramme können den Text als Tooltip angezeigt werden | |
| <tref> | Referenzen jeder <text> Element in der SVG - Dokument und es wiederverwenden | Identical to the <text> element |
| <tspan> | Identisch mit dem <text> Element , sondern kann innerhalb Text - Tags und in sich verschachtelt werden | Identical to the <text> element + in addition: xlink:href="Reference to a <text> element" |
| <use> | Verwendet eine URI ein <g>, zu verweisen <svg> oder andere grafische Element mit einer eindeutigen ID - Attribut und es replizieren. Die Kopie ist nur ein Verweis auf das Original, so dass nur das Original in dem Dokument vorhanden ist. Jede Änderung der ursprünglichen betrifft alle Kopien. | x="the x-axis top-left corner of the cloned element" y="the y-axis top-left corner of the cloned element" width="the width of the cloned element" height="the height of the cloned element" xlink:href="a URI reference to the cloned element" + presentation attributes: All |
| view | ||
| vkern |