1.20.1. SVG element ¶
element | Description | Attribute | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Create a link around a SVG element | Xlink:show xlink:actuate xlink:href target | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Allows control of object text to render special character data X y dx dy rotate glyphRef format xlink:href Define the substitution of a series of iconic symbols Id Define the replacement of a series of candidate iconic symbols Id Dynamically change attributes over time AttributeName= “Target attribute name” from= “start value” to= “end value” dur= “duration” repeatCount= “Animation time will occur” Define color conversion over time By= “relative offset value” from= “start value” to= “end value” Move the element along the action path CalcMode= “interpolation mode of animation. It can be ‘discrete’,’ linear’,’paced’,’ spline’” path= “Motion path” keyPoints= “how far should the object along the motion path move in the current time” rotate= “applies a rotation transformation” xlink:href= “a URI reference < path > element, which defines the motion path” < animateTransform > A target element on the animation transforms attributes so that the animation controls translation, scaling, rotation, or tilt By= “relative offset value” from= “start value” to= “end value” conversion of type “type=” its value changes over time. It can be ‘translate’,’ scale’, ‘rotate’,’ skewX’, ‘skewY’ “ Define a circle Cx= “x-axis coordinates of the circle” cy= “y-axis coordinates of the circle” r = “radius of the circle”. It is necessary. Lets you hide parts of the object that are outside the clipping path. A moldthat defines what to draw and what not to draw is called a cutting path. Clip-path= “reference clip path and reference clip path cross” clipPathUnits= “userSpaceOnUse’ or ‘objectBoundingBox”. The second value, childern, is the border of an object that uses a small portion of the mask (default: “userSpaceOnUse”) “ Specify a description of the color profile (when using CSS style files) Local= “Local Storage Color profile unique ID” name= “” rendering-intent= “auto |perceptual| Relative-colorimetric |saturation| Absolute-colorimetric “xlink:href=” ICC profile Resource URI “ Define a custom cursor independent of the platform X = “upper left cursor of x axis (default is 0)” y = “cursor of upper left corner of y axis (default is 0)” xlink:href= “uses the cursor image URI Referenced element container A plain text description of the elements in SVG-not displayed as part of thegraph. The user agent displays it as a tooltip Define an ellipse Cx= “ellipse x-axis coordinates” cy= “ellipse y-axis coordinates” rx= “radius of the ellipse along the x-axis”. Necessary. Ry= “radius of a long oval along the y-axis”. Necessary. Compositing two objects together using different blending modes Mode= “image mixing mode: normal |multiply| Screen |darken| Lighten “in=”is marked as the original input of the given filter: SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | < filter-primitive-reference > “in2=” mixing operation of the second inputimage “ FeColorMatrix SVG filter. Applicable matrix transformation FeComponentTransfer SVG filter. Perform component-wise remapping of data FeComposite SVG filter FeConvolveMatrix SVG filter FeDiffuseLighting SVG filter FeDisplacementMap SVG filter FeDistantLight SVG filter. Define a light source FeFlood SVG filter FeFuncA SVG filter. Child elements of feComponentTransfer FeFuncB SVG filter. Child elements of feComponentTransfer FeFuncG SVG filter. Child elements of feComponentTransfer FeFuncR SVG filter. Child elements of feComponentTransfer FeGaussianBlur SVG filter. Perform Gaussian blur image FeImage SVG filter. FeMerge SVG filter. Build an image layer on top of each other FeMergeNode SVG filter. Child elements of feMerge FeMorphology SVG filter. Execute “fattening” or “thinning” on the source drawing FeOffset SVG filter. Move the image relative to its current position FePointLight SVG filter FeSpecularLighting SVG filter FeSpotLight SVG filter FeTile SVG filter FeTurbulence SVG filter Filter Container for filter effect Font Define font Font-face Describe the characteristics of a font Font-face-format Font-face-name Font-face-src Font-face-uri ForeignObject Container elements used to combine related elements Id= “name of the group” fill= “the group fill color” opacity= “the group opacity” Glyph Define a graphic for a given pictographic symbol GlyphRef Define possible hieroglyphs to use Hkern Define Ima X = “x-axis coordinates of the upper-left corner of the image” y = “the y-axis coordinates of the upper-left corner of the image” width= “the width of the image”. Must。 Height= “the height of the image”. Must。 Xlink:href= “the path of the image”. Must. Define a line X1 = “straight line starting point x coordinate” y1 = “straight line starting point y coordinate” x2 = “straight line end point x coordinate” y2 = “straight line end point y coordinate” Defines a linear gradient. Fill objects with vector linear gradients and canbe defined as horizontal, vertical, or angular gradients. The id= “id property defines a unique name for the ramp. Reference must be “gradientUnits=” ‘userSpaceOnUse’ or’ objectBoundingBox’. Use a view box or object to determine the relative position vector point. (default is’ objectBoundingBox) “gradientTransform=” applies to the transition of the gradient “x1 =” gradient vector x startup point (default 0%) “y1 =” gradient vector y startup point (default 0%) “x2 =” end point of gradient vector x. (default 100%) “y2 =” the end of the gradient vector y. (default0%) “spreadMethod=” ‘pad’ or’ reflect’ or ‘repeat’ “ Tags can be placed on vertices of lines, broken lines, polygons and paths. These elements can use the “marker-start”, “marker-mid” and “marker-end” of the marker attribute to inherit the URI of the tag that can be set to “none” or defined by default. You must define a tag before you can reference it through its URI. Any shape, you can put the mark in it. When they draw elements, they attach them to the top. MarkerUnits= “strokeWidth’” or “userSpaceOnUse”. If it is strokeWidth, then one unit equals one stroke width. Otherwise, the tag scale does not use the same view unit as the reference element (default is’ strokeWidth’’) “refx=” marks the position of the vertex connection (default is 0) “refy=” marks the position of the vertex connection (default is 0) “orient=” ‘auto’ always shows the angle of the mark. “auto” calculates an angle such that the tangent of a vertex on the X axis (default is 0) the width of the “markerWidth=” marker (default 3) the height of the “markerHeight=” marker (default 3) the “viewBox=” points “see” this SVG drawing area. Four values separated by spaces or commas. (min x, min y, width, height) “ Degree shielding is a combination and clipping of opacity values. Like cropping, you can use graphics, text, or paths to define parts of the mask. The default state of a mask is completely transparent, that is, the oppositeside of the clipping plane. Set the opaque part of the mask in the graphicsof the mask MaskUnits= “‘userSpaceOnUse’ or’ objectBoundingBox’. Sets whether the crop face is a relatively complete window or object (default: ‘objectBoundingBox’) the second mask of “maskContentUnits=” uses the percentage’ userSpaceOnUse’ or ‘objectBoundingBox’ (default:’ userSpaceOnUse’) “x =” crop face mask (default:-10%) “y =” crop face mask (default:-10%) “width=” crop face mask (default: 120%) “height=” crop face mask (default: 120%) “ Metadata Specify metadata Missing-glyph Mpath Define a path D = “define path instruction” pathLength= “if present, the path will be scaled to calculate the path length” transform= “conversion list” for each point equivalent to this value. Define the coordinates, the view display you want, and the size of the view.Then add to your pattern shape. Repeat the edge of the view box (visual range) when the mode is hit Id= “the only ID used to reference this pattern.” Necessary. PatternUnits=”userSpaceOnUse’” or “objectBoundingBox”. The second value, XGravity Y widthdepartment height, is a small portion of the border of the schema object, in%. “ PatternContentUnits= “‘userSpaceOnUse’ or’ objectBoundingBox’” patternTransform= “allows the entire expression to convert the offset of” x = “mode from the upper left corner (default is 0)the offset of” y = “mode from the upper left corner (default is 0) the width of” width= “mode tile (default is 100%), the height of” height= “mode tile (default is 100%) and the” viewBox= “points” see “this SVG drawing area. Four values separated by spaces or commas. (min x, min y, width, height) another mode of “xlink:href=” whose attribute values are default values and can be inherited by any subclass. Recursive “ Define a graphic that contains at least three sides Points= “points of polygons. The total number of points must be even”. Necessary. Fill-rule= “part of the FillStroke presentation properties” Define any shape made up of only straight lines The “dot” on the broken line of points=. Necessary. Defines a radioactive gradient. A radioactive gradient creates a circle GradientUnits= “‘userSpaceOnUse’ or’ objectBoundingBox’. Use a view box or object to determine the vector point of the relative position. (default is’ objectBoundingBox’) “gradientTransform=” applies to the transformation of the gradient the center point of the “cx=” gradient (the number or%-50% isthe default) the center point of the “cy=” gradient. (default 50%) the radius of the “r =” gradient. (default 50%) the focus of the “fx=” gradient. (default 0%) the focus of the “fy=” gradient. (default 0%) “spreadMethod=” ‘pad’ or’ reflect’ or ‘repeat’ “xlink:href=” refers to another ramp with its attribute value as the default value. Recursive “ Define a rectangle X = “x axis of the upper left corner of the rectangle” y = “radius of they axis of the rectangle” rx= “x axis (round element)” ry= “radius of the y axis (round element)” width= “width of the rectangle”. Necessary. Height= “height of rectangle”. Necessary. Script Script container. (for example, ECMAScript) set Set a property value to specify the time Gradual change stop Offset= “offset stops (0 to 1, 0 to 100).” Refer to stop-color= “the color of this stop” stop-opacity= “the opacity of this Stop (0 to 1)” Style You can embed stylesheets directly into SVG content |