SVG Manuel de référence
élément SVG
| élément | explication | propriété |
|---|---|---|
| <a> | Créer un lien autour de l'élément SVG | xlink: show xlink: actionner xlink: href cible |
| <AltGlyph> | Permet un objet du texte contrôle pour rendre les données de caractère spécial | x y dx dy tourner glyphRef format xlink: href |
| <AltGlyphDef> | Il est défini comme une série de symboles à remplacer | ça |
| <AltGlyphItem> | Remplacer la définition d'une série de symboles comme le candidat | ça |
| <Animate> | Dynamiquement modifier les propriétés au fil du temps | attributeName = "nom de l'attribut cible" from = "valeur initiale" to = "valeur finale" dur = "Durée" repeatCount = "animation en temps se produira." |
| <AnimateColor> | Au fil du temps, la définition de la conversion des couleurs | par = "valeur de décalage relative" from = "valeur initiale" to = "valeur finale" |
| <AnimateMotion> | De sorte que l'élément se déplace le long de la trajectoire de mouvement | calcMode = "mode d'interpolation d'animation peut être,« linéaire '' discrète '' rythme ',' spline ', " «Chemin de mouvement" path = keyPoints = "le long de la trajectoire de déplacement de l'objet de l'heure actuelle doivent être déplacés loin." tourner = "appliquer une transformation de rotation." xlink: href = "URI fait référence à un élément <path> qui définit la trajectoire de mouvement." |
| <AnimateTransform> | élément cible d'animation transformer une propriété, ce qui rend la casserole de contrôle d'animation, zoom, rotation, inclinaison ou | par = "valeur de décalage relative" from = "valeur initiale" to = "valeur finale" type = "Type converti dont la valeur change au fil du temps peut être« traduire »,« échelle »,« rotation »,« skewX ',' skewY ' " |
| <Cercle> | La définition d'un cercle | cx = "axe x coordonnée du cercle." cy = "y-axe de coordonnées du cercle." r = "rayon du cercle." requis. + Afficher les attributs: couleur, fillstroke, graphiques |
| <ClipPath> | Permet de masquer des objets situés en dehors de la partie de chemin de détourage. Dessin et ce qui ne définit pas ce qu'on appelle le chemin matrice de découpage de dessin | clip-path = "références et les références des chemins de détourage de chemin de détourage se croisent." clipPathUnits = "userSpaceOnUse 'ou' objectBoundingBox". La frontière seconde valeur childern d'un objet, en utilisant une petite partie de l'unité de masque (par défaut: "userSpaceOnUse") " |
| <Couleur profil> | Description du profil de couleur spécifiée (en utilisant le fichier de style CSS) | locale = "profil de couleur stocké localement unique ID" name = "" rendering-intent = "auto | perceptive | rapport-colorimétriques | saturation | absolute-colorimétriques" xlink: href = "profil ICC ressource URI" |
| <Cursor> | Définir un curseur personnalisé indépendant de la plateforme | x = "axe x coin supérieur gauche du curseur (la valeur par défaut est 0)." y = "axe y du coin supérieur gauche du curseur (la valeur par défaut est 0)." xlink: href = "Utiliser l'image du curseur URI |
| <Defs> | Container référence de l'élément | |
| <Desc> | éléments purs dans SVG description textuelle - pas dans le cadre de l'image à afficher. Les agents utilisateurs peuvent afficher une info-bulle | |
| <Ellipse> | La définition d'une ellipse | cx = "x-axe ovale de coordonnées" cy = "y-axe ovale de coordonnées" rx = "le long de l'axe x du rayon de l'ellipse." Obligatoire. ry = "allongé le long du rayon d'axe y." Obligatoire. + Afficher les attributs: couleur, fillstroke, graphiques |
| <FeBlend> | En utilisant différents modes de mélange pour la synthèse de deux objets ensemble | mode = "modes de fusion d'image: normal | multiplier | écran | assombrir | alléger" in = "identifié comme étant l'entrée brute de filtre donné: SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <primitive-filtre-référence>" in2 = "seconde image d'entrée opération de mélange." |
| feColorMatrix | filtre SVG. transformation de la matrice appropriée | |
| feComponentTransfer | filtre SVG. composante par composante de données d'exécution remappage | |
| feComposite | Filtres SVG | |
| feConvolveMatrix | Filtres SVG | |
| feDiffuseLighting | Filtres SVG | |
| feDisplacementMap | Filtres SVG | |
| feDistantLight | filtre SVG. La définition d'une source de lumière | |
| feFlood | Filtres SVG | |
| feFuncA | filtre SVG. éléments enfants feComponentTransfer | |
| feFuncB | filtre SVG. éléments enfants feComponentTransfer | |
| feFuncG | filtre SVG. éléments enfants feComponentTransfer | |
| feFuncR | filtre SVG. éléments enfants feComponentTransfer | |
| feGaussianBlur | filtre SVG. Image exécutif gaussien flou | |
| feImage | filtre SVG. | |
| feMerge | filtre SVG. Construit au-dessus de l'autre couche d'image | |
| feMergeNode | filtre SVG. éléments enfants feMerge | |
| feMorphology | filtre SVG. La mise en œuvre de «engraissement» ou «amincissement» Graphics source | |
| feOffset | filtre SVG. Par rapport à sa position actuelle d'une image animée | |
| fePointLight | Filtres SVG | |
| feSpecularLighting | Filtres SVG | |
| feSpotLight | Filtres SVG | |
| feTile | Filtres SVG | |
| feTurbulence | Filtres SVG | |
| filtre | effets de filtre de conteneurs | |
| fonte | polices personnalisées | |
| font-face | Décrire les caractéristiques d'une police | |
| font-face format | ||
| font-face-name | ||
| font-face-src | ||
| font-face-uri | ||
| foreignObject | ||
| <G> | Elément de conteneur pour la combinaison d'éléments connexes | id = "nom du groupe." fill = "couleur de remplissage du groupe." opacité = "L'opacité du groupe" + Afficher les propriétés: tous |
| glyphe | Pour un hiéroglyphe données graphiques personnalisés | |
| glyphRef | définition Pictograph peut être utilisé | |
| hkern | ||
| <Image> | image personnalisée | = x "axe de coordonnée x du coin supérieur gauche de l'image." y = "axe coordonnée y du coin supérieur gauche de l'image." width = "largeur de l'image." must. height = "hauteur de l'image." must. xlink :. href = "chemin de l'image" must. + Afficher les propriétés: Couleur, Graphics, Images, Viewports |
| <Ligne> | Définir une ligne | x1 = "x coordonnée du point d'une ligne droite de départ." y1 = "coordonnées y du point d'une ligne droite de départ." x2 = "x-coordonnée du point final de la ligne droite." y2 = "coordonnée y du point de fin de ligne droite." + Afficher les propriétés: Couleur, fillstroke, Graphics, marqueurs |
| <LinearGradient> | Définir un gradient linéaire. En utilisant un remplissage dégradé linéaire des objets vectoriels, et peut être défini comme horizontal, gradient vertical ou angle. | id = "attribut id peut définir un nom unique pour le dégradé. Les références doivent" gradientUnits = " 'userSpaceOnUse' ou 'objectBoundingBox'. Utilisez la boîte de vue ou de l'objet pour déterminer le point vecteur position relative. (par défaut 'objectBoundingBox)" gradientTransform = "applique à changer le gradient" x1 = "x point de départ du vecteur gradient (par défaut 0%)" y1 = "point de départ du vecteur gradient y (par défaut 0%)" x2 = "la fin du vecteur x gradient. (par défaut 100%)" y2 = "la fin du vecteur gradient y. (par défaut 0%)" spreadMethod = " 'pad' ou 'le reflet' ou 'repeat'" xlink: href = "référence à un autre gradient dont les valeurs attribut sont utilisées comme valeurs par défaut et les arrêts inclus récursif." |
| <Marker> | Tag peut être placé sur le sommet des lignes, des polylignes, des polygones et des chemins. Ces éléments peuvent être utilisés Maeker propriété "Maeker-start", "Maeker-mid" et "Maeker-end", Inherit défaut, ou peuvent être réglés pour URI "none" ou balises définies. Vous devez définir la balise avant qu'il puisse être référencé par l'URI. Tout type de forme, vous pouvez mettre des balises à l'intérieur. Quand ils puisent les éléments pour les attacher à la partie supérieure | markerUnits = "strokeWidth 'ou' userSpaceOnUse". Si strokeWidth "alors l'utilisation d'une unité est égale à la largeur d'un accident vasculaire cérébral. Dans le cas contraire, ne pas utiliser le même point de vue tag échelle de l'unité comme un élément de référence (par défaut 'strokeWidth')" refX = "connexions de sommet lieu de marqueur (la valeur par défaut est 0)." refY = "connexions placer un marqueur de vertex (la valeur par défaut est 0)." orient = " 'auto' affichage toujours la marque d'angle." auto "sera calculée à un angle tel que l'axe X d'une tangente au sommet (0 par défaut) markerWidth = "width marqué (par défaut 3)." markerHeight = "height marquée (par défaut 3)." viewBox = "points" vu "cette SVG zone de dessin. 4 valeurs séparées par des espaces ou des virgules. (min x, y min, largeur, hauteur)" + Présentation des attributs: tous |
| <Mask> | Blindage est une combinaison d'un non-coupe et des valeurs de transparence. Comme le recadrage, vous pouvez utiliser certains graphiques, texte ou chemin défini masque. L'état d'un masque par défaut est complètement transparent, qui est à l'opposé du plan de coupe. Dans la partie opaque du masque motif paramètres masque | maskUnits = "." userSpaceOnUse 'ou' objectBoundingBox 'définir si plan de délimitation est fenêtre ou objet relativement intact (par défaut:' objectBoundingBox ') " maskContentUnits = "position d'objet par rapport second motif de masque en utilisant des pourcentages de la userSpaceOnUse 'ou' objectBoundingBox '(par défaut:' userSpaceOnUse ')" x = "masque d'écrêtage plane (par défaut: -10%)." y = "masque d'écrêtage plane (par défaut: -10%)." width = "masque d'écrêtage d'avion (par défaut: 120%)." height = "masque d'écrêtage plan (par défaut: 120%)." |
| métadonnées | méta-données spécifiées | |
| manquant-glyphe | ||
| mpath | ||
| <Path> | Définir un chemin | d = "commande de chemin défini" pathLength = "S'il y a, le chemin sera réduite afin de calculer les points de valeur équivalente à la longueur de ce chemin" transform = "Liste de conversion" + Afficher les propriétés: Couleur, fillstroke, Graphics, marqueurs |
| <Motif> | DET, la taille que vous souhaitez afficher les affichages et points de vue. Puis ajouter à votre forme de mode. Ce motif est répété a frappé le bord de la vue de la boîte (visible) | id = "ID unique utilisé pour faire référence à ce modèle." nécessaire. patternUnits = "userSpaceOnUse 'ou' objectBoundingBox". La deuxième valeur X, Y, largeur, mode trame de hauteur à l'aide d'une petite partie de l'objet, l'unité (%). " patternContentUnits = " 'userSpaceOnUse' ou 'objectBoundingBox'" patternTransform = "permet l'expression entière pour convertir" x = "mode de décalage, à partir du coin supérieur gauche (0 par défaut)." y = "mode de décalage, à partir du coin supérieur gauche (0 par défaut)." width = "largeur de tuile de motif (par défaut est de 100%)." height = "hauteur de tuile de motif (par défaut est de 100%)." viewBox = "points" vu "cette SVG zone de dessin. 4 valeurs séparées par des espaces ou des virgules. (min x, y min, largeur, hauteur)" xlink: href = "Un autre modèle, la valeur de la propriété est la valeur par défaut et toute sous-classe peut hériter récursivité." |
| <Polygon> | Définit un dessin contient au moins trois côtés | Points = "point du polygone. Le nombre total de points doivent être encore." Obligatoire. fill-rule = "section fillstroke attribut de présentation" + Afficher les propriétés: Couleur, fillstroke, Graphics, marqueurs |
| <Polyligne> | Définir toute forme seulement des lignes droites | points de polyligne = «point». Obligatoire. + Afficher les propriétés: Couleur, fillstroke, Graphics, marqueurs |
| <RadialGradient> | Définition d'un changement graduel radioactif. Créer un cercle de dégradé radial | gradientUnits = " 'userSpaceOnUse' ou 'objectBoundingBox'. Utilisez la boîte de vue ou de l'objet pour déterminer la position relative des points vectoriels. (La valeur par défaut est« objectBoundingBox) " gradientTransform = "applique à transformer gradients" cx = "point central du gradient (nombre ou% - 50% est la valeur par défaut)." cy = "point central du gradient. (par défaut 50%)." r = "rayon progressif. (par défaut 50%)." fx = "point focal du dégradé. (par défaut 0%)" fy = "point focal du dégradé. (par défaut 0%)" spreadMethod = " 'pad' ou 'le reflet' ou 'repeat'" xlink: href = "référence à un autre gradient dont la valeur foncière comme une récursivité par défaut." |
| <Rect> | Définir un rectangle | x = "axe x coin supérieur gauche du rectangle." y = "axe y du coin supérieur gauche du rectangle." rx = "Radius (élément rond) x-axe." ry = "rayon de l'axe y (élément rond)" largeur = "largeur du rectangle". Obligatoire. height = "hauteur du rectangle." Obligatoire. + Afficher les propriétés: Couleur, fillstroke, Graphics |
| scénario | conteneur Script. (Tels que ECMAScript) | |
| ensemble | Définition d'une valeur de propriété pour la durée spécifiée | |
| <Arrêter> | arrêt Gradient | offset = "Stop Offset (0-1 / 0% à 100%)." Référence stop-color = "color cet arrêt" stop-opacity = "Arrêter l'opacité du (0-1)." |
| style | Les feuilles de style peuvent être intégrés directement dans le contenu SVG | |
| <Svg> | Créer un fragment de document SVG | x = "intégré dans le coin supérieur gauche (0 par défaut)." y = "intégré dans le coin supérieur gauche (0 par défaut)." width = "fragment SVG largeur (la valeur par défaut est de 100%)." height = "fragment SVG de hauteur (la valeur par défaut est de 100%)." viewBox = "points" vu "dans cette zone de dessin SVG. 4 valeurs séparées par des espaces ou des virgules. (min x, y min, largeur, hauteur)" preserveAspectRatio = " 'none' ou tout 'xVALYVAL' neuf combinaisons, VAL est" min "," mi "ou" max ". (par défaut none)" zoomAndPan = " 'magnifier' ou '' option disable'.Magnify permet aux utilisateurs de panoramique et de zoom de vos fichiers (par défaut) Magnify" xml = "ultrapériphérique <svg> élément et son besoin d'installer SVG namespace: xmlns =" http://www.w3.org/2000/svg~~number=plural "xmlns: xlink =" http: //www.w3. org / 1999 / xlink "xml: space =" préserver "" + Afficher les propriétés: tous |
| interrupteur | ||
| symbole | ||
| <Text> | Définir un texte | x = "liste des X - .. La position de l'arbre dans le texte à la position des n premiers caractères de l'axe des x n-ième s'il y a des caractères supplémentaires derrière, épuisé après la dernière position de caractère ils ont placé 0 est la valeur par défaut." y = "Position de l'axe Y de la liste. (voir x) 0 est la valeur par défaut." dx = "déplacer par rapport établi dernier glyphe dans la longueur de la liste de caractères dans la position absolue (reportez-vous à x)" dy = "déplacer par rapport établi dernier glyphe dans la longueur de la liste de caractères dans la position absolue (voir x)" tourner = "une liste de rotation de la rotation de la n-ième des n premiers caractères. caractères supplémentaires ne donnent pas une valeur de spin finale" textLength = "SVG Viewer va essayer de montrer l'espacement entre le texte / police ou d'ajuster la longueur du texte cible (par défaut: durée normale du texte)." lengthAdjust = "indique le spectateur, si vous essayez de spécifier la longueur ajustée pour rendre le texte. Ces deux valeurs sont 'spacing' et 'spacingAndGlyphs'" + Afficher les propriétés: Couleur, fillstroke, Graphics, FontSpecification, TextContentElements |
| textPath | ||
| titre | éléments purs dans SVG description textuelle - pas dans le cadre de l'image à afficher. Les agents utilisateurs peuvent afficher une info-bulle | |
| <Tref> | Reportez-vous à tout document SVG <text> et la réutilisation | Idem <TEXT> élément |
| <Tspan> | Élément équivalent au <texte>, mais il peut être imbriqué dans le texte lui-même et la marque interne | Identique à l'élément <text> + En outre: xlink: href = "référence à un <TEXT> élément" |
| <Utilisation> | référence URI en utilisant un <G>, <svg> ou autre propriété dispose d'un identifiant unique et les éléments graphiques répétés. Copiez l'élément d'origine, de sorte que la présence du fichier d'origine est seulement une référence. Origine affecter tout changement dans toutes les copies. | x = "élément en haut à gauche du clone de l'axe des x" y = "en haut à gauche l'axe y élément clone" width = "clonage largeur de l'élément" height = "height élément clonage" xlink: href = "références URI élément de clonage" + Afficher les propriétés: tous |
| vue | ||
| vkern |