Adds event handler for click for the element.
+Adds a click event handler to the element
- handler
function
handler for the event
Returns: object Element
-
-Creates clone of the element and inserts it after the element.
+
+Creates a clone of the element and inserts it after the element
Returns: Element the clone
-
Element.data(key, [value])⚓➭
-Adds or retrieves given value asociated with given key.
+
Element.data(key, [value])⚓➭
+Adds or retrieves given value associated with given key
See also Element.removeData
Element.dblclick(handler)⚓➭
-Adds event handler for double click for the element.
+Adds a double click event handler to the element
- handler
function
handler for the event
Returns: object Element
-
Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])⚓➭
-Adds event handlers for drag of the element.
+
Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])⚓➭
+Adds event handlers for an element's drag gesture
- onmove
function
@@ -184,17 +184,17 @@ See also Element.removeData
object
context for drag end handler
-
Additionaly following drag
events will be triggered: drag.start.<id>
on start,
-drag.end.<id>
on end and drag.move.<id>
on every move. When element will be dragged over another element
-drag.over.<id>
will be fired as well.
+
Additionaly following drag
events are triggered: drag.start.<id>
on start,
+drag.end.<id>
on end and drag.move.<id>
on every move. When element is dragged over another element
+drag.over.<id>
fires as well.
-
Start event and start handler will be called in specified context or in context of the element with following parameters:
+
Start event and start handler are called in specified context or in context of the element with following parameters:
- xnumberx position of the mouse
- ynumbery position of the mouse
- eventobjectDOM event object
-
Move event and move handler will be called in specified context or in context of the element with following parameters:
+
Move event and move handler are called in specified context or in context of the element with following parameters:
- dxnumbershift by x from the start point
- dynumbershift by y from the start point
@@ -202,12 +202,12 @@ See also Element.removeData
- ynumbery position of the mouse
- eventobjectDOM event object
-
End event and end handler will be called in specified context or in context of the element with following parameters:
+
End event and end handler are called in specified context or in context of the element with following parameters:
- eventobjectDOM event object
Returns: object Element
-
Adds event handlers for drag of the element.
+
Adds event handlers for an element's drag gesture
- onmove
function
@@ -231,17 +231,17 @@ See also Element.removeData
object
context for drag end handler
-
Additionaly following drag
events will be triggered: drag.start.<id>
on start,
-drag.end.<id>
on end and drag.move.<id>
on every move. When element will be dragged over another element
-drag.over.<id>
will be fired as well.
+
Additionaly following drag
events are triggered: drag.start.<id>
on start,
+drag.end.<id>
on end and drag.move.<id>
on every move. When element is dragged over another element
+drag.over.<id>
fires as well.
-
Start event and start handler will be called in specified context or in context of the element with following parameters:
+
Start event and start handler are called in specified context or in context of the element with following parameters:
- xnumberx position of the mouse
- ynumbery position of the mouse
- eventobjectDOM event object
-
Move event and move handler will be called in specified context or in context of the element with following parameters:
+
Move event and move handler are called in specified context or in context of the element with following parameters:
- dxnumbershift by x from the start point
- dynumbershift by y from the start point
@@ -249,13 +249,13 @@ See also Element.removeData
- ynumbery position of the mouse
- eventobjectDOM event object
-
End event and end handler will be called in specified context or in context of the element with following parameters:
+
End event and end handler are called in specified context or in context of the element with following parameters:
- eventobjectDOM event object
Returns: object Element
-
-Returns bounding box descriptor for the given element.
+
+Returns the bounding box descriptor for the given element
Returns: object bounding box descriptor:
- {
- cx:numberx of the center,
@@ -263,46 +263,46 @@ See also Element.removeData
- h:numberheight,
- height:numberheight,
- path:stringpath command for the box,
-
- r0:numberradius of the circle that will enclose the box,
+
- r0:numberradius of a circle that fully encloses the box,
- r1:numberradius of the smallest circle that can be enclosed,
-
- r2:numberradius of the biggest circle that can be enclosed,
+
- r2:numberradius of the largest circle that can be enclosed,
- vb:stringbox as a viewbox command,
- w:numberwidth,
- width:numberwidth,
- x2:numberx of the right side,
- x:numberx of the left side,
-
- y2:numbery of the right side,
-
- y:numbery of the left side
+
- y2:numbery of the bottom edge,
+
- y:numbery of the top edge
- }
-
Element.getPointAtLength(length)⚓➭
-Return coordinates of the point located at the given length on the given path. Only works for element of “path” type.
+
Element.getPointAtLength(length)⚓➭
+Returns coordinates of the point located at the given length on the given path (only works for path
elements)
- length
number
-
+length, in pixels, from the start of the path, excluding non-rendering jumps
Returns: object representation of the point:
-
- {
- x:numberx coordinate
-
- y:numbery coordinate
+
- {
- x:numberx coordinate,
+
- y:numbery coordinate,
- alpha:numberangle of derivative
- }
-
Element.getSubpath(from, to)⚓➭
-Return subpath of a given element from given length to given length. Only works for element of “path” type.
+
Element.getSubpath(from, to)⚓➭
+Returns subpath of a given element from given start and end lengths (only works for path
elements)
- from
number
-position of the start of the segment
+length, in pixels, from the start of the path to the start of the segment
- to
number
-position of the end of the segment
+length, in pixels, from the start of the path to the end of the segment
-
Returns: string pathstring for the segment
+
Returns: string path string definition for the segment
Element.getTotalLength()⚓➭
-Returns length of the path in pixels. Only works for element of “path” type.
+Returns the length of the path in pixels (only works for path
elements)
-
Returns: number length.
+
Returns: number length
Element.hover(f_in, f_out, [icontext], [ocontext])⚓➭
-Adds event handlers for hover for the element.
+Adds hover event handlers to the element
- f_in
function
@@ -320,37 +320,37 @@ See also Element.removeData
context for hover out handler
Returns: object Element
-
-Returns an array of animations element currently in
+
+Returns a set of animations that may be able to manipulate the current element
-
Returns: object in format
+
Returns: object in format:
- {
- animobjectanimation object,
- curStatusnumber0..1 — status of the animation: 0 — just started, 1 — just finished,
- statusfunctiongets or sets the status of the animation,
- stopfunctionstops the animation
- }
-
-Returns SVG code of the element. Equivalent to innerHTML
in HTML context.
+
+Returns SVG code for the element's contents, equivalent to HTML's innerHTML
-
Returns: string SVG code of the element.
-
Element.insertAfter(el)⚓➭
-Inserts the element after the given one.
+
Returns: string SVG code for the element
+
Element.insertAfter(el)⚓➭
+Inserts the element after the given one
- el
Element
element next to whom insert to
-
Returns: Element parent
-
Element.insertBefore(el)⚓➭
-Inserts the element after the given one.
+
Returns: Element the parent element
+
Element.insertBefore(el)⚓➭
+Inserts the element after the given one
- el
Element
element next to whom insert to
-
Returns: Element parent
-
Element.marker(x, y, width, height, refX, refY)⚓➭
-Creates <marker>
element from the current element.
+
Returns: Element the parent element
+
Element.marker(x, y, width, height, refX, refY)⚓➭
+Creates a <marker>
element from the current element
To create a marker you have to specify the bounding rect and reference point:
- x
@@ -372,11 +372,11 @@ To create a marker you have to specify the bounding rect and reference point:
number
-
Returns: Element <marker>
element
-
You can use pattern later on as an argument for marker-start
or marker-end
attributes.
+
Returns: Element the <marker>
element
+
You can specify the marker later as an argument for marker-start
, marker-end
, marker-mid
, and marker
attributes. The marker
attribute places the marker at every point along the path, and marker-mid
places them at every point except the start and end.
Element.mousedown(handler)⚓➭
-Adds event handler for mousedown for the element.
+Adds a mousedown event handler to the element
- handler
function
@@ -384,7 +384,7 @@ To create a marker you have to specify the bounding rect and reference point:
Returns: object Element
Element.mousemove(handler)⚓➭
-Adds event handler for mousemove for the element.
+Adds a mousemove event handler to the element
- handler
function
@@ -392,7 +392,7 @@ To create a marker you have to specify the bounding rect and reference point:
Returns: object Element
Element.mouseout(handler)⚓➭
-Adds event handler for mouseout for the element.
+Adds a mouseout event handler to the element
- handler
function
@@ -400,7 +400,7 @@ To create a marker you have to specify the bounding rect and reference point:
Returns: object Element
Element.mouseover(handler)⚓➭
-Adds event handler for mouseover for the element.
+Adds a mouseover event handler to the element
- handler
function
@@ -408,19 +408,19 @@ To create a marker you have to specify the bounding rect and reference point:
Returns: object Element
Element.mouseup(handler)⚓➭
-Adds event handler for mouseup for the element.
+Adds a mouseup event handler to the element
- handler
function
handler for the event
Returns: object Element
-
-Returns parent of the element
+
+Returns the element's parent
-
Returns: Element parent
-
Element.pattern(x, y, width, height)⚓➭
-Creates <pattern>
element from the current element.
+
Returns: Element the parent element
+
Element.pattern(x, y, width, height)⚓➭
+Creates a <pattern>
element from the current element
To create a pattern you have to specify the pattern rect:
- x
@@ -436,7 +436,7 @@ To create a pattern you have to specify the pattern rect:
string number
-
Returns: Element <pattern>
element
+
Returns: Element the <pattern>
element
You can use pattern later on as an argument for fill
attribute:
var p = paper.path("M10-5-10,15M15,0,0,15M0-5-20,15").attr({
@@ -449,19 +449,19 @@ c.attr({
fill: p
});
-
-Prepends given element to current one.
+
+Prepends the given element to the current one
- el
Element
element to prepend
-
Returns: Element parent
-
+Returns: Element the parent element
+
Removes element from the DOM
-
Returns: Element removed element
-
Element.removeData([key])⚓➭
+Returns: Element the detached element
+
Element.removeData([key])⚓➭
Removes value associated with an element by given key.
If key is not provided, removes all the data of the element.
@@ -471,39 +471,39 @@ If key is not provided, removes all the data of the element.
key
Returns: object Element
-
-Applies CSS selector with the element as a parent and returns the result as an Element.
+
+Gathers the nested Element matching the given set of CSS selectors
- query
string
CSS selector
Returns: Element result of query selection
-
Element.selectAll(query)⚓➭
-Applies CSS selector with the element as a parent and returns the result as a set or array of elements.
+
Element.selectAll(query)⚓➭
+Gathers nested Element objects matching the given set of CSS selectors
- query
string
CSS selector
Returns: Set array result of query selection
-
-Stops all the animations of the current element.
+
+Stops all the animations for the current element
-
Returns: Element the element
-
-Moves element to the relative <defs>
section.
+
Returns: Element the current element
+
+Moves element to the shared <defs>
area
Returns: Element the clone
-
-Returns SVG code of the element. Equivalent to outerHTML
in HTML context.
+
+Returns SVG code for the element, equivalent to HTML's outerHTML
-
Returns: string SVG code of the element.
-
Returns SVG code of the Paper.
+
Returns: string SVG code for the element
+
Returns SVG code for the Paper
-
Returns: string SVG code of the Paper.
+
Returns: string SVG code for the Paper
Element.touchcancel(handler)⚓➭
-Adds event handler for touchcancel for the element.
+Adds a touchcancel event handler to the element
- handler
function
@@ -511,7 +511,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.touchend(handler)⚓➭
-Adds event handler for touchend for the element.
+Adds a touchend event handler to the element
- handler
function
@@ -519,7 +519,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.touchmove(handler)⚓➭
-Adds event handler for touchmove for the element.
+Adds a touchmove event handler to the element
- handler
function
@@ -527,21 +527,21 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.touchstart(handler)⚓➭
-Adds event handler for touchstart for the element.
+Adds a touchstart event handler to the element
- handler
function
handler for the event
Returns: object Element
-
+
Gets or sets transformation of the element
- tstr
string
transform string in Snap or SVG format
-
Returns: Element
+
Returns: Element the current element
or
Returns: object transformation descriptor:
@@ -554,7 +554,7 @@ If key is not provided, removes all the data of the element.
toStringfunctionreturns string
property
}
Element.unclick(handler)⚓➭
-Removes event handler for click for the element.
+Removes a click event handler from the element
- handler
function
@@ -562,18 +562,18 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.undblclick(handler)⚓➭
-Removes event handler for double click for the element.
+Removes a double click event handler from the element
- handler
function
handler for the event
Returns: object Element
-
-Removes all drag event handlers from given element.
+
+Removes all drag event handlers from the given element
Element.unhover(f_in, f_out)⚓➭
-Removes event handlers for hover for the element.
+Removes hover event handlers from the element
- f_in
function
@@ -584,7 +584,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.unmousedown(handler)⚓➭
-Removes event handler for mousedown for the element.
+Removes a mousedown event handler from the element
- handler
function
@@ -592,7 +592,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.unmousemove(handler)⚓➭
-Removes event handler for mousemove for the element.
+Removes a mousemove event handler from the element
- handler
function
@@ -600,7 +600,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.unmouseout(handler)⚓➭
-Removes event handler for mouseout for the element.
+Removes a mouseout event handler from the element
- handler
function
@@ -608,7 +608,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.unmouseover(handler)⚓➭
-Removes event handler for mouseover for the element.
+Removes a mouseover event handler from the element
- handler
function
@@ -616,7 +616,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.unmouseup(handler)⚓➭
-Removes event handler for mouseup for the element.
+Removes a mouseup event handler from the element
- handler
function
@@ -624,7 +624,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.untouchcancel(handler)⚓➭
-Removes event handler for touchcancel for the element.
+Removes a touchcancel event handler from the element
- handler
function
@@ -632,7 +632,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.untouchend(handler)⚓➭
-Removes event handler for touchend for the element.
+Removes a touchend event handler from the element
- handler
function
@@ -640,7 +640,7 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.untouchmove(handler)⚓➭
-Removes event handler for touchmove for the element.
+Removes a touchmove event handler from the element
- handler
function
@@ -648,27 +648,27 @@ If key is not provided, removes all the data of the element.
Returns: object Element
Element.untouchstart(handler)⚓➭
-Removes event handler for touchstart for the element.
+Removes a touchstart event handler from the element
- handler
function
handler for the event
Returns: object Element
-
-Creates <use>
element linked to the current element.
+
+Creates a <use>
element linked to the current element
-
Returns: Element <use>
element
+
Returns: Element the <use>
element
-
+
+
-
-Adds given matrix to existing one.
+
+Adds the given matrix to existing one
- a
number
@@ -695,47 +695,47 @@ If key is not provided, removes all the data of the element.
object
Matrix
-
-Returns copy of the matrix
+
+Returns a copy of the matrix
Returns: object Matrix
-
-Returns inverted version of the matrix
+
+Returns an inverted version of the matrix
Returns: object Matrix
-
+
Rotates the matrix
- a
number
-
+angle of rotation, in degrees
- x
number
-
+horizontal origin point from which to rotate
- y
number
-
+vertical origin point from which to rotate
-
Matrix.scale(x, [y], [cx], [cy])⚓➭
+
Matrix.scale(x, [y], [cx], [cy])⚓➭
Scales the matrix
- x
number
-
+amount to be scaled, with 1
resulting in no change
- y
optional
number
-
+amount to scale along the vertical axis. (Otherwise x
applies to both axes.)
- cx
optional
number
-
+horizontal origin point from which to scale
- cy
optional
number
-
+vertical origin point from which to scale
-
+
Splits matrix into primitive transformations
Returns: object in format:
@@ -747,22 +747,22 @@ If key is not provided, removes all the data of the element.
rotatenumberrotation in deg
isSimplebooleancould it be represented via simple transformations
-
-Return transform string that represents given matrix
+
+Returns transform string that represents given matrix
Returns: string transform string
-
+
Translate the matrix
- x
number
-
+horizontal offset distance
- y
number
-
+vertical offset distance
-
-Return x coordinate for given point after transformation described by the matrix. See also Matrix.y
+
+Returns x coordinate for given point after transformation described by the matrix. See also Matrix.y
- x
number
@@ -772,8 +772,8 @@ If key is not provided, removes all the data of the element.
Returns: number x
-
-Return y coordinate for given point after transformation described by the matrix. See also Matrix.x
+
+Returns y coordinate for given point after transformation described by the matrix. See also Matrix.x
- x
number
@@ -784,8 +784,8 @@ If key is not provided, removes all the data of the element.
Returns: number y
-
-Draws a circle.
+
+Draws a circle
- x
number
@@ -797,11 +797,11 @@ If key is not provided, removes all the data of the element.
number
radius
-
Returns: object Element object with type “circle”
+
Returns: object the circle
element
Usage
var c = paper.circle(50, 50, 40);
-
-Creates element on paper with a given name and no attributes.
+
+Creates an element on paper with a given name and no attributes
- name
string
@@ -810,7 +810,7 @@ If key is not provided, removes all the data of the element.
object
attributes
-
Returns: Element the element
+
Returns: Element the current element
Usage
var c = paper.circle(10, 10, 10); // is the same as...
var c = paper.el("circle").attr({
cx: 10,
@@ -818,8 +818,8 @@ var c = paper.el("circle").attr({
r: 10
});
-
Paper.ellipse(x, y, rx, ry)⚓➭
-Paper.ellipse(x, y, rx, ry)⚓➭
+Draws an ellipse
- x
number
@@ -834,36 +834,36 @@ var c = paper.el("circle").attr({
number
vertical radius
-
Returns: object Element object with type “ellipse”
+
Returns: object the ellipse
element
Usage
var c = paper.ellipse(50, 50, 40, 20);
-
-
+Creates a <filter>
element
- filstr
string
-SVG fragment of filter provided as a string.
+SVG fragment of filter provided as a string
Returns: object Element
-
Note: It is recommended to use filters embedded into page inside empty SVG element.
+
Note: It is recommended to use filters embedded into the page inside an empty SVG element.
Usage
var f = paper.filter('<feGaussianBlur stdDeviation="2"/>'),
c = paper.circle(10, 10, 10).attr({
filter: f
});
-
-
+Creates a group element
- varargs
optional
…
-elements
+elements to nest within the group
-
Returns: object Element object with type “g”
+
Returns: object the g
element
Usage
var c1 = paper.circle(),
c2 = paper.rect(),
- g = paper.g(c2, c1); // note that the order of elements will be different
+ g = paper.g(c2, c1); // note that the order of elements is different
or
@@ -872,59 +872,64 @@ var c = paper.el("circle").attr({
g = paper.g();
g.add(c2, c1);
-
Paper.gradient(gradient)⚓➭
-Creates a gradient element.
+
Paper.gradient(gradient)⚓➭
+Creates a gradient element
- gradient
string
gradient descriptor
-
Gradient Descriptor
Gradient descriptor consists of <type>(<coords>)<colors>
. Type
-could be linear or radial, which presented as letter “L” or “R”. Any
-type could be absolute or relative, absolute gradient take it coords
-relative to the SVG surface, while relative takes them relative to
-the bounding box of the element it applied to. For absolute
-coordinates you specify type as an upper case letter (“L” or “R”).
-For relative use low case letter (“l” or “r”). Coordinates specify
-vector of gradient for linear as x1, y1, x2, y2. For radial as cx,
-cy, r and optional fx, fy. Colors are list of dash separated colors.
-Optionally color could have offset after colon.
+
Gradient Descriptor
The gradient descriptor is an expression formatted as
+follows: <type>(<coords>)<colors>
. The <type>
can be
+either linear or radial. The uppercase L
or R
letters
+indicate absolute coordinates offset from the SVG surface.
+Lowercase l
or r
letters indicate coordinates
+calculated relative to the element to which the gradient is
+applied. Coordinates specify a linear gradient vector as
+x1
, y1
, x2
, y2
, or a radial gradient as cx
, cy
,
+r
and optional fx
, fy
specifying a focal point away
+from the center of the circle. Specify <colors>
as a list
+of dash-separated CSS color values. Each color may be
+followed by a custom offset value, separated with a colon
+character.
-
Example
var g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff");
+Examples
Linear gradient, relative from top-left corner to bottom-right
+corner, from black through red to white:
+
+var g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff");
-Linear gradient, relative from top-left corner to bottom-right
-corner, from black through red to white.
+
Linear gradient, absolute from (0, 0) to (100, 100), from black
+through red at 25% to white:
var g = paper.gradient("L(0, 0, 100, 100)#000-#f00:25%-#fff");
-Linear gradient, absolute from (0, 0) to (100, 100), from black
-through red at 25% to white.
+
Radial gradient, relative from the center of the element with radius
+half the width, from black to white:
var g = paper.gradient("r(0.5, 0.5, 0.5)#000-#fff");
-Radial gradient, relative from the center of the element with radius
-0.5 of the width, from black to white.
+
To apply the gradient:
paper.circle(50, 50, 40).attr({
fill: g
});
-Returns: object Element object with type “gradient”
-
+Returns: object the gradient
element
+
Paper.image(src, x, y, width, height)⚓➭
-Embeds an image into the surface.
+
Paper.image(src, x, y, width, height)⚓➭
+Places an image on the surface
- src
string
URI of the source image
- x
number
-x coordinate position
+x offset position
- y
number
-y coordinate position
+y offset position
- width
number
width of the image
@@ -932,32 +937,14 @@ through red at 25% to white.
number
height of the image
-
Returns: object Raphaël element object with type “image”
-
Usage
var c = paper.image("apple.png", 10, 10, 80, 80);
-
-
Embeds an image into the surface.
+
Returns: object the image
element
+
or
-
- src
-string
-URI of the source image
-- x
-number
-x coordinate position
-- y
-number
-y coordinate position
-- width
-number
-width of the image
-- height
-number
-height of the image
-
-
Returns: object Element object with type “image”
+
Returns: object Raphaël element object with type image
Usage
var c = paper.image("apple.png", 10, 10, 80, 80);
-
Paper.line(x1, y1, x2, y2)⚓➭
-Paper.line(x1, y1, x2, y2)⚓➭
+Draws a line
- x1
number
@@ -972,22 +959,22 @@ through red at 25% to white.
number
y coordinate position of the end
-
Returns: object Element object with type “line”
+
Returns: object the line
element
Usage
var t1 = paper.line(50, 50, 100, 100);
-
Paper.path([pathString])⚓➭
-Creates a path element by given path data string.
+
Paper.path([pathString])⚓➭
+Creates a <path>
element using the given string as the path's definition
- pathString
optional
string
-path string in SVG format.
+path string in SVG format
-
Path string consists of one-letter commands, followed by comma seprarated arguments in numercal form. Example:
+
Path string consists of one-letter commands, followed by comma seprarated arguments in numerical form. Example:
-
Here we can see two commands: “M”, with arguments (10, 20)
and “L” with arguments (30, 40)
. Upper case letter mean command is absolute, lower case—relative.
+
This example features two commands: M
, with arguments (10, 20)
and L
with arguments (30, 40)
. Uppercase letter commands express coordinates in absolute terms, while lowercase commands express them in relative terms from the most recently declared coordinates.
Here is short list of commands available, for more details see SVG path string format or article about path strings at MDN.
@@ -1003,18 +990,18 @@ through red at 25% to white.
T | smooth quadratic Bézier curveto | (x y)+ |
A | elliptical arc | (rx ry x-axis-rotation large-arc-flag sweep-flag x y)+ |
R | Catmull-Rom curveto* | x1 y1 (x y)+ |
-
“Catmull-Rom curveto” is a not standard SVG command and added to make life easier.
-Note: there is a special case when path consist of just three commands: “M10,10R…z”. In this case path will smoothly connects to its beginning.
+
Catmull-Rom curveto is a not standard SVG command and added to make life easier.
+Note: there is a special case when a path consists of only three commands:
M10,10R…z
. In this case the path connects back to its starting point.
Usage
var c = paper.path("M10 10L90 90");
// draw a diagonal line:
// move to 10,10, line to 90,90
-
+
-
+Draws a polyline
- points
array
@@ -1026,13 +1013,13 @@ Note: there is a special case when path consist of just three commands: “M10,1
…
points
-
Returns: object Element object with type “text”
+
Returns: object the polyline
element
Usage
var p1 = paper.polyline([10, 10, 100, 100]);
var p2 = paper.polyline(10, 10, 100, 100);
-
Paper.rect(x, y, width, height, [rx], [ry])⚓➭
+
Paper.rect(x, y, width, height, [rx], [ry])⚓➭
-
Draws a rectangle.
+
Draws a rectangle
- x
number
@@ -1049,20 +1036,20 @@ var p2 = paper.polyline(10, 10, 100, 100);
- rx
optional
number
-horisontal radius for rounded corners, default is 0
+horizontal radius for rounded corners, default is 0
- ry
optional
number
vertical radius for rounded corners, default is rx or 0
-
Returns: object Element object with type “rect”
+
Returns: object the rect
element
Usage
// regular rectangle
var c = paper.rect(10, 10, 50, 50);
// rectangle with rounded corners
var c = paper.rect(40, 40, 50, 50, 10);
-
-
+Draws a text string
- x
number
@@ -1072,22 +1059,22 @@ var c = paper.rect(40, 40, 50, 50, 10);
y coordinate position
- text
string array
-The text string to draw or array of <tspan>s
+The text string to draw or array of strings to nest within separate <tspan>
elements
-
Returns: object Element object with type “text”
+
Returns: object the text
element
Usage
var t1 = paper.text(50, 50, "Snap");
var t2 = paper.text(50, 50, ["S","n","a","p"]);
-
-Returns SVG code of the element. Equivalent to outerHTML
in HTML context.
+
+Returns SVG code for the element, equivalent to HTML's outerHTML
-
Returns: string SVG code of the element.
-
Returns SVG code of the Paper.
+
Returns: string SVG code for the element
+
Returns SVG code for the Paper
-
Returns: string SVG code of the Paper.
+
Returns: string SVG code for the Paper
-Removeds all elements from the set
+Removes all elements from the set
Removes given element from the set
@@ -1096,11 +1083,11 @@ var t2 = paper.text(50, 50, ["S","n","a","p"]);
object
element to remove
-Returns: boolean true
if object was found & removed from the set
+Returns: boolean true
if object was found and removed from the set
Set.forEach(callback, thisArg)⚓➭
-Executes given function for each element in the set.
+Executes given function for each element in the set
-
If function returns false
it will stop loop running.
+
If the function returns false
, the loop stops running.
- callback
function
@@ -1111,15 +1098,15 @@ var t2 = paper.text(50, 50, ["S","n","a","p"]);
Returns: object Set object
-Removes last element and returns it.
+Removes last element and returns it
Returns: object element
-Adds each argument to the current set.
+Adds each argument to the current set
Returns: object original element
Set.splice(index, count, [insertion…])⚓➭
-Removes given element from the set
+Removes range of elements from the set
- index
number
@@ -1134,9 +1121,9 @@ var t2 = paper.text(50, 50, ["S","n","a","p"]);
Returns: object set elements that were deleted
-
+
Utility method
-Returns matrix based on given parameters.
+Returns a matrix based on the given parameters
- a
number
@@ -1164,8 +1151,8 @@ Returns matrix based on given parameters.
Returns: object Matrix
-
-Simple implementation of Ajax.
+
+Simple implementation of Ajax
- url
string
@@ -1194,9 +1181,9 @@ Returns matrix based on given parameters.
object
scope of callback
-
Returns: XMLHttpRequest XMLHttpRequest (just in case)
-
Snap.angle(x1, y1, x2, y2, [x3], [y3])⚓➭
-Returns angle between two or three points.
+
Returns: XMLHttpRequest the XMLHttpRequest object, just in case
+
Snap.angle(x1, y1, x2, y2, [x3], [y3])⚓➭
+Returns an angle between two or three points
Parameters
- x1
number
@@ -1219,9 +1206,9 @@ Returns matrix based on given parameters.
number
y coord of third point
-
Returns: number angle in degrees.
-
Snap.animate(from, to, setter, ms, [easing], [callback])⚓➭
-Runs generic animation of one number into another with a caring function.
+
Returns: number angle in degrees
+
Snap.animate(from, to, setter, duration, [easing], [callback])⚓➭
+Runs generic animation of one number into another with a caring function
- from
number array
@@ -1231,10 +1218,10 @@ Returns matrix based on given parameters.
number or array of numbers
- setter
function
-caring function that will take one number argument
-- ms
+caring function that accepts one number argument
+- duration
number
-duration
+duration, in milliseconds
- easing
optional
function
@@ -1242,7 +1229,7 @@ Returns matrix based on given parameters.
- callback
optional
function
-
+callback function to execute when animation ends
Returns: object animation object in mina format
- {
- idstringanimation id, consider it read-only,
@@ -1252,15 +1239,15 @@ Returns matrix based on given parameters.
- statusfunctiongets or sets the status of the animation,
- stopfunctionstops the animation
- }
-
Snap.animation(attr, ms, [easing], [callback])⚓➭
-Creates animation object.
+
Snap.animation(attr, duration, [easing], [callback])⚓➭
+Creates an animation object
- attr
object
attributes of final destination
-- ms
+
- duration
number
-animation duration
+duration of the animation, in milliseconds
- easing
optional
function
@@ -1268,46 +1255,46 @@ Returns matrix based on given parameters.
- callback
optional
function
-callback
+callback function that fires when animation ends
Returns: object animation object
-
-Parses the color string and returns object with all values for the given color.
+
+Parses the color string and returns an object featuring the color's component values
- clr
string
color string in one of the supported formats (see Snap.getRGB)
-
Returns: object Combined RGB & HSB object in format:
+
Returns: object Combined RGB/HSB object in the following format:
- {
- rnumberred,
- gnumbergreen,
- bnumberblue,
- hexstringcolor in HTML/CSS format: #••••••,
-
- errorboolean
true
if string cant be parsed,
+ - errorboolean
true
if string can't be parsed,
- hnumberhue,
- snumbersaturation,
- vnumbervalue (brightness),
- lnumberlightness
- }
-
+
Transform angle to degrees
-
- deg
+
- rad
number
angle in radians
-Returns: number angle in degrees.
+Returns: number angle in degrees
-Snap.filter.blur(x, [y])⚓➭
-Returns string of the blur filter.
+Snap.filter.blur(x, [y])⚓➭
+Returns an SVG markup string for the blur filter
- x
number
-amount of horisontal blur in px.
+amount of horizontal blur, in pixels
- y
optional
number
-amount of vertical blur in px.
+amount of vertical blur, in pixels
Returns: string filter representation
Usage
var f = paper.filter(Snap.filter.blur(5, 10)),
@@ -1315,79 +1302,79 @@ Returns matrix based on given parameters.
filter: f
});
-
Snap.filter.brightness(amount)⚓➭
-Returns string of the brightness filter.
+
Snap.filter.brightness(amount)⚓➭
+Returns an SVG markup string for the brightness filter
- amount
number
-amount of filter (
0..1
).
+amount of filter (0..1
)
Returns: string filter representation
-
Snap.filter.contrast(amount)⚓➭
-Returns string of the contrast filter.
+
Snap.filter.contrast(amount)⚓➭
+Returns an SVG markup string for the contrast filter
- amount
number
-amount of filter (
0..1
).
+amount of filter (0..1
)
Returns: string filter representation
-
Snap.filter.grayscale(amount)⚓➭
-Returns string of the grayscale filter.
+
Snap.filter.grayscale(amount)⚓➭
+Returns an SVG markup string for the grayscale filter
- amount
number
-amount of filter (
0..1
).
+amount of filter (0..1
)
Returns: string filter representation
-
Snap.filter.hueRotate(angle)⚓➭
-Returns string of the hue-rotate filter.
+
Snap.filter.hueRotate(angle)⚓➭
+Returns an SVG markup string for the hue-rotate filter
- angle
number
-angle of rotation.
+angle of rotation
Returns: string filter representation
-
Snap.filter.invert(amount)⚓➭
-Returns string of the invert filter.
+
Snap.filter.invert(amount)⚓➭
+Returns an SVG markup string for the invert filter
- amount
number
-amount of filter (
0..1
).
+amount of filter (0..1
)
Returns: string filter representation
-
Snap.filter.saturate(amount)⚓➭
-Returns string of the saturate filter.
+
Snap.filter.saturate(amount)⚓➭
+Returns an SVG markup string for the saturate filter
- amount
number
-amount of filter (
0..1
).
+amount of filter (0..1
)
Returns: string filter representation
-
Snap.filter.sepia(amount)⚓➭
-Returns string of the sepia filter.
+
Snap.filter.sepia(amount)⚓➭
+Returns an SVG markup string for the sepia filter
- amount
number
-amount of filter (
0..1
).
+amount of filter (0..1
)
Returns: string filter representation
-
Snap.filter.shadow(dx, dy, [blur], [color])⚓➭
-Returns string of the shadow filter.
+
Snap.filter.shadow(dx, dy, [blur], [color])⚓➭
+Returns an SVG markup string for the shadow filter
- dx
number
-horisontal shift of the shadow in px.
+horizontal shift of the shadow, in pixels
- dy
number
-vertical shift of the shadow in px.
+vertical shift of the shadow, in pixels
- blur
optional
number
-amount of blur.
+amount of blur
- color
optional
string
-color of the shadow.
+color of the shadow
Returns: string filter representation
Usage
var f = paper.filter(Snap.filter.shadow(0, 2, 3)),
@@ -1395,18 +1382,18 @@ Returns matrix based on given parameters.
filter: f
});
-
-Replaces construction of type “{<name>}
” to the corresponding argument.
+
+Replaces construction of type {<name>}
to the corresponding argument
- token
string
string to format
- json
object
-object which properties will be used as a replacement
+object which properties are used as a replacement
-
Returns: string formated string
-
Usage
// this will draw a rectangular shape equivalent to "M10,20h40v50h-40z"
+Returns: string formatted string
+Usage
// this draws a rectangular shape equivalent to "M10,20h40v50h-40z"
paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", {
x: 10,
y: 20,
@@ -1417,49 +1404,49 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
}
}));
-
-Creates DOM fragment from given list of elements or strings
+
+Creates a DOM fragment from a given list of elements or strings
Returns: Fragment the Fragment
-
-Parses colour string as RGB object
+
+Parses color string as RGB object
-
- colour
+
- color
string
-colour string in one of formats:
+color string in one of the following formats:
- - Colour name (“
red
”, “green
”, “cornflowerblue
”, etc)
- - #••• — shortened HTML colour: (“
#000
”, “#fc0
”, etc)
- - #•••••• — full length HTML colour: (“
#000000
”, “#bd2300
”)
- - rgb(•••, •••, •••) — red, green and blue channels values: (“
rgb(200, 100, 0)
”)
+ - Color name (
red
, green
, cornflowerblue
, etc)
+ - #••• — shortened HTML color: (
#000
, #fc0
, etc.)
+ - #•••••• — full length HTML color: (
#000000
, #bd2300
)
+ - rgb(•••, •••, •••) — red, green and blue channels values: (
rgb(200, 100, 0)
)
- rgba(•••, •••, •••, •••) — also with opacity
- - rgb(•••%, •••%, •••%) — same as above, but in %: (“
rgb(100%, 175%, 0%)
”)
+ - rgb(•••%, •••%, •••%) — same as above, but in %: (
rgb(100%, 175%, 0%)
)
- rgba(•••%, •••%, •••%, •••%) — also with opacity
- - hsb(•••, •••, •••) — hue, saturation and brightness values: (“
hsb(0.5, 0.25, 1)
”)
+ - hsb(•••, •••, •••) — hue, saturation and brightness values: (
hsb(0.5, 0.25, 1)
)
- hsba(•••, •••, •••, •••) — also with opacity
- hsb(•••%, •••%, •••%) — same as above, but in %
- hsba(•••%, •••%, •••%, •••%) — also with opacity
- - hsl(•••, •••, •••) — hue, saturation and luminosity values: (“
hsb(0.5, 0.25, 0.5)
”)
+ - hsl(•••, •••, •••) — hue, saturation and luminosity values: (
hsb(0.5, 0.25, 0.5)
)
- hsla(•••, •••, •••, •••) — also with opacity
- hsl(•••%, •••%, •••%) — same as above, but in %
- hsla(•••%, •••%, •••%, •••%) — also with opacity
Note that %
can be used any time: rgb(20%, 255, 50%)
.
-Returns: object RGB object in format:
+Returns: object RGB object in the following format:
- {
- rnumberred,
- gnumbergreen,
-
- bnumberblue
+
- bnumberblue,
- hexstringcolor in HTML/CSS format: #••••••,
-
- errorbooleantrue if string cant be parsed
+
- errorbooleantrue if string can't be parsed
- }
-
-Converts HSB values to hex representation of the colour.
+
+Converts HSB values to a hex representation of the color
- h
number
@@ -1471,9 +1458,9 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
number
value or brightness
-
Returns: string hex representation of the colour.
-
-Converts HSB values to RGB object.
+
Returns: string hex representation of the color
+
+Converts HSB values to an RGB object
- h
number
@@ -1485,14 +1472,14 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
number
value or brightness
-
Returns: object RGB object in format:
+
Returns: object RGB object in the following format:
- {
- rnumberred,
- gnumbergreen,
- bnumberblue,
- hexstringcolor in HTML/CSS format: #••••••
- }
-
-Converts HSL values to hex representation of the colour.
+
+Converts HSL values to a hex representation of the color
- h
number
@@ -1504,9 +1491,9 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
number
luminosity
-
Returns: string hex representation of the colour.
-
-Converts HSL values to RGB object.
+
Returns: string hex representation of the color
+
+Converts HSL values to an RGB object
- h
number
@@ -1518,25 +1505,25 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
number
luminosity
-
Returns: object RGB object in format:
+
Returns: object RGB object in the following format:
- {
- rnumberred,
- gnumbergreen,
- bnumberblue,
- hexstringcolor in HTML/CSS format: #••••••
- }
-
-Handfull replacement for typeof
operator.
+
+Handy replacement for the typeof
operator
- o
…
any object or primitive
- type
string
-name of the type, i.e. “string”, “function”, “number”, etc.
+name of the type, e.g., string
, function
, number
, etc.
-
Returns: boolean is given value is of given type
-
Snap.load(url, callback, [scope])⚓➭
-Loads external SVG file as a Fragment. For more advanced AJAX see Snap.ajax.
+
Returns: boolean true
if given value is of given type
+
Snap.load(url, callback, [scope])⚓➭
+Loads external SVG file as a Fragment (see Snap.ajax for more advanced AJAX)
- url
string
@@ -1549,36 +1536,36 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
object
scope of callback
-
-Parses SVG fragment and converts it into Fragment.
+
+Parses SVG fragment and converts it into a Fragment
-
Returns: Fragment the fragment
-
Snap.parsePathString(pathString)⚓➭
+Returns: Fragment the Fragment
+Snap.parsePathString(pathString)⚓➭
Utility method
-Parses given path string into an array of arrays of path segments.
+Parses given path string into an array of arrays of path segments
- pathString
string array
-path string or array of segments (in the last case it will be returned straight away)
+path string or array of segments (in the last case it is returned straight away)
-
Returns: array array of segments.
-
+Returns: array array of segments
+
Utility method
-Parses given path string into an array of transformations.
+Parses given transform string into an array of transformations
- TString
string array
-transform string or array of transformations (in the last case it will be returned straight away)
+transform string or array of transformations (in the last case it is returned straight away)
-
Returns: array array of transformations.
+
Returns: array array of transformations
-Snap.path.bezierBBox(…)⚓➭
+Snap.path.bezierBBox(…)⚓➭
Utility method
-Return bounding box of a given cubic bezier curve
+Returns the bounding box of a given cubic beziér curve
- p1x
number
@@ -1609,17 +1596,17 @@ Return bounding box of a given cubic bezier curve
- bez
array
-array of six points for bezier curve
+array of six points for beziér curve
Returns: object point information in format:
-- {
- min: {
- x:numberx coordinate of the left point
+
- {
- min: {
- x:numberx coordinate of the left point,
- y:numbery coordinate of the top point
-
- }
- max: {
- x:numberx coordinate of the right point
+
- },
- max: {
- x:numberx coordinate of the right point,
- y:numbery coordinate of the bottom point
- }
- }
-
Snap.path.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)⚓➭
+Snap.path.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)⚓➭
Utility method
-Find dot coordinates on the given cubic bezier curve at the given t.
+Finds dot coordinates on the given cubic beziér curve at the given t
- p1x
number
@@ -1650,72 +1637,72 @@ Find dot coordinates on the given cubic bezier curve at the given t.
position on the curve (0..1)
Returns: object point information in format:
-
- {
- x:numberx coordinate of the point
-
- y:numbery coordinate of the point
-
- m: {
- x:numberx coordinate of the left anchor
+
- {
- x:numberx coordinate of the point,
+
- y:numbery coordinate of the point,
+
- m: {
- x:numberx coordinate of the left anchor,
- y:numbery coordinate of the left anchor
-
- }
- n: {
- x:numberx coordinate of the right anchor
+
- },
- n: {
- x:numberx coordinate of the right anchor,
- y:numbery coordinate of the right anchor
-
- }
- start: {
- x:numberx coordinate of the start of the curve
+
- },
- start: {
- x:numberx coordinate of the start of the curve,
- y:numbery coordinate of the start of the curve
-
- }
- end: {
- x:numberx coordinate of the end of the curve
+
- },
- end: {
- x:numberx coordinate of the end of the curve,
- y:numbery coordinate of the end of the curve
-
- }
- alpha:numberangle of the curve derivative at the point
+
- },
- alpha:numberangle of the curve derivative at the point
- }
-
Snap.path.getBBox(path)⚓➭
+Snap.path.getBBox(path)⚓➭
Utility method
-Return bounding box of a given path
+Returns the bounding box of a given path
Returns: object bounding box
-
- {
- x:numberx coordinate of the left top point of the box
-
- y:numbery coordinate of the left top point of the box
-
- x2:numberx coordinate of the right bottom point of the box
-
- y2:numbery coordinate of the right bottom point of the box
-
- width:numberwidth of the box
+
- {
- x:numberx coordinate of the left top point of the box,
+
- y:numbery coordinate of the left top point of the box,
+
- x2:numberx coordinate of the right bottom point of the box,
+
- y2:numbery coordinate of the right bottom point of the box,
+
- width:numberwidth of the box,
- height:numberheight of the box
- }
Snap.path.getPointAtLength(path, length)⚓➭
-Return coordinates of the point located at the given length on the given path.
+Returns the coordinates of the point located at the given length along the given path
- path
string
SVG path string
- length
number
-
+length, in pixels, from the start of the path, excluding non-rendering jumps
Returns: object representation of the point:
-
- {
- x:numberx coordinate
-
- y:numbery coordinate
+
- {
- x:numberx coordinate,
+
- y:numbery coordinate,
- alpha:numberangle of derivative
- }
Snap.path.getSubpath(path, from, to)⚓➭
-Return subpath of a given path from given length to given length.
+Returns the subpath of a given path between given start and end lengths
- path
string
SVG path string
- from
number
-position of the start of the segment
+length, in pixels, from the start of the path to the start of the segment
- to
number
-position of the end of the segment
+length, in pixels, from the start of the path to the end of the segment
-
Returns: string pathstring for the segment
+
Returns: string path string definition for the segment
Snap.path.getTotalLength(path)⚓➭
-Returns length of the given path in pixels.
+Returns the length of the given path in pixels
- path
string
-SVG path string.
+SVG path string
-
Returns: number length.
-
Snap.path.intersection(path1, path2)⚓➭
+Returns: number length
+
Snap.path.intersection(path1, path2)⚓➭
Utility method
Finds intersections of two paths
@@ -1727,16 +1714,16 @@ Finds intersections of two paths
path string
Returns: array dots of intersection
-- [
- {
- x:numberx coordinate of the point
-
- y:numbery coordinate of the point
-
- t1:numbert value for segment of path1
-
- t2:numbert value for segment of path2
-
- segment1:numberorder number for segment of path1
-
- segment2:numberorder number for segment of path2
-
- bez1:arrayeight coordinates representing beziér curve for the segment of path1
+
- [
- {
- x:numberx coordinate of the point,
+
- y:numbery coordinate of the point,
+
- t1:numbert value for segment of path1,
+
- t2:numbert value for segment of path2,
+
- segment1:numberorder number for segment of path1,
+
- segment2:numberorder number for segment of path2,
+
- bez1:arrayeight coordinates representing beziér curve for the segment of path1,
- bez2:arrayeight coordinates representing beziér curve for the segment of path2
- }
- ]
-
Snap.path.isBBoxIntersect(bbox1, bbox2)⚓➭
+
Snap.path.isBBoxIntersect(bbox1, bbox2)⚓➭
Utility method
Returns true
if two bounding boxes intersect
@@ -1747,10 +1734,10 @@ Returns
true
if two bounding boxes intersect
string
second bounding box
-Returns: boolean true
if they intersect
-
Snap.path.isPointInside(path, x, y)⚓➭
+Returns: boolean true
if bounding boxes intersect
+
Snap.path.isPointInside(path, x, y)⚓➭
Utility method
-Returns true
if given point is inside a given closed path.
+Returns true
if given point is inside a given closed path
- path
string
@@ -1762,10 +1749,10 @@ Returns
true
if given point is inside a given closed path.
number
y of the point
-
Returns: boolean true, if point is inside the path
-
Snap.path.isPointInsideBBox(bbox, x, y)⚓➭
+Returns: boolean true
if point is inside the path
+
Snap.path.isPointInsideBBox(bbox, x, y)⚓➭
Utility method
-Returns true
if given point is inside bounding box.
+Returns true
if given point is inside bounding box
- bbox
string
@@ -1777,9 +1764,9 @@ Returns
true
if given point is inside bounding box.
string
y coordinate of the point
-
Returns: boolean true
if point inside
-
Snap.path.map(path, matrix)⚓➭
-Transform the path string with given matrix.
+
Returns: boolean true
if point is inside
+
Snap.path.map(path, matrix)⚓➭
+Transform the path string with the given matrix
- path
string
@@ -1789,43 +1776,43 @@ Returns
true
if given point is inside bounding box.
see Matrix
Returns: string transformed path string
-
Snap.path.toAbsolute(path)⚓➭
+
Snap.path.toAbsolute(path)⚓➭
Utility method
-Converts path coordinates into absolute values.
+Converts path coordinates into absolute values
Returns: array path string
-
Snap.path.toCubic(pathString)⚓➭
+
Snap.path.toCubic(pathString)⚓➭
Utility method
-Converts path to a new path where all segments are cubic bezier curves.
+Converts path to a new path where all segments are cubic beziér curves
- pathString
string array
path string or array of segments
-
Returns: array array of segments.
-
Snap.path.toRelative(path)⚓➭
+Returns: array array of segments
+
Snap.path.toRelative(path)⚓➭
Utility method
-Converts path coordinates into relative values.
+Converts path coordinates into relative values
Returns: array path string
-
+
Transform angle to radians
- deg
number
angle in degrees
-
Returns: number angle in radians.
-
-Converts RGB values to hex representation of the colour.
+
Returns: number angle in radians
+
+Converts RGB values to a hex representation of the color
- r
number
@@ -1837,9 +1824,9 @@ Converts path coordinates into relative values.
number
blue
-
Returns: string hex representation of the colour.
-
-Converts RGB values to HSB object.
+
Returns: string hex representation of the color
+
+Converts RGB values to an HSB object
- r
number
@@ -1851,13 +1838,13 @@ Converts path coordinates into relative values.
number
blue
-
Returns: object HSB object in format:
-
- {
- hnumberhue
-
- snumbersaturation
+
Returns: object HSB object in the following format:
+- {
- hnumberhue,
+
- snumbersaturation,
- bnumberbrightness
- }
-
-Converts RGB values to HSL object.
+
+Converts RGB values to an HSL object
- r
number
@@ -1869,29 +1856,29 @@ Converts path coordinates into relative values.
number
blue
-
Returns: object HSL object in format:
-
- {
- hnumberhue
-
- snumbersaturation
+
Returns: object HSL object in the following format:
+- {
- hnumberhue,
+
- snumbersaturation,
- lnumberluminosity
- }
-
-Wraps DOM element specified by CSS selector as Element
+
+Wraps a DOM element specified by CSS selector as Element
- query
string
CSS selector of the element
-
Returns: Element
-
+Returns: Element the current element
+
Wraps DOM elements specified by CSS selector as set or array of Element
- query
string
CSS selector of the element
-
Returns: Element
-
Snap.snapTo(values, value, [tolerance])⚓➭
-Snaps given value to given grid.
+
Returns: Element the current element
+
Snap.snapTo(values, value, [tolerance])⚓➭
+Snaps given value to given grid
- values
array number
@@ -1902,30 +1889,30 @@ Converts path coordinates into relative values.
- tolerance
optional
number
-tolerance for snapping. Default is
10
.
+maximum distance to the target value that would trigger the snap. Default is 10
.
-
Returns: number adjusted value.
-
mina(a, A, b, B, get, set, [easing])⚓➭
-Generic animation of numbers.
+
Returns: number adjusted value
+
mina(a, A, b, B, get, set, [easing])⚓➭
+Generic animation of numbers
- a
number
-start “slave” number
+start slave number
- A
number
-end “slave” number
+end slave number
- b
number
-start “master” number (start time in gereal case)
+start master number (start time in gereal case)
- B
number
-end “master” number (end time in gereal case)
+end master number (end time in gereal case)
- get
function
-getter of “master” number (see mina.time)
+getter of master number (see mina.time)
- set
function
-setter of “slave” number
+setter of slave number
- easing
optional
function
@@ -1933,94 +1920,94 @@ Converts path coordinates into relative values.
Returns: object animation descriptor
- {
- idstringanimation id,
-
- startnumberstart “slave” number,
-
- endnumberend “slave” number,
-
- bnumberstart “master” number,
+
- startnumberstart slave number,
+
- endnumberend slave number,
+
- bnumberstart master number,
- snumberanimation status (0..1),
- durnumberanimation duration,
- spdnumberanimation speed,
-
- getfunctiongetter of “master” number (see mina.time),
-
- setfunctionsetter of “slave” number,
+
- getfunctiongetter of master number (see mina.time),
+
- setfunctionsetter of slave number,
- easingfunctioneasing function, default is mina.linear,
- statusfunctionstatus getter/setter,
- speedfunctionspeed getter/setter,
- durationfunctionduration getter/setter,
- stopfunctionanimation stopper
- }
-
-
+Backin easing
Returns: number output 0..1
-
-
+Backout easing
Returns: number output 0..1
-
-
+Bounce easing
Returns: number output 0..1
-
-
+Easein easing
Returns: number output 0..1
-
-
+Easeinout easing
Returns: number output 0..1
-
-
+Easeout easing
Returns: number output 0..1
-
-
+Elastic easing
Returns: number output 0..1
-
-Returns animation by it’s id.
+
+Returns an animation by its id
- id
string
-animation’s id
+animation's id
Returns: object See mina
-
-
+Default linear easing
Returns: number output 0..1
-
-Returns current time. Equal to
+
+Returns the current time. Equivalent to:
function () {
return (new Date).getTime();
diff --git a/dist/snap.svg-min.js b/dist/snap.svg-min.js
index 8afb21b..406708b 100644
--- a/dist/snap.svg-min.js
+++ b/dist/snap.svg-min.js
@@ -14,7 +14,7 @@
// See the License for the specific language governing permissions and
// limitations under the License.
//
-// build: 2013-10-06
+// build: 2013-10-14
!function(a){var b,c,d="0.4.2",e="hasOwnProperty",f=/[\.\/]/,g="*",h=function(){},i=function(a,b){return a-b},j={n:{}},k=function(a,d){a=String(a);var e,f=c,g=Array.prototype.slice.call(arguments,2),h=k.listeners(a),j=0,l=[],m={},n=[],o=b;b=a,c=0;for(var p=0,q=h.length;q>p;p++)"zIndex"in h[p]&&(l.push(h[p].zIndex),h[p].zIndex<0&&(m[h[p].zIndex]=h[p]));for(l.sort(i);l[j]<0;)if(e=m[l[j++]],n.push(e.apply(d,g)),c)return c=f,n;for(p=0;q>p;p++)if(e=h[p],"zIndex"in e)if(e.zIndex==l[j]){if(n.push(e.apply(d,g)),c)break;do if(j++,e=m[l[j]],e&&n.push(e.apply(d,g)),c)break;while(e)}else m[e.zIndex]=e;else if(n.push(e.apply(d,g)),c)break;return c=f,b=o,n.length?n:null};k._events=j,k.listeners=function(a){var b,c,d,e,h,i,k,l,m=a.split(f),n=j,o=[n],p=[];for(e=0,h=m.length;h>e;e++){for(l=[],i=0,k=o.length;k>i;i++)for(n=o[i].n,c=[n[m[e]],n[g]],d=2;d--;)b=c[d],b&&(l.push(b),p=p.concat(b.f||[]));o=l}return p},k.on=function(a,b){if(a=String(a),"function"!=typeof b)return function(){};for(var c=a.split(f),d=j,e=0,g=c.length;g>e;e++)d=d.n,d=d.hasOwnProperty(c[e])&&d[c[e]]||(d[c[e]]={n:{}});for(d.f=d.f||[],e=0,g=d.f.length;g>e;e++)if(d.f[e]==b)return h;return d.f.push(b),function(a){+a==+a&&(b.zIndex=+a)}},k.f=function(a){var b=[].slice.call(arguments,1);return function(){k.apply(null,[a,null].concat(b).concat([].slice.call(arguments,0)))}},k.stop=function(){c=1},k.nt=function(a){return a?new RegExp("(?:\\.|\\/|^)"+a+"(?:\\.|\\/|$)").test(b):b},k.nts=function(){return b.split(f)},k.off=k.unbind=function(a,b){if(!a)return k._events=j={n:{}},void 0;var c,d,h,i,l,m,n,o=a.split(f),p=[j];for(i=0,l=o.length;l>i;i++)for(m=0;mi;i++)for(c=p[i];c.n;){if(b){if(c.f){for(m=0,n=c.f.length;n>m;m++)if(c.f[m]==b){c.f.splice(m,1);break}!c.f.length&&delete c.f}for(d in c.n)if(c.n[e](d)&&c.n[d].f){var q=c.n[d].f;for(m=0,n=q.length;n>m;m++)if(q[m]==b){q.splice(m,1);break}!q.length&&delete c.n[d].f}}else{delete c.f;for(d in c.n)c.n[e](d)&&c.n[d].f&&delete c.n[d].f}c=c.n}},k.once=function(a,b){var c=function(){return k.unbind(a,c),b.apply(this,arguments)};return k.on(a,c)},k.version=d,k.toString=function(){return"You are running Eve "+d},"undefined"!=typeof module&&module.exports?module.exports=k:"undefined"!=typeof define?define("eve",[],function(){return k}):a.eve=k}(this),function(a,b){"function"==typeof define&&define.amd?define(["eve"],function(c){return b(a,c)}):b(a,a.eve)}(this,function(a,b){var c=function(b){var c={},d=a.requestAnimationFrame||a.webkitRequestAnimationFrame||a.mozRequestAnimationFrame||a.oRequestAnimationFrame||a.msRequestAnimationFrame||function(a){setTimeout(a,16)},e=Array.isArray||function(a){return a instanceof Array||"[object Array]"==Object.prototype.toString.call(a)},f=0,g="M"+(+new Date).toString(36),h=function(){return g+(f++).toString(36)},i=function(){return+new Date},j=function(a){var b=this;if(null==a)return b.s;var c=b.s-a;b.b+=b.dur*c,b.B+=b.dur*c,b.s=a},k=function(a){var b=this;return null==a?b.spd:(b.spd=a,void 0)},l=function(a){var b=this;return null==a?b.dur:(b.s=b.s*a/b.dur,b.dur=a,void 0)},m=function(){var a=this;delete c[a.id],b("mina.stop."+a.id,a)},n=function(){var a=this;a.pdif||(delete c[a.id],a.pdif=a.get()-a.b)},o=function(){var a=this;a.pdif&&(a.b=a.get()-a.pdif,delete a.pdif,c[a.id]=a)},p=function(){var a=0;for(var f in c)if(c.hasOwnProperty(f)){var g,h=c[f],i=h.get();if(a++,h.s=(i-h.b)/(h.dur/h.spd),h.s>=1&&(delete c[f],h.s=1,a--),e(h.start)){g=[];for(var j=0,k=h.start.length;k>j;j++)g[j]=h.start[j]+(h.end[j]-h.start[j])*h.easing(h.s)}else g=h.start+(h.end-h.start)*h.easing(h.s);h.set(g),1==h.s&&b("mina.finish."+h.id,h)}a&&d(p)},q=function(a,b,e,f,g,i,r){var s={id:h(),start:a,end:b,b:e,s:0,dur:f-e,spd:1,get:g,set:i,easing:r||q.linear,status:j,speed:k,duration:l,stop:m,pause:n,resume:o};c[s.id]=s;var t,u=0;for(t in c)if(c.hasOwnProperty(t)&&(u++,2==u))break;return 1==u&&d(p),s};return q.time=i,q.getById=function(a){return c[a]||null},q.linear=function(a){return a},q.easeout=function(a){return Math.pow(a,1.7)},q.easein=function(a){return Math.pow(a,.48)},q.easeinout=function(a){if(1==a)return 1;if(0==a)return 0;var b=.48-a/1.04,c=Math.sqrt(.1734+b*b),d=c-b,e=Math.pow(Math.abs(d),1/3)*(0>d?-1:1),f=-c-b,g=Math.pow(Math.abs(f),1/3)*(0>f?-1:1),h=e+g+.5;return 3*(1-h)*h*h+h*h*h},q.backin=function(a){if(1==a)return 1;var b=1.70158;return a*a*((b+1)*a-b)},q.backout=function(a){if(0==a)return 0;a-=1;var b=1.70158;return a*a*((b+1)*a+b)+1},q.elastic=function(a){return a==!!a?a:Math.pow(2,-10*a)*Math.sin((a-.075)*2*Math.PI/.3)+1},q.bounce=function(a){var b,c=7.5625,d=2.75;return 1/d>a?b=c*a*a:2/d>a?(a-=1.5/d,b=c*a*a+.75):2.5/d>a?(a-=2.25/d,b=c*a*a+.9375):(a-=2.625/d,b=c*a*a+.984375),b},a.mina=q,q}("undefined"==typeof b?function(){}:b);!function(){function a(a){a=a||Object(a);for(var b,d,e=1,f=a.length+1,h=c(a,0);f>e;e++)b=d,d=h,h=c(a,e),this.raw+=d,g.call(this,d,h,b);return this._beforeEnd=function(){g.call(this,"","",d)},this}function c(a,b){return a&&(a.charAt?a.charAt(b):a[b])}function d(a,b){this.events=this.events||{},this.events[a]=this.events[a]||[],this.events[a].push(b)}function e(a,c,d){"function"==typeof b&&b("elemental."+a+(c?"."+c:""),null,c,d||"",this.raw);for(var e=this.events&&this.events[a],f=e&&e.length;f--;)try{this.events[a][f](c,d||"",this.raw)}catch(g){}this.raw=""}function f(){g.call(this,"eof"),this.event("eof")}function g(a,b,c){"\n"==a&&this.event("newline"),m[this.mode].call(this,a,b,c)}function h(b,c){var g=function(a){g.parse(a)};return g.mode="text",g.type=String(b||"html").toLowerCase(),g.textchunk="",g.raw="",g.parse=a,g.on=d,g.event=e,g.end=f,c&&(i=c),g}var i={lt:60,"lt;":60,"AMP;":38,AMP:38,"GT;":62,GT:62,"QUOT;":34,QUOT:34,"apos;":39,"bull;":8226,"bullet;":8226,"copy;":169,copy:169,"deg;":176,deg:176},j=/[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u2028\u2029\u202f\u205f\u3000]/,k=function(a){var b;return"#"==a.charAt()&&(b="x"==a.charAt(1).toLowerCase()?parseInt(a.substring(2),16):parseInt(a.substring(1),10)),b=i[a],b?String.fromCharCode(b):"&"+a},l=function(){for(var a in this.attr)this.attr.hasOwnProperty(a)&&this.event("attr",a,{value:this.attr[a],tagname:this.tagname,attr:this.attr})},m={text:function(a){switch(a){case"<":case"eof":this.nodename="",this.attr={},this.mode="tag name start",this.raw=this.raw.slice(0,-1),this.textchunk&&this.event("text",this.textchunk),this.raw+=a,this.textchunk="";break;case"&":this.mode="entity",this.entity="";break;default:this.textchunk+=a}},entity:function(a){j.test(a)?(this.textchunk+=k(this.entity),this.mode="text"):";"==a?(this.textchunk+=k(this.entity+a),this.mode="text"):this.entity+=a},special:function(a,b,c){return"!"==c&&"-"==a&&"-"==b?(this.mode="comment start",void 0):"[CDATA"==this.textchunk&&"["==a?(this.mode="cdata",this.textchunk="",void 0):">"==a||"eof"==a?(this.event("special",this.textchunk),this.mode="text",this.textchunk="",void 0):(this.textchunk+=a,void 0)},cdata:function(a,b,c){return"]"==c&&"]"==a&&">"==b?(this.mode="cdata end",this.textchunk=this.textchunk.slice(0,-1),void 0):("eof"==a&&m["cdata end"].call(this),this.textchunk+=a,void 0)},"cdata end":function(){this.event("cdata",this.textchunk),this.textchunk="",this.mode="text"},"comment start":function(a,b){">"==b||"eof"==a?(this.event("comment",""),this.mode="skip"):this.mode="comment"},skip:function(){this.mode="text"},comment:function(a,b,c){"-"==a&&"-"==c&&">"==b?(this.mode="comment end",this.textchunk=this.textchunk.slice(0,-1)):"eof"==a?this.event("comment",this.textchunk):this.textchunk+=a},"comment end":function(){this.event("comment",this.textchunk),this.textchunk="",this.mode="text"},declaration:function(a,b){return"?"==a&&">"==b?(this.mode="declaration end",void 0):("eof"==a&&this.event("comment",this.textchunk),this.textchunk+=a,void 0)},"declaration end":function(){this.event("comment",this.textchunk),this.textchunk="",this.mode="text"},"tag name start":function(a,b,c){if("eof"==a)return this.event("text","<"),void 0;if(!j.test(a)){if(this.mode="tag name","/"==a)return this.mode="close tag name start",void 0;if("!"==a)return this.mode="special",this.textchunk="",void 0;if("?"==a)return this.mode="declaration",void 0;m[this.mode].call(this,a,b,c)}},"close tag name start":function(a,b,c){j.test(a)||(this.mode="close tag name",this.tagname="",this.nodename="",m[this.mode].call(this,a,b,c))},"close tag name":function(a){if(j.test(a))this.tagname=this.nodename;else switch(a){case">":this.event("/tag",this.tagname||this.nodename),this.mode="text";break;default:!this.tagname&&(this.nodename+=a)}},"tag name":function(a,b){if(j.test(a))this.tagname=this.nodename,this.nodename="",this.mode="attr start";else switch(a){case">":this.event("tag",this.nodename),this.mode="text";break;case"/":this.raw+=b,this.event("tag",this.nodename),this.event("/tag",this.nodename),this.mode="skip";break;default:this.nodename+=a}},"attr start":function(a,b,c){j.test(a)||(this.mode="attr",this.nodename="",m[this.mode].call(this,a,b,c))},attr:function(a){if(j.test(a)||"="==a)this.attr[this.nodename]="",this.mode="attr value start";else switch(a){case">":"/"==this.nodename?(delete this.attr["/"],this.event("tag",this.tagname,this.attr),l.call(this),this.event("/tag",this.tagname,!0)):(this.nodename&&(this.attr[this.nodename]=""),this.event("tag",this.tagname,this.attr),l.call(this)),this.mode="text";break;default:this.nodename+=a}},"attr value start":function(a,b,c){if(!j.test(a)){if(this.mode="attr value",this.quote=!1,"'"==a||'"'==a)return this.quote=a,void 0;m[this.mode].call(this,a,b,c)}},"attr value":function(a,b,c){if(j.test(a)&&!this.quote)this.mode="attr start";else if(">"!=a||this.quote)switch(a){case'"':case"'":this.quote==a&&"\\"!=c&&(this.mode="attr start");break;default:this.attr[this.nodename]+=a}else this.event("tag",this.tagname,this.attr),this.mode="text"}};h.version="0.2.4",("undefined"==typeof exports?this:exports).elemental=h}();var d=function(){function d(a,b){if(a){if(a.tagName)return z(a);if(a instanceof u)return a;if(null==b)return a=I.doc.querySelector(a),z(a)}return a=null==a?"100%":a,b=null==b?"100%":b,new y(a,b)}function e(a,b){if(b){if("string"==typeof a&&(a=e(a)),"string"==typeof b)return"xlink:"==b.substring(0,6)?a.getAttributeNS(gb,b.substring(6)):a.getAttribute(b);for(var c in b)if(b[J](c)){var d=K(b[c]);d?"xlink:"==c.substring(0,6)?a.setAttributeNS(gb,c.substring(6),d):a.setAttribute(c,d):a.removeAttribute(c)}}else a=I.doc.createElementNS("http://www.w3.org/2000/svg",a);return a}function f(a,b){return b=K.prototype.toLowerCase.call(b),"finite"==b?!W[J](+a):"array"==b&&(a instanceof Array||Array.isArray&&Array.isArray(a))?!0:"null"==b&&null===a||b==typeof a&&null!==a||"object"==b&&a===Object(a)||U.call(a).slice(8,-1).toLowerCase()==b}function g(a){if("function"==typeof a||Object(a)!==a)return a;var b=new a.constructor;for(var c in a)a[J](c)&&(b[c]=g(a[c]));return b}function h(a,b){for(var c=0,d=a.length;d>c;c++)if(a[c]===b)return a.push(a.splice(c,1)[0])}function i(a,b,c){function d(){var e=Array.prototype.slice.call(arguments,0),f=e.join("␀"),g=d.cache=d.cache||{},i=d.count=d.count||[];return g[J](f)?(h(i,f),c?c(g[f]):g[f]):(i.length>=1e3&&delete g[i.shift()],i.push(f),g[f]=a.apply(b,e),c?c(g[f]):g[f])}return d}function j(a,b,c,d,e,f){if(null==e){var g=a-c,h=b-d;return g||h?(180+180*N.atan2(-h,-g)/R+360)%360:0}return j(a,b,e,f)-j(c,d,e,f)}function k(a){return a%360*R/180}function l(a){return 180*a/R%360}function m(){return this.x+T+this.y+T+this.width+" × "+this.height}function n(a,b,c,d,e,f){return null==b&&"[object SVGMatrix]"==U.call(a)?(this.a=a.a,this.b=a.b,this.c=a.c,this.d=a.d,this.e=a.e,this.f=a.f,void 0):(null!=a?(this.a=+a,this.b=+b,this.c=+c,this.d=+d,this.e=+e,this.f=+f):(this.a=1,this.b=0,this.c=0,this.d=1,this.e=0,this.f=0),void 0)}function o(a){var b=[];return a=a.replace(/(?:^|\s)(\w+)\(([^)]+)\)/g,function(a,c,d){return d=d.split(/\s*,\s*/),"rotate"==c&&1==d.length&&d.push(0,0),"scale"==c&&(2==d.length&&d.push(0,0),1==d.length&&d.push(d[0],0,0)),"skewX"==c?b.push(["m",1,0,N.tan(k(d[0])),1,0,0]):"skewY"==c?b.push(["m",1,N.tan(k(d[0])),0,1,0,0]):b.push([c.charAt(0)].concat(d)),a}),b}function p(a,b){var c=pb(a),d=0,e=1,f=1,g=new n;if(c)for(var h=0,i=c.length;i>h;h++){var j,k,l,m,o,p=c[h],q=p.length,r=K(p[0]).toLowerCase(),s=p[0]!=r,t=s?g.invert():0;"t"==r&&3==q?s?(j=t.x(0,0),k=t.y(0,0),l=t.x(p[1],p[2]),m=t.y(p[1],p[2]),g.translate(l-j,m-k)):g.translate(p[1],p[2]):"r"==r?2==q?(o=o||b,g.rotate(p[1],o.x+o.width/2,o.y+o.height/2),d+=p[1]):4==q&&(s?(l=t.x(p[2],p[3]),m=t.y(p[2],p[3]),g.rotate(p[1],l,m)):g.rotate(p[1],p[2],p[3]),d+=p[1]):"s"==r?2==q||3==q?(o=o||b,g.scale(p[1],p[q-1],o.x+o.width/2,o.y+o.height/2),e*=p[1],f*=p[q-1]):5==q&&(s?(l=t.x(p[3],p[4]),m=t.y(p[3],p[4]),g.scale(p[1],p[2],l,m)):g.scale(p[1],p[2],p[3],p[4]),e*=p[1],f*=p[2]):"m"==r&&7==q&&g.add(p[1],p[2],p[3],p[4],p[5],p[6])}return g}function q(a,b){if(null==b){var c=!0;if(b="linearGradient"==a.type||"radialGradient"==a.type?a.node.getAttribute("gradientTransform"):"pattern"==a.type?a.node.getAttribute("patternTransform"):a.node.getAttribute("transform"),!b)return new n;b=o(b)}else b=qb.test(b)?K(b).replace(/\.{3}|\u2026/g,a._.transform||S):o(b);a._.transform=b;var d=p(b,a.getBBox(1));return c?d:(a.matrix=d,void 0)}function r(a){if(d._.someDefs)return d._.someDefs;var b=a.paper||a.node.parentNode&&d(a.node.parentNode)||d.select("svg")||d(0,0),c=b.select("defs").node;return c||(c=x("defs",b.node).node),d._.someDefs=c,c}function s(a,b,c){function d(a){return null==a?S:a==+a?a:(e(j,{width:a}),j.getBBox().width)}function f(a){return null==a?S:a==+a?a:(e(j,{height:a}),j.getBBox().height)}function g(d,e){null==b?i[d]=e(a.attr(d)):d==b&&(i=e(null==c?a.attr(d):c))}var h=r(a),i={},j=h.querySelector(".svg---mgr");switch(j||(j=e("rect"),e(j,{width:10,height:10,"class":"svg---mgr"}),h.appendChild(j)),a.type){case"rect":g("rx",d),g("ry",f);case"image":g("width",d),g("height",f);case"text":g("x",d),g("y",f);break;case"circle":g("cx",d),g("cy",f),g("r",d);break;case"ellipse":g("cx",d),g("cy",f),g("rx",d),g("ry",f);break;case"line":g("x1",d),g("x2",d),g("y1",f),g("y2",f);break;case"marker":g("refX",d),g("markerWidth",d),g("refY",f),g("markerHeight",f);break;case"radialGradient":g("fx",d),g("fy",f);break;case"tspan":g("dx",d),g("dy",f);break;default:i=null}return i}function t(a){f(a,"array")||(a=Array.prototype.slice.call(arguments,0));for(var b=0,c=0,d=this.node;this[b];)delete this[b++];for(b=0;bc;c++)if(b=b||a[c])return b}function w(a){this.node=a}function x(a,b){var c=e(a);b.appendChild(c);var d=z(c);return d.type=a,d}function y(a,b){var c,d,f,g=y.prototype;if(a&&"svg"==a.tagName){if(a.snap in hb)return hb[a.snap];c=new u(a),d=a.getElementsByTagName("desc")[0],f=a.getElementsByTagName("defs")[0],d||(d=e("desc"),d.appendChild(I.doc.createTextNode("Created with Snap")),c.node.appendChild(d)),f||(f=e("defs"),c.node.appendChild(f)),c.defs=f;for(var h in g)g[J](h)&&(c[h]=g[h]);c.paper=c.root=c}else c=x("svg",I.doc.body),e(c.node,{height:b,version:1.1,width:a,xmlns:"http://www.w3.org/2000/svg"});return c}function z(a){return a?a instanceof u||a instanceof w?a:"svg"==a.tagName?new y(a):new u(a):a}function A(){return this.selectAll("stop")}function B(a,b){var c=e("stop"),f={offset:+b+"%"};return a=d.color(a),f["stop-color"]=a.hex,a.opacity<1&&(f["stop-opacity"]=a.opacity),e(c,f),this.node.appendChild(c),this}function C(){if("linearGradient"==this.type){var a=e(this.node,"x1")||0,b=e(this.node,"x2")||1,c=e(this.node,"y1")||0,f=e(this.node,"y2")||0;return d._.box(a,c,N.abs(b-a),N.abs(f-c))}var g=this.node.cx||.5,h=this.node.cy||.5,i=this.node.r||0;return d._.box(g-i,h-i,2*i,2*i)}function D(a,c){function d(a,b){for(var c=(b-j)/(a-k),d=k;a>d;d++)h[d].offset=+(+j+c*(d-k)).toFixed(2);k=a,j=b}var f,g=v(b("snap.util.grad.parse",null,c));if(!g)return null;g.params.unshift(a),f="l"==g.type.toLowerCase()?E.apply(0,g.params):F.apply(0,g.params),g.type!=g.type.toLowerCase()&&e(f.node,{gradientUnits:"userSpaceOnUse"});var h=g.stops,i=h.length,j=0,k=0;i--;for(var l=0;i>l;l++)"offset"in h[l]&&d(l,h[l].offset);for(h[i].offset=h[i].offset||100,d(i,h[i].offset),l=0;i>=l;l++){var m=h[l];f.addStop(m.color,m.offset)}return f}function E(a,b,c,d,f){var g=x("linearGradient",a);return g.stops=A,g.addStop=B,g.getBBox=C,null!=b&&e(g.node,{x1:b,y1:c,x2:d,y2:f}),g}function F(a,b,c,d,f,g){var h=x("radialGradient",a);return h.stops=A,h.addStop=B,h.getBBox=C,null!=b&&e(h.node,{cx:b,cy:c,r:d}),null!=f&&null!=g&&e(h.node,{fx:f,fy:g}),h}function G(a){return function(c){if(b.stop(),c instanceof w&&1==c.node.childNodes.length&&("radialGradient"==c.node.firstChild.tagName||"linearGradient"==c.node.firstChild.tagName||"pattern"==c.node.firstChild.tagName)&&(c=c.node.firstChild,r(this).appendChild(c),c=z(c)),c instanceof u)if("radialGradient"==c.type||"linearGradient"==c.type||"pattern"==c.type){c.node.id||e(c.node,{id:c.id});var f="url(#"+c.node.id+")"}else f=c.attr(a);else if(f=d.color(c),f.error){var g=D(r(this),c);g?(g.node.id||e(g.node,{id:g.id}),f="url(#"+g.node.id+")"):f=c}else f=K(f);var h={};h[a]=f,e(this.node,h),this.node.style[a]=S}}function H(a){for(var b=[],c=a.childNodes,d=0,e=c.length;e>d;d++){var f=c[d];3==f.nodeType&&b.push(f.nodeValue),"tspan"==f.tagName&&(1==f.childNodes.length&&3==f.firstChild.nodeType?b.push(f.firstChild.nodeValue):b.push(H(f)))}return b}d.version="0.0.1",d.toString=function(){return"Snap v"+this.version},d._={};var I={win:a,doc:a.document};d._.glob=I;var J="hasOwnProperty",K=String,L=parseFloat,M=parseInt,N=Math,O=N.max,P=N.min,Q=N.abs,R=(N.pow,N.PI),S=(N.round,""),T=" ",U=Object.prototype.toString,V=/^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|rgba?\(\s*([\d\.]+%?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+%?(?:\s*,\s*[\d\.]+%?)?)\s*\)|hsba?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?%?)\s*\)|hsla?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?%?)\s*\))\s*$/i,W={NaN:1,Infinity:1,"-Infinity":1},X=/^url\(#?([^)]+)\)$/,Y=" \n\f\r \u2028\u2029",Z=new RegExp("[,"+Y+"]+"),$=(new RegExp("["+Y+"]","g"),new RegExp("["+Y+"]*,["+Y+"]*")),_={hs:1,rg:1},ab=new RegExp("([a-z])["+Y+",]*((-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?["+Y+"]*,?["+Y+"]*)+)","ig"),bb=new RegExp("([rstm])["+Y+",]*((-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?["+Y+"]*,?["+Y+"]*)+)","ig"),cb=new RegExp("(-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?)["+Y+"]*,?["+Y+"]*","ig"),db=0,eb="S"+(+new Date).toString(36),fb=function(){return eb+(db++).toString(36)},gb="http://www.w3.org/1999/xlink",hb={};d._.$=e,d._.id=fb,d.format=function(){var a=/\{([^\}]+)\}/g,b=/(?:(?:^|\.)(.+?)(?=\[|\.|$|\()|\[('|")(.+?)\2\])(\(\))?/g,c=function(a,c,d){var e=d;return c.replace(b,function(a,b,c,d,f){b=b||d,e&&(b in e&&(e=e[b]),"function"==typeof e&&f&&(e=e()))}),e=(null==e||e==d?a:e)+""};return function(b,d){return K(b).replace(a,function(a,b){return c(a,b,d)})}}();var ib=function(){function a(){this.parentNode.removeChild(this)}return function(b,c){var d=I.doc.createElement("img"),e=I.doc.body;d.style.cssText="position:absolute;left:-9999em;top:-9999em",d.onload=function(){c.call(d),d.onload=d.onerror=null,e.removeChild(d)},d.onerror=a,e.appendChild(d),d.src=b}}();d._.clone=g,d._.cacher=i,d.rad=k,d.deg=l,d.angle=j,d.is=f,d.snapTo=function(a,b,c){if(c=f(c,"finite")?c:10,f(a,"array")){for(var d=a.length;d--;)if(Q(a[d]-b)<=c)return a[d]}else{a=+a;var e=b%a;if(c>e)return b-e;if(e>a-c)return b-e+a}return b},function(a){function b(a){return a[0]*a[0]+a[1]*a[1]}function c(a){var c=N.sqrt(b(a));a[0]&&(a[0]/=c),a[1]&&(a[1]/=c)}a.add=function(a,b,c,d,e,f){var g,h,i,j,k=[[],[],[]],l=[[this.a,this.c,this.e],[this.b,this.d,this.f],[0,0,1]],m=[[a,c,e],[b,d,f],[0,0,1]];for(a&&a instanceof n&&(m=[[a.a,a.c,a.e],[a.b,a.d,a.f],[0,0,1]]),g=0;3>g;g++)for(h=0;3>h;h++){for(j=0,i=0;3>i;i++)j+=l[g][i]*m[i][h];k[g][h]=j}return this.a=k[0][0],this.b=k[1][0],this.c=k[0][1],this.d=k[1][1],this.e=k[0][2],this.f=k[1][2],this},a.invert=function(){var a=this,b=a.a*a.d-a.b*a.c;return new n(a.d/b,-a.b/b,-a.c/b,a.a/b,(a.c*a.f-a.d*a.e)/b,(a.b*a.e-a.a*a.f)/b)},a.clone=function(){return new n(this.a,this.b,this.c,this.d,this.e,this.f)},a.translate=function(a,b){return this.add(1,0,0,1,a,b)},a.scale=function(a,b,c,d){return null==b&&(b=a),(c||d)&&this.add(1,0,0,1,c,d),this.add(a,0,0,b,0,0),(c||d)&&this.add(1,0,0,1,-c,-d),this},a.rotate=function(a,b,c){a=k(a),b=b||0,c=c||0;var d=+N.cos(a).toFixed(9),e=+N.sin(a).toFixed(9);return this.add(d,e,-e,d,b,c),this.add(1,0,0,1,-b,-c)},a.x=function(a,b){return a*this.a+b*this.c+this.e},a.y=function(a,b){return a*this.b+b*this.d+this.f},a.get=function(a){return+this[K.fromCharCode(97+a)].toFixed(4)},a.toString=function(){return"matrix("+[this.get(0),this.get(1),this.get(2),this.get(3),this.get(4),this.get(5)].join()+")"},a.offset=function(){return[this.e.toFixed(4),this.f.toFixed(4)]},a.split=function(){var a={};a.dx=this.e,a.dy=this.f;var d=[[this.a,this.c],[this.b,this.d]];a.scalex=N.sqrt(b(d[0])),c(d[0]),a.shear=d[0][0]*d[1][0]+d[0][1]*d[1][1],d[1]=[d[1][0]-d[0][0]*a.shear,d[1][1]-d[0][1]*a.shear],a.scaley=N.sqrt(b(d[1])),c(d[1]),a.shear/=a.scaley;var e=-d[0][1],f=d[1][1];return 0>f?(a.rotate=l(N.acos(f)),0>e&&(a.rotate=360-a.rotate)):a.rotate=l(N.asin(e)),a.isSimple=!(+a.shear.toFixed(9)||a.scalex.toFixed(9)!=a.scaley.toFixed(9)&&a.rotate),a.isSuperSimple=!+a.shear.toFixed(9)&&a.scalex.toFixed(9)==a.scaley.toFixed(9)&&!a.rotate,a.noRotation=!+a.shear.toFixed(9)&&!a.rotate,a},a.toTransformString=function(a){var b=a||this.split();return b.isSimple?(b.scalex=+b.scalex.toFixed(4),b.scaley=+b.scaley.toFixed(4),b.rotate=+b.rotate.toFixed(4),(b.dx||b.dy?"t"+[+b.dx.toFixed(4),+b.dy.toFixed(4)]:S)+(1!=b.scalex||1!=b.scaley?"s"+[b.scalex,b.scaley,0,0]:S)+(b.rotate?"r"+[+b.rotate.toFixed(4),0,0]:S)):"m"+[this.get(0),this.get(1),this.get(2),this.get(3),this.get(4),this.get(5)]}}(n.prototype),d.Matrix=n,d.getRGB=i(function(a){if(!a||(a=K(a)).indexOf("-")+1)return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:mb};if("none"==a)return{r:-1,g:-1,b:-1,hex:"none",toString:mb};if(!(_[J](a.toLowerCase().substring(0,2))||"#"==a.charAt())&&(a=jb(a)),!a)return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:mb};var b,c,e,g,h,i,j=a.match(V);return j?(j[2]&&(e=M(j[2].substring(5),16),c=M(j[2].substring(3,5),16),b=M(j[2].substring(1,3),16)),j[3]&&(e=M((h=j[3].charAt(3))+h,16),c=M((h=j[3].charAt(2))+h,16),b=M((h=j[3].charAt(1))+h,16)),j[4]&&(i=j[4].split($),b=L(i[0]),"%"==i[0].slice(-1)&&(b*=2.55),c=L(i[1]),"%"==i[1].slice(-1)&&(c*=2.55),e=L(i[2]),"%"==i[2].slice(-1)&&(e*=2.55),"rgba"==j[1].toLowerCase().slice(0,4)&&(g=L(i[3])),i[3]&&"%"==i[3].slice(-1)&&(g/=100)),j[5]?(i=j[5].split($),b=L(i[0]),"%"==i[0].slice(-1)&&(b/=100),c=L(i[1]),"%"==i[1].slice(-1)&&(c/=100),e=L(i[2]),"%"==i[2].slice(-1)&&(e/=100),("deg"==i[0].slice(-3)||"°"==i[0].slice(-1))&&(b/=360),"hsba"==j[1].toLowerCase().slice(0,4)&&(g=L(i[3])),i[3]&&"%"==i[3].slice(-1)&&(g/=100),d.hsb2rgb(b,c,e,g)):j[6]?(i=j[6].split($),b=L(i[0]),"%"==i[0].slice(-1)&&(b/=100),c=L(i[1]),"%"==i[1].slice(-1)&&(c/=100),e=L(i[2]),"%"==i[2].slice(-1)&&(e/=100),("deg"==i[0].slice(-3)||"°"==i[0].slice(-1))&&(b/=360),"hsla"==j[1].toLowerCase().slice(0,4)&&(g=L(i[3])),i[3]&&"%"==i[3].slice(-1)&&(g/=100),d.hsl2rgb(b,c,e,g)):(b=P(N.round(b),255),c=P(N.round(c),255),e=P(N.round(e),255),g=P(O(g,0),1),j={r:b,g:c,b:e,toString:mb},j.hex="#"+(16777216|e|c<<8|b<<16).toString(16).slice(1),j.opacity=f(g,"finite")?g:1,j)):{r:-1,g:-1,b:-1,hex:"none",error:1,toString:mb}},d),d.hsb=i(function(a,b,c){return d.hsb2rgb(a,b,c).hex}),d.hsl=i(function(a,b,c){return d.hsl2rgb(a,b,c).hex}),d.rgb=i(function(a,b,c,d){if(f(d,"finite")){var e=N.round;return"rgba("+[e(a),e(b),e(c),+d.toFixed(2)]+")"}return"#"+(16777216|c|b<<8|a<<16).toString(16).slice(1)});var jb=function(a){var b=I.doc.getElementsByTagName("head")[0],c="rgb(255, 0, 0)";return jb=i(function(a){if("red"==a.toLowerCase())return c;b.style.color=c,b.style.color=a;var d=I.doc.defaultView.getComputedStyle(b,S).getPropertyValue("color");return d==c?null:d}),jb(a)},kb=function(){return"hsb("+[this.h,this.s,this.b]+")"},lb=function(){return"hsl("+[this.h,this.s,this.l]+")"},mb=function(){return 1==this.opacity||null==this.opacity?this.hex:"rgba("+[this.r,this.g,this.b,this.opacity]+")"},nb=function(a,b,c){if(null==b&&f(a,"object")&&"r"in a&&"g"in a&&"b"in a&&(c=a.b,b=a.g,a=a.r),null==b&&f(a,string)){var e=d.getRGB(a);a=e.r,b=e.g,c=e.b}return(a>1||b>1||c>1)&&(a/=255,b/=255,c/=255),[a,b,c]},ob=function(a,b,c,e){a=N.round(255*a),b=N.round(255*b),c=N.round(255*c);var g={r:a,g:b,b:c,opacity:f(e,"finite")?e:1,hex:d.rgb(a,b,c),toString:mb};return f(e,"finite")&&(g.opacity=e),g};d.color=function(a){var b;return f(a,"object")&&"h"in a&&"s"in a&&"b"in a?(b=d.hsb2rgb(a),a.r=b.r,a.g=b.g,a.b=b.b,a.opacity=1,a.hex=b.hex):f(a,"object")&&"h"in a&&"s"in a&&"l"in a?(b=d.hsl2rgb(a),a.r=b.r,a.g=b.g,a.b=b.b,a.opacity=1,a.hex=b.hex):(f(a,"string")&&(a=d.getRGB(a)),f(a,"object")&&"r"in a&&"g"in a&&"b"in a&&!("error"in a)?(b=d.rgb2hsl(a),a.h=b.h,a.s=b.s,a.l=b.l,b=d.rgb2hsb(a),a.v=b.b):(a={hex:"none"},a.r=a.g=a.b=a.h=a.s=a.v=a.l=-1,a.error=1)),a.toString=mb,a},d.hsb2rgb=function(a,b,c,d){f(a,"object")&&"h"in a&&"s"in a&&"b"in a&&(c=a.b,b=a.s,a=a.h,d=a.o),a*=360;var e,g,h,i,j;return a=a%360/60,j=c*b,i=j*(1-Q(a%2-1)),e=g=h=c-j,a=~~a,e+=[j,i,0,0,i,j][a],g+=[i,j,j,i,0,0][a],h+=[0,0,i,j,j,i][a],ob(e,g,h,d)},d.hsl2rgb=function(a,b,c,d){f(a,"object")&&"h"in a&&"s"in a&&"l"in a&&(c=a.l,b=a.s,a=a.h),(a>1||b>1||c>1)&&(a/=360,b/=100,c/=100),a*=360;var e,g,h,i,j;return a=a%360/60,j=2*b*(.5>c?c:1-c),i=j*(1-Q(a%2-1)),e=g=h=c-j/2,a=~~a,e+=[j,i,0,0,i,j][a],g+=[i,j,j,i,0,0][a],h+=[0,0,i,j,j,i][a],ob(e,g,h,d)},d.rgb2hsb=function(a,b,c){c=nb(a,b,c),a=c[0],b=c[1],c=c[2];var d,e,f,g;return f=O(a,b,c),g=f-P(a,b,c),d=0==g?null:f==a?(b-c)/g:f==b?(c-a)/g+2:(a-b)/g+4,d=60*((d+360)%6)/360,e=0==g?0:g/f,{h:d,s:e,b:f,toString:kb}},d.rgb2hsl=function(a,b,c){c=nb(a,b,c),a=c[0],b=c[1],c=c[2];var d,e,f,g,h,i;return g=O(a,b,c),h=P(a,b,c),i=g-h,d=0==i?null:g==a?(b-c)/i:g==b?(c-a)/i+2:(a-b)/i+4,d=60*((d+360)%6)/360,f=(g+h)/2,e=0==i?0:.5>f?i/(2*f):i/(2-2*f),{h:d,s:e,l:f,toString:lb}},d.parsePathString=function(a){if(!a)return null;var b=d.path(a);if(b.arr)return d.path.clone(b.arr);var c={a:7,c:6,o:2,h:1,l:2,m:2,r:4,q:4,s:4,t:2,v:1,u:3,z:0},e=[];return f(a,"array")&&f(a[0],"array")&&(e=d.path.clone(a)),e.length||K(a).replace(ab,function(a,b,d){var f=[],g=b.toLowerCase();if(d.replace(cb,function(a,b){b&&f.push(+b)}),"m"==g&&f.length>2&&(e.push([b].concat(f.splice(0,2))),g="l",b="m"==b?"l":"L"),"o"==g&&1==f.length&&e.push([b,f[0]]),"r"==g)e.push([b].concat(f));else for(;f.length>=c[g]&&(e.push([b].concat(f.splice(0,c[g]))),c[g]););}),e.toString=d.path.toString,b.arr=d.path.clone(e),e};var pb=d.parseTransformString=function(a){if(!a)return null;var b=[];return f(a,"array")&&f(a[0],"array")&&(b=d.path.clone(a)),b.length||K(a).replace(bb,function(a,c,d){var e=[];c.toLowerCase(),d.replace(cb,function(a,b){b&&e.push(+b)}),b.push([c].concat(e))}),b.toString=d.path.toString,b},qb=new RegExp("^[a-z]["+Y+"]*-?\\.?\\d");d._.transform2matrix=p,d._unit2px=s,d._.getSomeDefs=r,d.select=function(a){return z(I.doc.querySelector(a))},d.selectAll=function(a){for(var b=I.doc.querySelectorAll(a),c=(d.set||Array)(),e=0;ej;j++){d=f[j],b(d,"fill"),b(d,"stroke"),b(d,"filter"),b(d,"mask"),b(d,"clip-path"),c(d);var l=e(d.node,"id");l&&(e(d.node,{id:d.id}),h.push({old:l,id:d.id}))}for(j=0,k=h.length;k>j;j++){var m=i[h[j].old];if(m)for(var n=0,o=m.length;o>n;n++)m[n](h[j].id)}}function h(a,b,c){return function(d){var e=d.slice(a,b);return 1==e.length&&(e=e[0]),c?c(e):e}}function i(a){return function(){var b=a?"<"+this.type:"",c=this.node.attributes,d=this.node.childNodes;if(a)for(var e=0,f=c.length;f>e;e++)b+=" "+c[e].name+'="'+c[e].value.replace(/"/g,'\\"')+'"';if(d.length){for(a&&(b+=">"),e=0,f=d.length;f>e;e++)3==d[e].nodeType?b+=d[e].nodeValue:1==d[e].nodeType&&(b+=z(d[e]).toString());a&&(b+=""+this.type+">")}else a&&(b+="/>");return b}}a.attr=function(a,c){var d=this;if(d.node,!a)return d;if(f(a,"string")){if(!(arguments.length>1))return v(b("snap.util.getattr."+a,d));var e={};e[a]=c,a=e}for(var g in a)a[J](g)&&b("snap.util.attr."+g,d,a[g]);return d},a.getBBox=function(a){var b=this;if("use"==b.type&&(b=b.original),b.removed)return{};var c=b._;return a?((c.dirty||!c.bboxwt)&&(b.realPath=d.path.get[b.type](b),c.bboxwt=d.path.getBBox(b.realPath),c.bboxwt.toString=m,c.dirty=0),d._.box(c.bboxwt)):((c.dirty||c.dirtyT||!c.bbox)&&((c.dirty||!b.realPath)&&(c.bboxwt=0,b.realPath=d.path.get[b.type](b)),c.bbox=d.path.getBBox(d.path.map(b.realPath,b.matrix)),c.bbox.toString=m,c.dirty=c.dirtyT=0),d._.box(c.bbox))};var j=function(){return this.local};a.transform=function(a){var b=this._;if(null==a){var c=new n(this.node.getCTM()),d=q(this);return{string:K(b.transform)||"",globalMatrix:c,localMatrix:d,diffMatrix:c.clone().add(d.invert()),global:c.toTransformString(),local:d.toTransformString(),toString:j}}return a instanceof n&&(a=a.toTransformString()),q(this,a),this.node&&("linearGradient"==this.type||"radialGradient"==this.type?e(this.node,{gradientTransform:this.matrix}):"pattern"==this.type?e(this.node,{patternTransform:this.matrix}):e(this.node,{transform:this.matrix})),this},a.parent=function(){return z(this.node.parentNode)},a.append=a.add=function(a){if("set"==a.type){var b=this;return a.forEach(function(a){b.append(a)}),this}return a=z(a),this.node.appendChild(a.node),a.paper=this.paper,this},a.prepend=function(a){return a=z(a),this.node.insertBefore(a.node,this.node.firstChild),a.paper=this.paper,this},a.before=function(a){return a=z(a),this.node.parentNode.insertBefore(a.node,this.node),a.paper=this.paper,this},a.after=function(a){return a=z(a),this.node.parentNode.insertBefore(a.node,this.node.nextSibling),a.paper=this.paper,this},a.insertBefore=function(a){return a=z(a),a.node.parentNode.insertBefore(this.node,a.node),this.paper=a.paper,this},a.insertAfter=function(a){return a=z(a),a.node.parentNode.insertBefore(this.node,a.node.nextSibling),this.paper=a.paper,this},a.remove=function(){return this.node.parentNode&&this.node.parentNode.removeChild(this.node),delete this.paper,this.removed=!0,this},a.select=function(a){return z(this.node.querySelector(a))},a.selectAll=function(a){for(var b=this.node.querySelectorAll(a),c=(d.set||Array)(),e=0;eb;b++)a[b].stop();return this},a.animate=function(a,d,e,g){"function"!=typeof e||e.length||(g=e,e=c.linear),a instanceof k&&(g=a.callback,e=a.easing,d=e.dur,a=a.attr);var i,j,l,m,n=[],o=[],p={},q=this;for(var r in a)if(a[J](r)){q.equal?(m=q.equal(r,K(a[r])),i=m.from,j=m.to,l=m.f):(i=+q.attr(r),j=+a[r]);var s=f(i,"array")?i.length:1;p[r]=h(n.length,n.length+s,l),n=n.concat(i),o=o.concat(j)}var t=c.time(),u=c(n,o,t,t+d,c.time,function(a){var b={};for(var c in p)p[J](c)&&(b[c]=p[c](a));q.attr(b)},e);return q.anims[u.id]=u,u._attrs=a,u._callback=g,b.once("mina.finish."+u.id,function(){delete q.anims[u.id],g&&g.call(q)}),b.once("mina.stop."+u.id,function(){delete q.anims[u.id]}),q};var l={};a.data=function(a,c){var e=l[this.id]=l[this.id]||{};if(1==arguments.length){if(d.is(a,"object")){for(var f in a)a[J](f)&&this.data(f,a[f]);return this}return b("snap.data.get."+this.id,this,e[a],a),e[a]}return e[a]=c,b("snap.data.set."+this.id,this,c,a),this},a.removeData=function(a){return null==a?l[this.id]={}:l[this.id]&&delete l[this.id][a],this},a.toString=i(1),a.innerSVG=i()}(u.prototype),d.parse=function(a){var c=I.doc.createDocumentFragment(),d=c;return b.on("elemental.tag",function(a,b){var c=e(a);b&&e(c,b),d.appendChild(c),d=c}),b.on("elemental.text",function(a){d.appendChild(I.doc.createTextNode(a))}),b.on("elemental./tag",function(){d=d.parentNode}),b.on("elemental.eof",function(){b.off("elemental.*"),b("snap.parsed",c)}),elemental().parse(a).end(),new w(c)},w.prototype.select=u.prototype.select,w.prototype.selectAll=u.prototype.selectAll,d.fragment=function(){for(var a=Array.prototype.slice.call(arguments,0),b=I.doc.createDocumentFragment(),c=0,e=a.length;e>c;c++){var f=a[c];f.node&&f.node.nodeType&&b.appendChild(f.node),f.nodeType&&b.appendChild(f),"string"==typeof f&&b.appendChild(d.parse(f).node)}return new w(b)},function(a){a.el=function(a,b){return x(a,this.node).attr(b)},a.rect=function(a,b,c,d,e,g){var h=x("rect",this.node);return null==g&&(g=e),f(a,"object")&&"x"in a?h.attr(a):null!=a&&(h.attr({x:a,y:b,width:c,height:d}),null!=e&&h.attr({rx:e,ry:g})),h},a.circle=function(a,b,c){var d=x("circle",this.node);return f(a,"object")&&"cx"in a?d.attr(a):null!=a&&d.attr({cx:a,cy:b,r:c}),d},a.image=function(a,b,c,d,g){var h=x("image",this.node);if(f(a,"object")&&"src"in a)h.attr(a);else if(null!=a){var i={"xlink:href":a,preserveAspectRatio:"none"};null!=b&&null!=c&&(i.x=b,i.y=c),null!=d&&null!=g?(i.width=d,i.height=g):ib(a,function(){e(h.node,{width:this.offsetWidth,height:this.offsetHeight})}),e(h.node,i)}return h},a.ellipse=function(a,b,c,d){var e=x("ellipse",this.node);return f(a,"object")&&"cx"in a?e.attr(a):null!=a&&e.attr({cx:a,cy:b,rx:c,ry:d}),e},a.path=function(a){var b=x("path",this.node);return f(a,"object")&&!f(a,"array")?b.attr(a):a&&b.attr({d:a}),b},a.group=a.g=function(b){var c=x("g",this.node);c.add=t;for(var d in a)a[J](d)&&(c[d]=a[d]);return 1==arguments.length&&b&&!b.type?c.attr(b):arguments.length&&c.add(Array.prototype.slice.call(arguments,0)),c},a.text=function(a,b,c){var d=x("text",this.node);return f(a,"object")?d.attr(a):null!=a&&d.attr({x:a,y:b,text:c||""}),d},a.line=function(a,b,c,d){var e=x("line",this.node);return f(a,"object")?e.attr(a):null!=a&&e.attr({x1:a,x2:c,y1:b,y2:d}),e},a.polyline=function(a){arguments.length>1&&(a=Array.prototype.slice.call(arguments,0));var b=x("polyline",this.node);return f(a,"object")&&!f(a,"array")?b.attr(a):null!=a&&b.attr({points:a}),b},a.polygon=function(a){arguments.length>1&&(a=Array.prototype.slice.call(arguments,0));var b=x("polygon",this.node);return f(a,"object")&&!f(a,"array")?b.attr(a):null!=a&&b.attr({points:a}),b},function(){a.gradient=function(a){return D(this.defs,a)},a.gradientLinear=function(a,b,c,d){return E(this.defs,a,b,c,d)},a.gradientRadial=function(a,b,c,d,e){return F(this.defs,a,b,c,d,e)},a.toString=function(){var a,b=I.doc.createDocumentFragment(),c=I.doc.createElement("div"),d=this.node.cloneNode(!0);return b.appendChild(c),c.appendChild(d),e(d,{xmlns:"http://www.w3.org/2000/svg"}),a=c.innerHTML,b.removeChild(b.firstChild),a}}()}(y.prototype),d.ajax=function(a,c,d,e){var g=new XMLHttpRequest,h=fb();if(g){if(f(c,"function"))e=d,d=c,c=null;else if(f(c,"object")){var i=[];for(var j in c)c.hasOwnProperty(j)&&i.push(encodeURIComponent(j)+"="+encodeURIComponent(c[j]));c=i.join("&")}return g.open(c?"POST":"GET",a,!0),g.setRequestHeader("X-Requested-With","XMLHttpRequest"),c&&g.setRequestHeader("Content-type","application/x-www-form-urlencoded"),d&&(b.once("snap.ajax."+h+".0",d),b.once("snap.ajax."+h+".200",d),b.once("snap.ajax."+h+".304",d)),g.onreadystatechange=function(){4==g.readyState&&b("snap.ajax."+h+"."+g.status,e,g)},4==g.readyState?g:(g.send(c),g)}},d.load=function(a,b,c){d.ajax(a,function(a){var e=d.parse(a.responseText);c?b.call(c,e):b(e)})},b.on("snap.util.attr.mask",function(a){if(a instanceof u||a instanceof w){if(b.stop(),a instanceof w&&1==a.node.childNodes.length&&(a=a.node.firstChild,r(this).appendChild(a),a=z(a)),"mask"==a.type)var c=a;else c=x("mask",r(this)),c.node.appendChild(a.node),!c.node.id&&e(c.node,{id:c.id});e(this.node,{mask:"url(#"+c.id+")"})}}),function(a){b.on("snap.util.attr.clip",a),b.on("snap.util.attr.clip-path",a),b.on("snap.util.attr.clipPath",a)}(function(a){if(a instanceof u||a instanceof w){if(b.stop(),"clipPath"==a.type)var c=a;else c=x("clipPath",r(this)),c.node.appendChild(a.node),!c.node.id&&e(c.node,{id:c.id});e(this.node,{"clip-path":"url(#"+c.id+")"})}}),b.on("snap.util.attr.fill",G("fill")),b.on("snap.util.attr.stroke",G("stroke"));var rb=/^([lr])(?:\(([^)]*)\))?(.*)$/i;b.on("snap.util.grad.parse",function(a){a=K(a);var b=a.match(rb);if(!b)return null;var c=b[1],d=b[2],e=b[3];return d=d.split(/\s*,\s*/).map(function(a){return+a==a?+a:a}),1==d.length&&0==d[0]&&(d=[]),e=e.split("-"),e=e.map(function(a){a=a.split(":");var b={color:a[0]};return a[1]&&(b.offset=a[1]),b}),{type:c,params:d,stops:e}}),b.on("snap.util.attr.d",function(a){b.stop(),f(a,"array")&&f(a[0],"array")&&(a=d.path.toString.call(a)),a=K(a),a.match(/[ruo]/i)&&(a=d.path.toAbsolute(a)),e(this.node,{d:a})})(-1),b.on("snap.util.attr.#text",function(a){b.stop(),a=K(a);for(var c=I.doc.createTextNode(a);this.node.firstChild;)this.node.removeChild(this.node.firstChild);this.node.appendChild(c)})(-1),b.on("snap.util.attr.path",function(a){b.stop(),this.attr({d:a})})(-1),b.on("snap.util.attr.viewBox",function(a){var c;c=f(a,"object")&&"x"in a?[a.x,a.y,a.width,a.height].join(" "):f(a,"array")?a.join(" "):a,e(this.node,{viewBox:c}),b.stop()})(-1),b.on("snap.util.attr.transform",function(a){this.transform(a),b.stop()})(-1),b.on("snap.util.attr.r",function(a){"rect"==this.type&&(b.stop(),e(this.node,{rx:a,ry:a}))})(-1),b.on("snap.util.attr.text",function(a){if("text"==this.type){for(var c=this.node,d=function(a){var b=e("tspan");if(f(a,"array"))for(var c=0;cr;r++){if(l=a[r],"M"==l[0])j=+l[1],k=+l[2];else{if(m=g(j,k,l[1],l[2],l[3],l[4],l[5],l[6]),q+m>f){if(d&&!p.start){if(n=g(j,k,l[1],l[2],l[3],l[4],l[5],l[6],f-q),o+=["C"+e(n.start.x),e(n.start.y),e(n.m.x),e(n.m.y),e(n.x),e(n.y)],h)return o;p.start=o,o=["M"+e(n.x),e(n.y)+"C"+e(n.n.x),e(n.n.y),e(n.end.x),e(n.end.y),e(l[5]),e(l[6])].join(),q+=m,j=+l[5],k=+l[6];continue}if(!c&&!d)return n=g(j,k,l[1],l[2],l[3],l[4],l[5],l[6],f-q)}q+=m,j=+l[5],k=+l[6]}o+=l.shift()+l}return p.end=o,n=c?q:d?p:i(j,k,l[0],l[1],l[2],l[3],l[4],l[5],1)},null,a._.clone)}function i(a,b,c,d,e,f,g,h,i){var j=1-i,k=S(j,3),l=S(j,2),m=i*i,n=m*i,o=k*a+3*l*i*c+3*j*i*i*e+n*g,p=k*b+3*l*i*d+3*j*i*i*f+n*h,q=a+2*i*(c-a)+m*(e-2*c+a),r=b+2*i*(d-b)+m*(f-2*d+b),s=c+2*i*(e-c)+m*(g-2*e+c),t=d+2*i*(f-d)+m*(h-2*f+d),u=j*a+i*c,v=j*b+i*d,w=j*e+i*g,x=j*f+i*h,y=90-180*O.atan2(q-s,r-t)/P;return{x:o,y:p,m:{x:q,y:r},n:{x:s,y:t},start:{x:u,y:v},end:{x:w,y:x},alpha:y}}function j(b,c,e,f,g,h,i,j){a.is(b,"array")||(b=[b,c,e,f,g,h,i,j]);var k=E.apply(null,b);return d(k.min.x,k.min.y,k.max.x-k.min.x,k.max.y-k.min.y)}function k(a,b,c){return b>=a.x&&b<=a.x+a.width&&c>=a.y&&c<=a.y+a.height}function l(a,b){return a=d(a),b=d(b),k(b,a.x,a.y)||k(b,a.x2,a.y)||k(b,a.x,a.y2)||k(b,a.x2,a.y2)||k(a,b.x,b.y)||k(a,b.x2,b.y)||k(a,b.x,b.y2)||k(a,b.x2,b.y2)||(a.xb.x||b.xa.x)&&(a.yb.y||b.ya.y)}function m(a,b,c,d,e){var f=-3*b+9*c-9*d+3*e,g=a*f+6*b-12*c+6*d;return a*g-3*b+3*c}function n(a,b,c,d,e,f,g,h,i){null==i&&(i=1),i=i>1?1:0>i?0:i;for(var j=i/2,k=12,l=[-.1252,.1252,-.3678,.3678,-.5873,.5873,-.7699,.7699,-.9041,.9041,-.9816,.9816],n=[.2491,.2491,.2335,.2335,.2032,.2032,.1601,.1601,.1069,.1069,.0472,.0472],o=0,p=0;k>p;p++){var q=j*l[p]+j,r=m(q,a,c,e,g),s=m(q,b,d,f,h),t=r*r+s*s;o+=n[p]*O.sqrt(t)}return j*o}function o(a,b,c,d,e,f,g,h,i){if(!(0>i||n(a,b,c,d,e,f,g,h)o;)l/=2,m+=(i>j?1:-1)*l,j=n(a,b,c,d,e,f,g,h,m);return m}}function p(a,b,c,d,e,f,g,h){if(!(R(a,c)R(e,g)||R(b,d)R(f,h))){var i=(a*d-b*c)*(e-g)-(a-c)*(e*h-f*g),j=(a*d-b*c)*(f-h)-(b-d)*(e*h-f*g),k=(a-c)*(f-h)-(b-d)*(e-g);if(k){var l=i/k,m=j/k,n=+l.toFixed(2),o=+m.toFixed(2);if(!(n<+Q(a,c).toFixed(2)||n>+R(a,c).toFixed(2)||n<+Q(e,g).toFixed(2)||n>+R(e,g).toFixed(2)||o<+Q(b,d).toFixed(2)||o>+R(b,d).toFixed(2)||o<+Q(f,h).toFixed(2)||o>+R(f,h).toFixed(2)))return{x:l,y:m}}}}function q(a,b,c){var d=j(a),e=j(b);if(!l(d,e))return c?0:[];for(var f=n.apply(0,a),g=n.apply(0,b),h=~~(f/5),k=~~(g/5),m=[],o=[],q={},r=c?0:[],s=0;h+1>s;s++){var t=i.apply(0,a.concat(s/h));m.push({x:t.x,y:t.y,t:s/h})}for(s=0;k+1>s;s++)t=i.apply(0,b.concat(s/k)),o.push({x:t.x,y:t.y,t:s/k});for(s=0;h>s;s++)for(var u=0;k>u;u++){var v=m[s],w=m[s+1],x=o[u],y=o[u+1],z=T(w.x-v.x)<.001?"y":"x",A=T(y.x-x.x)<.001?"y":"x",B=p(v.x,v.y,w.x,w.y,x.x,x.y,y.x,y.y);if(B){if(q[B.x.toFixed(4)]==B.y.toFixed(4))continue;q[B.x.toFixed(4)]=B.y.toFixed(4);var C=v.t+T((B[z]-v[z])/(w[z]-v[z]))*(w.t-v.t),D=x.t+T((B[A]-x[A])/(y[A]-x[A]))*(y.t-x.t);C>=0&&1>=C&&D>=0&&1>=D&&(c?r++:r.push({x:B.x,y:B.y,t1:C,t2:D}))}}return r}function r(a,b){return t(a,b)}function s(a,b){return t(a,b,1)}function t(a,b,c){a=F(a),b=F(b);for(var d,e,f,g,h,i,j,k,l,m,n=c?0:[],o=0,p=a.length;p>o;o++){var r=a[o];if("M"==r[0])d=h=r[1],e=i=r[2];else{"C"==r[0]?(l=[d,e].concat(r.slice(1)),d=l[6],e=l[7]):(l=[d,e,d,e,h,i,h,i],d=h,e=i);for(var s=0,t=b.length;t>s;s++){var u=b[s];if("M"==u[0])f=j=u[1],g=k=u[2];else{"C"==u[0]?(m=[f,g].concat(u.slice(1)),f=m[6],g=m[7]):(m=[f,g,f,g,j,k,j,k],f=j,g=k);var v=q(l,m,c);if(c)n+=v;else{for(var w=0,x=v.length;x>w;w++)v[w].segment1=o,v[w].segment2=s,v[w].bez1=l,v[w].bez2=m;n=n.concat(v)}}}}}return n}function u(a,b,c){var d=v(a);return k(d,b,c)&&1==t(a,[["M",b,c],["H",d.x2+10]],1)%2}function v(a){var b=c(a);if(b.bbox)return K(b.bbox);if(!a)return d();a=F(a);for(var e,f=0,g=0,h=[],i=[],j=0,k=a.length;k>j;j++)if(e=a[j],"M"==e[0])f=e[1],g=e[2],h.push(f),i.push(g);else{var l=E(f,g,e[1],e[2],e[3],e[4],e[5],e[6]);h=h.concat(l.min.x,l.max.x),i=i.concat(l.min.y,l.max.y),f=e[5],g=e[6]}var m=Q.apply(0,h),n=Q.apply(0,i),o=R.apply(0,h),p=R.apply(0,i),q=d(m,n,o-m,p-n);return b.bbox=K(q),q}function w(a,b,c,d,f){if(f)return[["M",a+f,b],["l",c-2*f,0],["a",f,f,0,0,1,f,f],["l",0,d-2*f],["a",f,f,0,0,1,-f,f],["l",2*f-c,0],["a",f,f,0,0,1,-f,-f],["l",0,2*f-d],["a",f,f,0,0,1,f,-f],["z"]];var g=[["M",a,b],["l",c,0],["l",0,d],["l",-c,0],["z"]];return g.toString=e,g}function x(a,b,c,d,f){if(null==f&&null==d&&(d=c),null!=f)var g=Math.PI/180,h=a+c*Math.cos(-d*g),i=a+c*Math.cos(-f*g),j=b+c*Math.sin(-d*g),k=b+c*Math.sin(-f*g),l=[["M",h,j],["A",c,c,0,+(f-d>180),0,i,k]];else l=[["M",a,b],["m",0,-d],["a",c,d,0,1,1,0,2*d],["a",c,d,0,1,1,0,-2*d],["z"]];return l.toString=e,l}function y(b){var d=c(b),g=String.prototype.toLowerCase;if(d.rel)return f(d.rel);a.is(b,"array")&&a.is(b&&b[0],"array")||(b=a.parsePathString(b));var h=[],i=0,j=0,k=0,l=0,m=0;"M"==b[0][0]&&(i=b[0][1],j=b[0][2],k=i,l=j,m++,h.push(["M",i,j]));for(var n=m,o=b.length;o>n;n++){var p=h[n]=[],q=b[n];if(q[0]!=g.call(q[0]))switch(p[0]=g.call(q[0]),p[0]){case"a":p[1]=q[1],p[2]=q[2],p[3]=q[3],p[4]=q[4],p[5]=q[5],p[6]=+(q[6]-i).toFixed(3),p[7]=+(q[7]-j).toFixed(3);break;case"v":p[1]=+(q[1]-j).toFixed(3);break;case"m":k=q[1],l=q[2];default:for(var r=1,s=q.length;s>r;r++)p[r]=+(q[r]-(r%2?i:j)).toFixed(3)}else{p=h[n]=[],"m"==q[0]&&(k=q[1]+i,l=q[2]+j);for(var t=0,u=q.length;u>t;t++)h[n][t]=q[t]}var v=h[n].length;switch(h[n][0]){case"z":i=k,j=l;break;case"h":i+=+h[n][v-1];break;case"v":j+=+h[n][v-1];break;default:i+=+h[n][v-2],j+=+h[n][v-1]}}return h.toString=e,d.rel=f(h),h}function z(b){var d=c(b);if(d.abs)return f(d.abs);if(J(b,"array")&&J(b&&b[0],"array")||(b=a.parsePathString(b)),!b||!b.length)return[["M",0,0]];var g,h=[],i=0,j=0,k=0,l=0,m=0;"M"==b[0][0]&&(i=+b[0][1],j=+b[0][2],k=i,l=j,m++,h[0]=["M",i,j]);for(var n,o,p=3==b.length&&"M"==b[0][0]&&"R"==b[1][0].toUpperCase()&&"Z"==b[2][0].toUpperCase(),q=m,r=b.length;r>q;q++){if(h.push(n=[]),o=b[q],g=o[0],g!=g.toUpperCase())switch(n[0]=g.toUpperCase(),n[0]){case"A":n[1]=o[1],n[2]=o[2],n[3]=o[3],n[4]=o[4],n[5]=o[5],n[6]=+(o[6]+i),n[7]=+(o[7]+j);break;case"V":n[1]=+o[1]+j;break;case"H":n[1]=+o[1]+i;break;case"R":for(var s=[i,j].concat(o.slice(1)),t=2,u=s.length;u>t;t++)s[t]=+s[t]+i,s[++t]=+s[t]+j;h.pop(),h=h.concat(H(s,p));break;case"O":h.pop(),s=x(i,j,o[1],o[2]),s.push(s[0]),h=h.concat(s);break;case"U":h.pop(),h=h.concat(x(i,j,o[1],o[2],o[3])),n=["U"].concat(h[h.length-1].slice(-2));break;case"M":k=+o[1]+i,l=+o[2]+j;default:for(t=1,u=o.length;u>t;t++)n[t]=+o[t]+(t%2?i:j)}else if("R"==g)s=[i,j].concat(o.slice(1)),h.pop(),h=h.concat(H(s,p)),n=["R"].concat(o.slice(-2));else if("O"==g)h.pop(),s=x(i,j,o[1],o[2]),s.push(s[0]),h=h.concat(s);else if("U"==g)h.pop(),h=h.concat(x(i,j,o[1],o[2],o[3])),n=["U"].concat(h[h.length-1].slice(-2));else for(var v=0,w=o.length;w>v;v++)n[v]=o[v];if(g=g.toUpperCase(),"O"!=g)switch(n[0]){case"Z":i=k,j=l;break;case"H":i=n[1];break;case"V":j=n[1];break;case"M":k=n[n.length-2],l=n[n.length-1];default:i=n[n.length-2],j=n[n.length-1]}}return h.toString=e,d.abs=f(h),h}function A(a,b,c,d){return[a,b,c,d,c,d]}function B(a,b,c,d,e,f){var g=1/3,h=2/3;return[g*a+h*c,g*b+h*d,g*e+h*c,g*f+h*d,e,f]}function C(b,c,d,e,f,g,h,i,j,k){var l,m=120*P/180,n=P/180*(+f||0),o=[],p=a._.cacher(function(a,b,c){var d=a*O.cos(c)-b*O.sin(c),e=a*O.sin(c)+b*O.cos(c);return{x:d,y:e}});if(k)y=k[0],z=k[1],w=k[2],x=k[3];else{l=p(b,c,-n),b=l.x,c=l.y,l=p(i,j,-n),i=l.x,j=l.y;var q=(O.cos(P/180*f),O.sin(P/180*f),(b-i)/2),r=(c-j)/2,s=q*q/(d*d)+r*r/(e*e);s>1&&(s=O.sqrt(s),d=s*d,e=s*e);var t=d*d,u=e*e,v=(g==h?-1:1)*O.sqrt(T((t*u-t*r*r-u*q*q)/(t*r*r+u*q*q))),w=v*d*r/e+(b+i)/2,x=v*-e*q/d+(c+j)/2,y=O.asin(((c-x)/e).toFixed(9)),z=O.asin(((j-x)/e).toFixed(9));y=w>b?P-y:y,z=w>i?P-z:z,0>y&&(y=2*P+y),0>z&&(z=2*P+z),h&&y>z&&(y-=2*P),!h&&z>y&&(z-=2*P)}var A=z-y;if(T(A)>m){var B=z,D=i,E=j;z=y+m*(h&&z>y?1:-1),i=w+d*O.cos(z),j=x+e*O.sin(z),o=C(i,j,d,e,f,0,h,D,E,[z,B,w,x])}A=z-y;var F=O.cos(y),G=O.sin(y),H=O.cos(z),I=O.sin(z),J=O.tan(A/4),K=4/3*d*J,L=4/3*e*J,M=[b,c],N=[b+K*G,c-L*F],Q=[i+K*I,j-L*H],R=[i,j];if(N[0]=2*M[0]-N[0],N[1]=2*M[1]-N[1],k)return[N,Q,R].concat(o);o=[N,Q,R].concat(o).join().split(",");for(var S=[],U=0,V=o.length;V>U;U++)S[U]=U%2?p(o[U-1],o[U],n).y:p(o[U],o[U+1],n).x;return S}function D(a,b,c,d,e,f,g,h,i){var j=1-i;return{x:S(j,3)*a+3*S(j,2)*i*c+3*j*i*i*e+S(i,3)*g,y:S(j,3)*b+3*S(j,2)*i*d+3*j*i*i*f+S(i,3)*h}}function E(a,b,c,d,e,f,g,h){var i,j=e-2*c+a-(g-2*e+c),k=2*(c-a)-2*(e-c),l=a-c,m=(-k+O.sqrt(k*k-4*j*l))/2/j,n=(-k-O.sqrt(k*k-4*j*l))/2/j,o=[b,h],p=[a,g];return T(m)>"1e12"&&(m=.5),T(n)>"1e12"&&(n=.5),m>0&&1>m&&(i=D(a,b,c,d,e,f,g,h,m),p.push(i.x),o.push(i.y)),n>0&&1>n&&(i=D(a,b,c,d,e,f,g,h,n),p.push(i.x),o.push(i.y)),j=f-2*d+b-(h-2*f+d),k=2*(d-b)-2*(f-d),l=b-d,m=(-k+O.sqrt(k*k-4*j*l))/2/j,n=(-k-O.sqrt(k*k-4*j*l))/2/j,T(m)>"1e12"&&(m=.5),T(n)>"1e12"&&(n=.5),m>0&&1>m&&(i=D(a,b,c,d,e,f,g,h,m),p.push(i.x),o.push(i.y)),n>0&&1>n&&(i=D(a,b,c,d,e,f,g,h,n),p.push(i.x),o.push(i.y)),{min:{x:Q.apply(0,p),y:Q.apply(0,o)},max:{x:R.apply(0,p),y:R.apply(0,o)}}}function F(a,b){var d=!b&&c(a);if(!b&&d.curve)return f(d.curve);for(var e=z(a),g=b&&z(b),h={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},i={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},j=(function(a,b){var c,d;if(!a)return["C",b.x,b.y,b.x,b.y,b.x,b.y];switch(!(a[0]in{T:1,Q:1})&&(b.qx=b.qy=null),a[0]){case"M":b.X=a[1],b.Y=a[2];break;case"A":a=["C"].concat(C.apply(0,[b.x,b.y].concat(a.slice(1))));break;case"S":c=b.x+(b.x-(b.bx||b.x)),d=b.y+(b.y-(b.by||b.y)),a=["C",c,d].concat(a.slice(1));break;case"T":b.qx=b.x+(b.x-(b.qx||b.x)),b.qy=b.y+(b.y-(b.qy||b.y)),a=["C"].concat(B(b.x,b.y,b.qx,b.qy,a[1],a[2]));break;case"Q":b.qx=a[1],b.qy=a[2],a=["C"].concat(B(b.x,b.y,a[1],a[2],a[3],a[4]));break;case"L":a=["C"].concat(A(b.x,b.y,a[1],a[2]));break;case"H":a=["C"].concat(A(b.x,b.y,a[1],b.y));break;case"V":a=["C"].concat(A(b.x,b.y,b.x,a[1]));break;case"Z":a=["C"].concat(A(b.x,b.y,b.X,b.Y))}return a}),k=function(a,b){if(a[b].length>7){a[b].shift();for(var c=a[b];c.length;)a.splice(b++,0,["C"].concat(c.splice(0,6)));a.splice(b,1),n=R(e.length,g&&g.length||0)}},l=function(a,b,c,d,f){a&&b&&"M"==a[f][0]&&"M"!=b[f][0]&&(b.splice(f,0,["M",d.x,d.y]),c.bx=0,c.by=0,c.x=a[f][1],c.y=a[f][2],n=R(e.length,g&&g.length||0))},m=0,n=R(e.length,g&&g.length||0);n>m;m++){e[m]=j(e[m],h),k(e,m),g&&(g[m]=j(g[m],i)),g&&k(g,m),l(e,g,h,i,m),l(g,e,i,h,m);var o=e[m],p=g&&g[m],q=o.length,r=g&&p.length;h.x=o[q-2],h.y=o[q-1],h.bx=N(o[q-4])||h.x,h.by=N(o[q-3])||h.y,i.bx=g&&(N(p[r-4])||i.x),i.by=g&&(N(p[r-3])||i.y),i.x=g&&p[r-2],i.y=g&&p[r-1]}return g||(d.curve=f(e)),g?[e,g]:e}function G(a,b){if(!b)return a;var c,d,e,f,g,h,i;for(a=F(a),e=0,g=a.length;g>e;e++)for(i=a[e],f=1,h=i.length;h>f;f+=2)c=b.x(i[f],i[f+1]),d=b.y(i[f],i[f+1]),i[f]=c,i[f+1]=d;return a}function H(a,b){for(var c=[],d=0,e=a.length;e-2*!b>d;d+=2){var f=[{x:+a[d-2],y:+a[d-1]},{x:+a[d],y:+a[d+1]},{x:+a[d+2],y:+a[d+3]},{x:+a[d+4],y:+a[d+5]}];b?d?e-4==d?f[3]={x:+a[0],y:+a[1]}:e-2==d&&(f[2]={x:+a[0],y:+a[1]},f[3]={x:+a[2],y:+a[3]}):f[0]={x:+a[e-2],y:+a[e-1]}:e-4==d?f[3]=f[2]:d||(f[0]={x:+a[d],y:+a[d+1]}),c.push(["C",(-f[0].x+6*f[1].x+f[2].x)/6,(-f[0].y+6*f[1].y+f[2].y)/6,(f[1].x+6*f[2].x-f[3].x)/6,(f[1].y+6*f[2].y-f[3].y)/6,f[2].x,f[2].y])}return c}var I=b.prototype,J=a.is,K=a._.clone,L="hasOwnProperty",M=/,?([a-z]),?/gi,N=parseFloat,O=Math,P=O.PI,Q=O.min,R=O.max,S=O.pow,T=O.abs,U=h(1),V=h(),W=h(0,1),X=a._unit2px,Y={path:function(a){return a.attr("path")},circle:function(a){var b=X(a);return x(b.cx,b.cy,b.r)},ellipse:function(a){var b=X(a);return x(b.cx,b.cy,b.rx,b.ry)},rect:function(a){var b=X(a);return w(b.x,b.y,b.width,b.height,b.rx,b.ry)},image:function(a){var b=X(a);return w(b.x,b.y,b.width,b.height)},text:function(a){var b=a.node.getBBox();return w(b.x,b.y,b.width,b.height)},g:function(a){var b=a.node.getBBox();return w(b.x,b.y,b.width,b.height)},symbol:function(a){var b=a.getBBox();return w(b.x,b.y,b.width,b.height)},polyline:function(a){return"M"+a.attr("points")},polygon:function(a){return"M"+a.attr("points")+"z"}};a.path=c,a.path.getTotalLength=U,a.path.getPointAtLength=V,a.path.getSubpath=function(a,b,c){if(this.getTotalLength(a)-c<1e-6)return W(a,b).end;var d=W(a,c,1);return b?W(d,b).end:d},I.getTotalLength=function(){return this.node.getTotalLength?this.node.getTotalLength():void 0},I.getPointAtLength=function(a){return V(this.attr("d"),a)},I.getSubpath=function(b,c){return a.path.getSubpath(this.attr("d"),b,c)},a._.box=d,a.path.findDotsAtSegment=i,a.path.bezierBBox=j,a.path.isPointInsideBBox=k,a.path.isBBoxIntersect=l,a.path.intersection=r,a.path.intersectionNumber=s,a.path.isPointInside=u,a.path.getBBox=v,a.path.get=Y,a.path.toRelative=y,a.path.toAbsolute=z,a.path.toCubic=F,a.path.map=G,a.path.toString=e,a.path.clone=f}),d.plugin(function(a){var b=Math.max,c=Math.min,d=function(a){if(this.items=[],this.length=0,this.type="set",a)for(var b=0,c=a.length;c>b;b++)a[b]&&(this[this.items.length]=this.items[this.items.length]=a[b],this.length++)},e=d.prototype;e.push=function(){for(var a,b,c=0,d=arguments.length;d>c;c++)a=arguments[c],a&&(b=this.items.length,this[b]=this.items[b]=a,this.length++);return this},e.pop=function(){return this.length&&delete this[this.length--],this.items.pop()},e.forEach=function(a,b){for(var c=0,d=this.items.length;d>c;c++)if(a.call(b,this.items[c],c)===!1)return this;return this},e.attr=function(a){for(var b=0,c=this.items.length;c>b;b++)this.items[b].attr(a);return this},e.clear=function(){for(;this.length;)this.pop()},e.splice=function(a,e){a=0>a?b(this.length+a,0):a,e=b(0,c(this.length-a,e));var f,g=[],h=[],i=[];for(f=2;ff;f++)h.push(this[a+f]);for(;ff?i[f]:g[f-j];for(f=this.items.length=this.length-=e-j;this[f];)delete this[f++];return new d(h)},e.exclude=function(a){for(var b=0,c=this.length;c>b;b++)if(this[b]==a)return this.splice(b,1),!0;return!1},e.insertAfter=function(a){for(var b=this.items.length;b--;)this.items[b].insertAfter(a);return this},e.getBBox=function(){for(var a=[],d=[],e=[],f=[],g=this.items.length;g--;)if(!this.items[g].removed){var h=this.items[g].getBBox();a.push(h.x),d.push(h.y),e.push(h.x+h.width),f.push(h.y+h.height)}return a=c.apply(0,a),d=c.apply(0,d),e=b.apply(0,e),f=b.apply(0,f),{x:a,y:d,x2:e,y2:f,width:e-a,height:f-d,cx:a+(e-a)/2,cy:d+(f-d)/2}},e.clone=function(a){a=new d;for(var b=0,c=this.items.length;c>b;b++)a.push(this.items[b].clone());return a},e.toString=function(){return"Snap‘s set"},e.type="set",a.set=function(){var a=new d;return arguments.length&&a.push.apply(a,Array.prototype.slice.call(arguments,0)),a}}),d.plugin(function(a,b){function c(a){var b=a[0];switch(b.toLowerCase()){case"t":return[b,0,0];case"m":return[b,1,0,0,1,0,0];case"r":return 4==a.length?[b,0,a[2],a[3]]:[b,0];case"s":return 5==a.length?[b,1,1,a[3],a[4]]:3==a.length?[b,1,1]:[b,1]}}function d(b,d,e){d=l(d).replace(/\.{3}|\u2026/g,b),b=a.parseTransformString(b)||[],d=a.parseTransformString(d)||[];for(var f,g,j,k,m=Math.max(b.length,d.length),n=[],o=[],p=0;m>p;p++){if(j=b[p]||c(d[p]),k=d[p]||c(j),j[0]!=k[0]||"r"==j[0].toLowerCase()&&(j[2]!=k[2]||j[3]!=k[3])||"s"==j[0].toLowerCase()&&(j[3]!=k[3]||j[4]!=k[4])){b=a._.transform2matrix(b,e()),d=a._.transform2matrix(d,e()),n=[["m",b.a,b.b,b.c,b.d,b.e,b.f]],o=[["m",d.a,d.b,d.c,d.d,d.e,d.f]];break}for(n[p]=[],o[p]=[],f=0,g=Math.max(j.length,k.length);g>f;f++)f in j&&(n[p][f]=j[f]),f in k&&(o[p][f]=k[f])}return{from:i(n),to:i(o),f:h(n)}}function e(a){return a}function f(a){return function(b){return+b.toFixed(3)+a}}function g(b){return a.rgb(b[0],b[1],b[2])}function h(a){var b,c,d,e,f,g,h=0,i=[];for(b=0,c=a.length;c>b;b++){for(f="[",g=['"'+a[b][0]+'"'],d=1,e=a[b].length;e>d;d++)g[d]="val["+h++ +"]";f+=g+"]",i[b]=f}return Function("val","return Snap.path.toString.call(["+i+"])")}function i(a){for(var b=[],c=0,d=a.length;d>c;c++)for(var e=1,f=a[c].length;f>e;e++)b.push(a[c][e]);return b}var j={},k=/[a-z]+$/i,l=String;j.stroke=j.fill="colour",b.prototype.equal=function(b,c){var m,n,o=l(this.attr(b)||""),p=this;if(o==+o&&c==+c)return{from:+o,to:+c,f:e};if("colour"==j[b])return m=a.color(o),n=a.color(c),{from:[m.r,m.g,m.b,m.opacity],to:[n.r,n.g,n.b,n.opacity],f:g};if("transform"==b||"gradientTransform"==b||"patternTransform"==b)return d(o,c,function(){return p.getBBox(1)});if("d"==b||"path"==b)return m=a.path.toCubic(o,c),{from:i(m[0]),to:i(m[1]),f:h(m[0])};var q=o.match(k),r=c.match(k);return q&&q==r?{from:parseFloat(o),to:parseFloat(c),f:f(q)}:{from:this.asPX(b),to:this.asPX(b,c),f:e}}}),d.plugin(function(a,c,d,e){for(var f=c.prototype,g="hasOwnProperty",h=("createTouch"in e.doc),i=["click","dblclick","mousedown","mousemove","mouseout","mouseover","mouseup","touchstart","touchmove","touchend","touchcancel"],j={mousedown:"touchstart",mousemove:"touchmove",mouseup:"touchend"},k=function(a){var b="y"==a?"scrollTop":"scrollLeft";
return e.doc.documentElement[b]||e.doc.body[b]},l=function(){this.returnValue=!1},m=function(){return this.originalEvent.preventDefault()},n=function(){this.cancelBubble=!0},o=function(){return this.originalEvent.stopPropagation()},p=function(){return e.doc.addEventListener?function(a,b,c,d){var e=h&&j[b]?j[b]:b,f=function(e){var f=k("y"),i=k("x"),l=e.clientX+i,n=e.clientY+f;if(h&&j[g](b))for(var p=0,q=e.targetTouches&&e.targetTouches.length;q>p;p++)if(e.targetTouches[p].target==a){var r=e;e=e.targetTouches[p],e.originalEvent=r,e.preventDefault=m,e.stopPropagation=o;break}return c.call(d,e,l,n)};return a.addEventListener(e,f,!1),function(){return a.removeEventListener(e,f,!1),!0}}:e.doc.attachEvent?function(a,b,c,d){var f=function(a){a=a||e.win.event;var b=k("y"),f=k("x"),g=a.clientX+f,h=a.clientY+b;return a.preventDefault=a.preventDefault||l,a.stopPropagation=a.stopPropagation||n,c.call(d,a,g,h)};a.attachEvent("on"+b,f);var g=function(){return a.detachEvent("on"+b,f),!0};return g}:void 0}(),q=[],r=function(c){for(var d,e=c.clientX,f=c.clientY,g=k("y"),i=k("x"),j=q.length;j--;){if(d=q[j],h){for(var l,m=c.touches.length;m--;)if(l=c.touches[m],l.identifier==d.el._drag.id){e=l.clientX,f=l.clientY,(c.originalEvent?c.originalEvent:c).preventDefault();break}}else c.preventDefault();var n=d.el.node;a._.glob,n.nextSibling,n.parentNode,n.style.display,e+=i,f+=g,b("snap.drag.move."+d.el.id,d.move_scope||d.el,e-d.el._drag.x,f-d.el._drag.y,e,f,c)}},s=function(c){a.unmousemove(r).unmouseup(s);for(var d,e=q.length;e--;)d=q[e],d.el._drag={},b("snap.drag.end."+d.el.id,d.end_scope||d.start_scope||d.move_scope||d.el,c);q=[]},t=i.length;t--;)!function(b){a[b]=f[b]=function(c,d){return a.is(c,"function")&&(this.events=this.events||[],this.events.push({name:b,f:c,unbind:p(this.shape||this.node||e.doc,b,c,d||this)})),this},a["un"+b]=f["un"+b]=function(a){for(var c=this.events||[],d=c.length;d--;)if(c[d].name==b&&(c[d].f==a||!a))return c[d].unbind(),c.splice(d,1),!c.length&&delete this.events,this;return this}}(i[t]);f.hover=function(a,b,c,d){return this.mouseover(a,c).mouseout(b,d||c)},f.unhover=function(a,b){return this.unmouseover(a).unmouseout(b)};var u=[];f.drag=function(c,d,e,f,g,h){function i(i){(i.originalEvent||i).preventDefault();var j=k("y"),l=k("x");this._drag.x=i.clientX+l,this._drag.y=i.clientY+j,this._drag.id=i.identifier,!q.length&&a.mousemove(r).mouseup(s),q.push({el:this,move_scope:f,start_scope:g,end_scope:h}),d&&b.on("snap.drag.start."+this.id,d),c&&b.on("snap.drag.move."+this.id,c),e&&b.on("snap.drag.end."+this.id,e),b("snap.drag.start."+this.id,g||f||this,i.clientX+l,i.clientY+j,i)}if(!arguments.length){var j;return this.drag(function(a,b){this.attr({transform:j+(j?"T":"t")+[a,b]})},function(){j=this.transform().local})}return this._drag={},u.push({el:this,start:i}),this.mousedown(i),this},f.undrag=function(){for(var c=u.length;c--;)u[c].el==this&&(this.unmousedown(u[c].start),u.splice(c,1),b.unbind("snap.drag.*."+this.id));return!u.length&&a.unmousemove(r).unmouseup(s),this}}),d.plugin(function(a,c,d){var e=(c.prototype,d.prototype),f=/^\s*url\((.+)\)/,g=String,h=a._.$;a.filter={},e.filter=function(b){var d=this;"svg"!=d.type&&(d=d.paper);var e=a.parse(g(b)),f=a._.id(),i=d.node.offsetWidth,j=d.node.offsetHeight,k=h("filter");return h(k,{id:f,filterUnits:"userSpaceOnUse",x:0,y:0,width:i,height:j}),k.appendChild(e.node),d.defs.appendChild(k),new c(k)},b.on("snap.util.getattr.filter",function(){b.stop();var c=h(this.node,"filter");if(c){var d=g(c).match(f);return d&&a.select(d[1])}}),b.on("snap.util.attr.filter",function(a){if(a instanceof c&&"filter"==a.type){b.stop();var d=a.node.id;d||(h(a.node,{id:a.id}),d=a.id),h(this.node,{filter:"url(#"+d+")"})}a&&"none"!=a||(b.stop(),this.node.removeAttribute("filter"))}),a.filter.blur=function(b,c){null==b&&(b=2);var d=null==c?b:[b,c];return a.format('',{def:d})},a.filter.blur.toString=function(){return this()},a.filter.shadow=function(b,c,d,e){return e=e||"#000",null==d&&(d=4),"string"==typeof d&&(e=d,d=4),null==b&&(b=0,c=2),null==c&&(c=b),e=a.color(e),a.format('',{color:e,dx:b,dy:c,blur:d})},a.filter.shadow.toString=function(){return this()},a.filter.grayscale=function(b){return null==b&&(b=1),a.format('',{a:.2126+.7874*(1-b),b:.7152-.7152*(1-b),c:.0722-.0722*(1-b),d:.2126-.2126*(1-b),e:.7152+.2848*(1-b),f:.0722-.0722*(1-b),g:.2126-.2126*(1-b),h:.0722+.9278*(1-b)})},a.filter.grayscale.toString=function(){return this()},a.filter.sepia=function(b){return null==b&&(b=1),a.format('',{a:.393+.607*(1-b),b:.769-.769*(1-b),c:.189-.189*(1-b),d:.349-.349*(1-b),e:.686+.314*(1-b),f:.168-.168*(1-b),g:.272-.272*(1-b),h:.534-.534*(1-b),i:.131+.869*(1-b)})},a.filter.sepia.toString=function(){return this()},a.filter.saturate=function(b){return null==b&&(b=1),a.format('',{amount:1-b})},a.filter.saturate.toString=function(){return this()},a.filter.hueRotate=function(b){return b=b||0,a.format('',{angle:b})},a.filter.hueRotate.toString=function(){return this()},a.filter.invert=function(b){return null==b&&(b=1),a.format('',{amount:b,amount2:1-b})},a.filter.invert.toString=function(){return this()},a.filter.brightness=function(b){return null==b&&(b=1),a.format('',{amount:b})},a.filter.brightness.toString=function(){return this()},a.filter.contrast=function(b){return null==b&&(b=1),a.format('',{amount:b,amount2:.5-b/2})},a.filter.contrast.toString=function(){return this()}}),d});
\ No newline at end of file
diff --git a/dist/snap.svg.js b/dist/snap.svg.js
index e124708..ed1bb83 100644
--- a/dist/snap.svg.js
+++ b/dist/snap.svg.js
@@ -14,7 +14,7 @@
// See the License for the specific language governing permissions and
// limitations under the License.
//
-// build: 2013-10-06
+// build: 2013-10-14
// Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
@@ -524,30 +524,31 @@ var mina = (function (eve) {
}
len && requestAnimFrame(frame);
},
+ // SIERRA Unfamiliar with the word _slave_ in this context. Also, I don't know what _gereal_ means. Do you mean _general_?
/*\
* mina
[ method ]
**
- * Generic animation of numbers.
+ * Generic animation of numbers
**
- - a (number) start “slave” number
- - A (number) end “slave” number
- - b (number) start “master” number (start time in gereal case)
- - B (number) end “master” number (end time in gereal case)
- - get (function) getter of “master” number (see @mina.time)
- - set (function) setter of “slave” number
+ - a (number) start _slave_ number
+ - A (number) end _slave_ number
+ - b (number) start _master_ number (start time in gereal case)
+ - B (number) end _master_ number (end time in gereal case)
+ - get (function) getter of _master_ number (see @mina.time)
+ - set (function) setter of _slave_ number
- easing (function) #optional easing function, default is @mina.linear
= (object) animation descriptor
o {
o id (string) animation id,
- o start (number) start “slave” number,
- o end (number) end “slave” number,
- o b (number) start “master” number,
+ o start (number) start _slave_ number,
+ o end (number) end _slave_ number,
+ o b (number) start _master_ number,
o s (number) animation status (0..1),
o dur (number) animation duration,
o spd (number) animation speed,
- o get (function) getter of “master” number (see @mina.time),
- o set (function) setter of “slave” number,
+ o get (function) getter of _master_ number (see @mina.time),
+ o set (function) setter of _slave_ number,
o easing (function) easing function, default is @mina.linear,
o status (function) status getter/setter,
o speed (function) speed getter/setter,
@@ -589,7 +590,7 @@ var mina = (function (eve) {
* mina.time
[ method ]
**
- * Returns current time. Equal to
+ * Returns the current time. Equivalent to:
| function () {
| return (new Date).getTime();
| }
@@ -599,8 +600,8 @@ var mina = (function (eve) {
* mina.getById
[ method ]
**
- * Returns animation by it’s id.
- - id (string) animation’s id
+ * Returns an animation by its id
+ - id (string) animation's id
= (object) See @mina
\*/
mina.getById = function (id) {
@@ -611,7 +612,7 @@ var mina = (function (eve) {
* mina.linear
[ method ]
**
- * Default linear easing.
+ * Default linear easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -622,7 +623,7 @@ var mina = (function (eve) {
* mina.easeout
[ method ]
**
- * Easeout easing.
+ * Easeout easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -633,7 +634,7 @@ var mina = (function (eve) {
* mina.easein
[ method ]
**
- * Easein easing.
+ * Easein easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -644,7 +645,7 @@ var mina = (function (eve) {
* mina.easeinout
[ method ]
**
- * Easeinout easing.
+ * Easeinout easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -668,7 +669,7 @@ var mina = (function (eve) {
* mina.backin
[ method ]
**
- * Backin easing.
+ * Backin easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -683,7 +684,7 @@ var mina = (function (eve) {
* mina.backout
[ method ]
**
- * Backout easing.
+ * Backout easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -699,7 +700,7 @@ var mina = (function (eve) {
* mina.elastic
[ method ]
**
- * Elastic easing.
+ * Elastic easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -714,7 +715,7 @@ var mina = (function (eve) {
* mina.bounce
[ method ]
**
- * Bounce easing.
+ * Bounce easing
- n (number) input 0..1
= (number) output 0..1
\*/
@@ -1110,16 +1111,17 @@ var mina = (function (eve) {
var Snap = (function() {
Snap.version = "0.0.1";
+// SIERRA: this method appears to be missing from HTML output
/*\
* Snap
[ method ]
**
- * Creates drawing surface or wraps existing SVG element.
+ * Creates a drawing surface or wraps existing SVG element
**
- width (number|string) width of surface
- height (number|string) height of surface
* or
- - dom (SVGElement) element to be wrapped into Snap structure
+ - DOM (SVGElement) element to be wrapped into Snap structure
* or
- query (string) CSS query selector
= (object) @Element
@@ -1249,13 +1251,13 @@ function is(o, type) {
* Snap.format
[ method ]
**
- * Replaces construction of type “`{}`” to the corresponding argument.
+ * Replaces construction of type `{}` to the corresponding argument
**
- token (string) string to format
- - json (object) object which properties will be used as a replacement
- = (string) formated string
+ - json (object) object which properties are used as a replacement
+ = (string) formatted string
> Usage
- | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z"
+ | // this draws a rectangular shape equivalent to "M10,20h40v50h-40z"
| paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", {
| x: 10,
| y: 20,
@@ -1372,7 +1374,7 @@ function x_y_w_h() {
**
* Transform angle to radians
- deg (number) angle in degrees
- = (number) angle in radians.
+ = (number) angle in radians
\*/
Snap.rad = rad;
/*\
@@ -1380,15 +1382,16 @@ Snap.rad = rad;
[ method ]
**
* Transform angle to degrees
- - deg (number) angle in radians
- = (number) angle in degrees.
+ - rad (number) angle in radians
+ = (number) angle in degrees
\*/
Snap.deg = deg;
+// SIERRA for which point is the angle calculated?
/*\
* Snap.angle
[ method ]
**
- * Returns angle between two or three points.
+ * Returns an angle between two or three points
> Parameters
- x1 (number) x coord of first point
- y1 (number) y coord of first point
@@ -1396,28 +1399,28 @@ Snap.deg = deg;
- y2 (number) y coord of second point
- x3 (number) #optional x coord of third point
- y3 (number) #optional y coord of third point
- = (number) angle in degrees.
+ = (number) angle in degrees
\*/
Snap.angle = angle;
/*\
* Snap.is
[ method ]
**
- * Handfull replacement for `typeof` operator.
+ * Handy replacement for the `typeof` operator
- o (…) any object or primitive
- - type (string) name of the type, i.e. “string”, “function”, “number”, etc.
- = (boolean) is given value is of given type
+ - type (string) name of the type, e.g., `string`, `function`, `number`, etc.
+ = (boolean) `true` if given value is of given type
\*/
Snap.is = is;
/*\
* Snap.snapTo
[ method ]
**
- * Snaps given value to given grid.
+ * Snaps given value to given grid
- values (array|number) given array of values or step of the grid
- value (number) value to adjust
- - tolerance (number) #optional tolerance for snapping. Default is `10`.
- = (number) adjusted value.
+ - tolerance (number) #optional maximum distance to the target value that would trigger the snap. Default is `10`.
+ = (number) adjusted value
\*/
Snap.snapTo = function (values, value, tolerance) {
tolerance = is(tolerance, "finite") ? tolerance : 10;
@@ -1471,7 +1474,7 @@ function Matrix(a, b, c, d, e, f) {
* Matrix.add
[ method ]
**
- * Adds given matrix to existing one.
+ * Adds the given matrix to existing one
- a (number)
- b (number)
- c (number)
@@ -1508,11 +1511,12 @@ function Matrix(a, b, c, d, e, f) {
this.f = out[1][2];
return this;
};
+// SIERRA Matrix.invert(): Unclear what it means to invert a matrix.
/*\
* Matrix.invert
[ method ]
**
- * Returns inverted version of the matrix
+ * Returns an inverted version of the matrix
= (object) @Matrix
\*/
matrixproto.invert = function () {
@@ -1524,7 +1528,7 @@ function Matrix(a, b, c, d, e, f) {
* Matrix.clone
[ method ]
**
- * Returns copy of the matrix
+ * Returns a copy of the matrix
= (object) @Matrix
\*/
matrixproto.clone = function () {
@@ -1535,21 +1539,22 @@ function Matrix(a, b, c, d, e, f) {
[ method ]
**
* Translate the matrix
- - x (number)
- - y (number)
+ - x (number) horizontal offset distance
+ - y (number) vertical offset distance
\*/
matrixproto.translate = function (x, y) {
return this.add(1, 0, 0, 1, x, y);
};
+ // SIERRA: do cx/cy default to the center point, as in CSS? If so, Snap appears to resolve important discrepancies between how transforms behave in SVG & CSS.
/*\
* Matrix.scale
[ method ]
**
* Scales the matrix
- - x (number)
- - y (number) #optional
- - cx (number) #optional
- - cy (number) #optional
+ - x (number) amount to be scaled, with `1` resulting in no change
+ - y (number) #optional amount to scale along the vertical axis. (Otherwise `x` applies to both axes.)
+ - cx (number) #optional horizontal origin point from which to scale
+ - cy (number) #optional vertical origin point from which to scale
\*/
matrixproto.scale = function (x, y, cx, cy) {
y == null && (y = x);
@@ -1563,9 +1568,9 @@ function Matrix(a, b, c, d, e, f) {
[ method ]
**
* Rotates the matrix
- - a (number)
- - x (number)
- - y (number)
+ - a (number) angle of rotation, in degrees
+ - x (number) horizontal origin point from which to rotate
+ - y (number) vertical origin point from which to rotate
\*/
matrixproto.rotate = function (a, x, y) {
a = rad(a);
@@ -1580,7 +1585,7 @@ function Matrix(a, b, c, d, e, f) {
* Matrix.x
[ method ]
**
- * Return x coordinate for given point after transformation described by the matrix. See also @Matrix.y
+ * Returns x coordinate for given point after transformation described by the matrix. See also @Matrix.y
- x (number)
- y (number)
= (number) x
@@ -1592,7 +1597,7 @@ function Matrix(a, b, c, d, e, f) {
* Matrix.y
[ method ]
**
- * Return y coordinate for given point after transformation described by the matrix. See also @Matrix.x
+ * Returns y coordinate for given point after transformation described by the matrix. See also @Matrix.x
- x (number)
- y (number)
= (number) y
@@ -1617,6 +1622,9 @@ function Matrix(a, b, c, d, e, f) {
a[0] && (a[0] /= mag);
a[1] && (a[1] /= mag);
}
+// SIERRA Matrix.split(): HTML formatting for the return value is scrambled. It should appear _Returns: {OBJECT} in format:..._
+// SIERRA Matrix.split(): the _shear_ parameter needs to be detailed. Is it an angle? What does it affect?
+// SIERRA Matrix.split(): The idea of _simple_ transforms needs to be detailed and contrasted with any alternatives.
/*\
* Matrix.split
[ method ]
@@ -1666,11 +1674,12 @@ function Matrix(a, b, c, d, e, f) {
out.noRotation = !+out.shear.toFixed(9) && !out.rotate;
return out;
};
+// SIERRA Matrix.toTransformString(): The format of the string needs to be detailed.
/*\
* Matrix.toTransformString
[ method ]
**
- * Return transform string that represents given matrix
+ * Returns transform string that represents given matrix
= (string) transform string
\*/
matrixproto.toTransformString = function (shorter) {
@@ -1687,13 +1696,14 @@ function Matrix(a, b, c, d, e, f) {
}
};
})(Matrix.prototype);
+// SIERRA Unclear the difference between the two matrix formats ("parameters" vs svgMatrix). See my comment about Element.matrix().
/*\
* Snap.Matrix
[ method ]
**
* Utility method
**
- * Returns matrix based on given parameters.
+ * Returns a matrix based on the given parameters
- a (number)
- b (number)
- c (number)
@@ -1710,33 +1720,33 @@ Snap.Matrix = Matrix;
* Snap.getRGB
[ method ]
**
- * Parses colour string as RGB object
- - colour (string) colour string in one of formats:
+ * Parses color string as RGB object
+ - color (string) color string in one of the following formats:
#
- # - Colour name (“
red
”, “green
”, “cornflowerblue
”, etc)
- # - #••• — shortened HTML colour: (“
#000
”, “#fc0
”, etc)
- # - #•••••• — full length HTML colour: (“
#000000
”, “#bd2300
”)
- # - rgb(•••, •••, •••) — red, green and blue channels values: (“
rgb(200, 100, 0)
”)
+ # - Color name (
red
, green
, cornflowerblue
, etc)
+ # - #••• — shortened HTML color: (
#000
, #fc0
, etc.)
+ # - #•••••• — full length HTML color: (
#000000
, #bd2300
)
+ # - rgb(•••, •••, •••) — red, green and blue channels values: (
rgb(200, 100, 0)
)
# - rgba(•••, •••, •••, •••) — also with opacity
- # - rgb(•••%, •••%, •••%) — same as above, but in %: (“
rgb(100%, 175%, 0%)
”)
+ # - rgb(•••%, •••%, •••%) — same as above, but in %: (
rgb(100%, 175%, 0%)
)
# - rgba(•••%, •••%, •••%, •••%) — also with opacity
- # - hsb(•••, •••, •••) — hue, saturation and brightness values: (“
hsb(0.5, 0.25, 1)
”)
+ # - hsb(•••, •••, •••) — hue, saturation and brightness values: (
hsb(0.5, 0.25, 1)
)
# - hsba(•••, •••, •••, •••) — also with opacity
# - hsb(•••%, •••%, •••%) — same as above, but in %
# - hsba(•••%, •••%, •••%, •••%) — also with opacity
- # - hsl(•••, •••, •••) — hue, saturation and luminosity values: (“
hsb(0.5, 0.25, 0.5)
”)
+ # - hsl(•••, •••, •••) — hue, saturation and luminosity values: (
hsb(0.5, 0.25, 0.5)
)
# - hsla(•••, •••, •••, •••) — also with opacity
# - hsl(•••%, •••%, •••%) — same as above, but in %
# - hsla(•••%, •••%, •••%, •••%) — also with opacity
#
* Note that `%` can be used any time: `rgb(20%, 255, 50%)`.
- = (object) RGB object in format:
+ = (object) RGB object in the following format:
o {
o r (number) red,
o g (number) green,
- o b (number) blue
+ o b (number) blue,
o hex (string) color in HTML/CSS format: #••••••,
- o error (boolean) true if string cant be parsed
+ o error (boolean) true if string can't be parsed
o }
\*/
Snap.getRGB = cacher(function (colour) {
@@ -1817,15 +1827,16 @@ Snap.getRGB = cacher(function (colour) {
}
return {r: -1, g: -1, b: -1, hex: "none", error: 1, toString: rgbtoString};
}, Snap);
+// SIERRA It seems odd that the following 3 conversion methods are not expressed as .this2that(), like the others.
/*\
* Snap.hsb
[ method ]
**
- * Converts HSB values to hex representation of the colour.
+ * Converts HSB values to a hex representation of the color
- h (number) hue
- s (number) saturation
- b (number) value or brightness
- = (string) hex representation of the colour.
+ = (string) hex representation of the color
\*/
Snap.hsb = cacher(function (h, s, b) {
return Snap.hsb2rgb(h, s, b).hex;
@@ -1834,11 +1845,11 @@ Snap.hsb = cacher(function (h, s, b) {
* Snap.hsl
[ method ]
**
- * Converts HSL values to hex representation of the colour.
+ * Converts HSL values to a hex representation of the color
- h (number) hue
- s (number) saturation
- l (number) luminosity
- = (string) hex representation of the colour.
+ = (string) hex representation of the color
\*/
Snap.hsl = cacher(function (h, s, l) {
return Snap.hsl2rgb(h, s, l).hex;
@@ -1847,11 +1858,11 @@ Snap.hsl = cacher(function (h, s, l) {
* Snap.rgb
[ method ]
**
- * Converts RGB values to hex representation of the colour.
+ * Converts RGB values to a hex representation of the color
- r (number) red
- g (number) green
- b (number) blue
- = (string) hex representation of the colour.
+ = (string) hex representation of the color
\*/
Snap.rgb = cacher(function (r, g, b, o) {
if (is(o, "finite")) {
@@ -1920,20 +1931,20 @@ packageRGB = function (r, g, b, o) {
is(o, "finite") && (rgb.opacity = o);
return rgb;
};
-
+// SIERRA Clarify if Snap does not support consolidated HSLA/RGBA colors. E.g., can you specify a semi-transparent value for Snap.filter.shadow()?
/*\
* Snap.color
[ method ]
**
- * Parses the color string and returns object with all values for the given color.
+ * Parses the color string and returns an object featuring the color's component values
- clr (string) color string in one of the supported formats (see @Snap.getRGB)
- = (object) Combined RGB & HSB object in format:
+ = (object) Combined RGB/HSB object in the following format:
o {
o r (number) red,
o g (number) green,
o b (number) blue,
o hex (string) color in HTML/CSS format: #••••••,
- o error (boolean) `true` if string cant be parsed,
+ o error (boolean) `true` if string can't be parsed,
o h (number) hue,
o s (number) saturation,
o v (number) value (brightness),
@@ -1980,11 +1991,11 @@ Snap.color = function (clr) {
* Snap.hsb2rgb
[ method ]
**
- * Converts HSB values to RGB object.
+ * Converts HSB values to an RGB object
- h (number) hue
- s (number) saturation
- v (number) value or brightness
- = (object) RGB object in format:
+ = (object) RGB object in the following format:
o {
o r (number) red,
o g (number) green,
@@ -2016,11 +2027,11 @@ Snap.hsb2rgb = function (h, s, v, o) {
* Snap.hsl2rgb
[ method ]
**
- * Converts HSL values to RGB object.
+ * Converts HSL values to an RGB object
- h (number) hue
- s (number) saturation
- l (number) luminosity
- = (object) RGB object in format:
+ = (object) RGB object in the following format:
o {
o r (number) red,
o g (number) green,
@@ -2056,14 +2067,14 @@ Snap.hsl2rgb = function (h, s, l, o) {
* Snap.rgb2hsb
[ method ]
**
- * Converts RGB values to HSB object.
+ * Converts RGB values to an HSB object
- r (number) red
- g (number) green
- b (number) blue
- = (object) HSB object in format:
+ = (object) HSB object in the following format:
o {
- o h (number) hue
- o s (number) saturation
+ o h (number) hue,
+ o s (number) saturation,
o b (number) brightness
o }
\*/
@@ -2089,14 +2100,14 @@ Snap.rgb2hsb = function (r, g, b) {
* Snap.rgb2hsl
[ method ]
**
- * Converts RGB values to HSL object.
+ * Converts RGB values to an HSL object
- r (number) red
- g (number) green
- b (number) blue
- = (object) HSL object in format:
+ = (object) HSL object in the following format:
o {
- o h (number) hue
- o s (number) saturation
+ o h (number) hue,
+ o s (number) saturation,
o l (number) luminosity
o }
\*/
@@ -2123,15 +2134,16 @@ Snap.rgb2hsl = function (r, g, b) {
};
// Transformations
+// SIERRA Snap.parsePathString(): By _array of arrays,_ I assume you mean a format like this for two separate segments? [ ["M10,10","L90,90"], ["M90,10","L10,90"] ] Otherwise how is each command structured?
/*\
* Snap.parsePathString
[ method ]
**
* Utility method
**
- * Parses given path string into an array of arrays of path segments.
- - pathString (string|array) path string or array of segments (in the last case it will be returned straight away)
- = (array) array of segments.
+ * Parses given path string into an array of arrays of path segments
+ - pathString (string|array) path string or array of segments (in the last case it is returned straight away)
+ = (array) array of segments
\*/
Snap.parsePathString = function (pathString) {
if (!pathString) {
@@ -2176,15 +2188,16 @@ Snap.parsePathString = function (pathString) {
pth.arr = Snap.path.clone(data);
return data;
};
+// SIERRA Snap.parseTransformString(): I don't understand the string format.
/*\
* Snap.parseTransformString
[ method ]
**
* Utility method
**
- * Parses given path string into an array of transformations.
- - TString (string|array) transform string or array of transformations (in the last case it will be returned straight away)
- = (array) array of transformations.
+ * Parses given transform string into an array of transformations
+ - TString (string|array) transform string or array of transformations (in the last case it is returned straight away)
+ = (array) array of transformations
\*/
var parseTransformString = Snap.parseTransformString = function (TString) {
if (!TString) {
@@ -2449,9 +2462,9 @@ function unit2px(el, name, value) {
* Snap.select
[ method ]
**
- * Wraps DOM element specified by CSS selector as @Element
+ * Wraps a DOM element specified by CSS selector as @Element
- query (string) CSS selector of the element
- = (Element)
+ = (Element) the current element
\*/
Snap.select = function (query) {
return wrap(glob.doc.querySelector(query));
@@ -2462,7 +2475,7 @@ Snap.select = function (query) {
**
* Wraps DOM elements specified by CSS selector as set or array of @Element
- query (string) CSS selector of the element
- = (Element)
+ = (Element) the current element
\*/
Snap.selectAll = function (query) {
var nodelist = glob.doc.querySelectorAll(query),
@@ -2538,16 +2551,17 @@ function arrayFirstValue(arr) {
}
}
(function (elproto) {
+ // SIERRA Element.attr(): There appear to be two possible return values, one of which is blank. (Search the doc for _Returns:_ to identify problems.)
/*\
* Element.attr
[ method ]
**
* Gets or sets given attributes of the element
**
- - params (object) key-value pairs of attributes you want to set
+ - params (object) contains key-value pairs of attributes you want to set
* or
- param (string) name of the attribute
- = (Element)
+ = (Element) the current element
* or
= (string) value of attribute
> Usage
@@ -2557,7 +2571,7 @@ function arrayFirstValue(arr) {
| strokeWidth: 2, // CamelCase...
| "fill-opacity": 0.5 // or dash-separated names
| });
- | console.log(el.attr("fill")); // “#fc0”
+ | console.log(el.attr("fill")); // #fc0
\*/
elproto.attr = function (params, value) {
var el = this,
@@ -2581,11 +2595,13 @@ function arrayFirstValue(arr) {
}
return el;
};
+// SIERRA Element.getBBox(): Unclear why you would want to express the dimension of the box as a path.
+// SIERRA Element.getBBox(): Unclear why you would want to use r0/r1/r2. Also, basic definitions: wouldn't the _smallest circle that can be enclosed_ be a zero-radius point?
/*\
* Element.getBBox
[ method ]
**
- * Returns bounding box descriptor for the given element.
+ * Returns the bounding box descriptor for the given element
**
= (object) bounding box descriptor:
o {
@@ -2594,16 +2610,16 @@ function arrayFirstValue(arr) {
o h: (number) height,
o height: (number) height,
o path: (string) path command for the box,
- o r0: (number) radius of the circle that will enclose the box,
+ o r0: (number) radius of a circle that fully encloses the box,
o r1: (number) radius of the smallest circle that can be enclosed,
- o r2: (number) radius of the biggest circle that can be enclosed,
+ o r2: (number) radius of the largest circle that can be enclosed,
o vb: (string) box as a viewbox command,
o w: (number) width,
o width: (number) width,
o x2: (number) x of the right side,
o x: (number) x of the left side,
- o y2: (number) y of the right side,
- o y: (number) y of the left side
+ o y2: (number) y of the bottom edge,
+ o y: (number) y of the top edge
o }
\*/
elproto.getBBox = function (isWithoutTransform) {
@@ -2638,6 +2654,9 @@ function arrayFirstValue(arr) {
var propString = function () {
return this.local;
};
+// SIERRA Element.transform(): seems to allow two return values, one of which (_Element_) is undefined.
+// SIERRA Element.transform(): if this only accepts one argument, it's unclear how it can both _get_ and _set_ a transform.
+// SIERRA Element.transform(): Unclear how Snap transform string format differs from SVG's.
/*\
* Element.transform
[ method ]
@@ -2645,7 +2664,7 @@ function arrayFirstValue(arr) {
* Gets or sets transformation of the element
**
- tstr (string) transform string in Snap or SVG format
- = (Element)
+ = (Element) the current element
* or
= (object) transformation descriptor:
o {
@@ -2696,9 +2715,9 @@ function arrayFirstValue(arr) {
* Element.parent
[ method ]
**
- * Returns parent of the element
+ * Returns the element's parent
**
- = (Element) parent
+ = (Element) the parent element
\*/
elproto.parent = function () {
return wrap(this.node.parentNode);
@@ -2707,16 +2726,16 @@ function arrayFirstValue(arr) {
* Element.append
[ method ]
**
- * Appends given element to current one.
+ * Appends the given element to current one
**
- el (Element|Set) element to append
- = (Element) parent
+ = (Element) the parent element
\*/
/*\
* Element.add
[ method ]
**
- * See @Element.append.
+ * See @Element.append
\*/
elproto.append = elproto.add = function (el) {
if (el.type == "set") {
@@ -2735,10 +2754,10 @@ function arrayFirstValue(arr) {
* Element.prepend
[ method ]
**
- * Prepends given element to current one.
+ * Prepends the given element to the current one
**
- el (Element) element to prepend
- = (Element) parent
+ = (Element) the parent element
\*/
elproto.prepend = function (el) {
el = wrap(el);
@@ -2750,10 +2769,10 @@ function arrayFirstValue(arr) {
* Element.before
[ method ]
**
- * Inserts given element before the current one.
+ * Inserts given element before the current one
**
- el (Element) element to insert
- = (Element) parent
+ = (Element) the parent element
\*/
// TODO make it work for sets too
elproto.before = function (el) {
@@ -2766,10 +2785,10 @@ function arrayFirstValue(arr) {
* Element.after
[ method ]
**
- * Inserts given element after the current one.
+ * Inserts given element after the current one
**
- el (Element) element to insert
- = (Element) parent
+ = (Element) the parent element
\*/
elproto.after = function (el) {
el = wrap(el);
@@ -2781,10 +2800,10 @@ function arrayFirstValue(arr) {
* Element.insertBefore
[ method ]
**
- * Inserts the element after the given one.
+ * Inserts the element after the given one
**
- el (Element) element next to whom insert to
- = (Element) parent
+ = (Element) the parent element
\*/
elproto.insertBefore = function (el) {
el = wrap(el);
@@ -2796,10 +2815,10 @@ function arrayFirstValue(arr) {
* Element.insertAfter
[ method ]
**
- * Inserts the element after the given one.
+ * Inserts the element after the given one
**
- el (Element) element next to whom insert to
- = (Element) parent
+ = (Element) the parent element
\*/
elproto.insertAfter = function (el) {
el = wrap(el);
@@ -2812,7 +2831,7 @@ function arrayFirstValue(arr) {
[ method ]
**
* Removes element from the DOM
- = (Element) removed element
+ = (Element) the detached element
\*/
elproto.remove = function () {
this.node.parentNode && this.node.parentNode.removeChild(this.node);
@@ -2824,7 +2843,7 @@ function arrayFirstValue(arr) {
* Element.select
[ method ]
**
- * Applies CSS selector with the element as a parent and returns the result as an @Element.
+ * Gathers the nested @Element matching the given set of CSS selectors
**
- query (string) CSS selector
= (Element) result of query selection
@@ -2836,7 +2855,7 @@ function arrayFirstValue(arr) {
* Element.selectAll
[ method ]
**
- * Applies CSS selector with the element as a parent and returns the result as a set or array of elements.
+ * Gathers nested @Element objects matching the given set of CSS selectors
**
- query (string) CSS selector
= (Set|array) result of query selection
@@ -2853,7 +2872,7 @@ function arrayFirstValue(arr) {
* Element.asPX
[ method ]
**
- * Return given attribute of the element as a `px` value. (Not %, em, etc)
+ * Returns given attribute of the element as a `px` value (not %, em, etc.)
**
- attr (string) attribute name
- value (string) #optional attribute value
@@ -2865,13 +2884,14 @@ function arrayFirstValue(arr) {
}
return unit2px(this, attr, value);
};
+ // SIERRA Element.use(): I suggest adding a note about how to access the original element the returned