The letters in the path, uppercase and lowercase relative to the upper-left corner of the absolute position, m110,95,95,110m115,100,100,115
Pattern is similar to a picture collage, which can be used to fill the pattern of a specified position
var pattern = elem.pattern (100, 100, 10, 10);
Circle.attr ({ fill:pattern}); when a property does not need anything, fill in the None:element.attr ({ Fill: "None "&NBSP;}) var ring = Circle.use (); Create a reference to an element, you can change the property style with attr, but to change the position you need to use animate and so on, change the size to be used on that element of the path element has a D attribute, it is a string form, defines the element path. By snap.animate to change it gradually, you can change the shape of the element: var path = Svg.paper.path ("");p ath.attr ({ D: "M" + [P1, p2, p3, P4, P1].join (" L ") +" Z "}); clip (crop) defines the edge of the image, which is displayed only within the range defined by clip (clipping). Can be used on either an element or a set of (g) elements on circle.attr ({ clip:s.rect (+,-a) }); corresponding Clippath element: <circle cx= "cy=" "r=" "fill=" #0000ff "clip-path=" url (' #Si36ohlde5 ') "></circle><defs> <clippath id= "Si36ohlde5" ><rect x= "All" y= "" "Width=" height= "></rect></clipPath>< /defs> rotation, the first parameter is the angle of rotation angel, and if a coordinate is provided, then it is rotated with this coordinate as the center of the circle (default is the element hub): Rect.traNsform ("R" + [angle, 200, 100]); The value of //transform is the string scaled by matrix,translate,rotate, etc., and the last two digits represent the center point of the Zoom, Default to Element Center: transform: "S" + [2, 2, cx1, cy1] Mobile, translate abbreviation: Transform: "T" + [,60] Mask layer is created using mask (you can also put in the object as Alpha mask into the background), the usage and g are similar: Mask.add (s.rect (0, 0, "100%", "100%")). attr ({fill: "#fff"}); Fill the SVG element with white Mask.add (TXT2); This element shape determines the shape of the matte, and the uppercase L or R indicates the absolute coordinates of the offset from the SVG. The lowercase L or R represents the relative coordinates computed by this element of the gradient (which can be understood as a percentage position): Fill: "L (0, 0,.) #000-#f00:25-#fff" //Absolute, from (0,0 ) to 100, 100, from black to 25% position red and then white R (0.5, 0.5, 0.5) #000-#fff //R represents a radial gradient, that is, from the point to the outside, the end parameter Cx,cy,r and (optionally) the focus away from the center Fx,fy Add filter ele.attr to elements ({ filter:s.filter (Snap.filter.blur (10));}); Modify Text properties: Pie.title.attr ({ and nbsp "#text": Pietitle}); viewbox: [0, 0, +, 600]viewbox=]x, y, Width, height " //x: Upper left corner, y: Upper left ordinate, Width: wide, Height: high, that is, select an area, then fill the SVG container with the selected area snap.animate (0, $, function (val) {littlepie.attr ({d: "M" + [Pie.cx, pie.cy] + "U" + [PIE.R/2, 90-val, + val] //this U-command does not find information, make pie-like chart see}00);}, 1000);
SVG snap notes
