Element.add()⚓➭
Element.add()⚓➭
See Element.append
-Inserts given element after the current one
Returns: Element the parent element
-Animates the given attributes of the element
Returns: Element the current element
-Appends the given element to current one
Returns: Element the parent element
-Returns given attribute of the element as a px value (not %, em, etc.)
Returns: Element result of query selection
-Inserts given element before the current one
Returns: object Element
-Creates a clone of the element and inserts it after the element
Returns: Element the clone
-Adds or retrieves given value associated with given key. (Don’t confuse
with data- attributes)
data- attributes)
Returns: object Element
-Returns the bounding box descriptor for the given element
Returns: object bounding box descriptor:
@@ -322,7 +322,7 @@ withdata- attributes)
context for hover out handler
Returns: object Element
-Returns a set of animations that may be able to manipulate the current element
Returns: object in format:
@@ -331,11 +331,11 @@ withdata- attributes)
Returns SVG code for the element's contents, equivalent to HTML's innerHTML
Returns: string SVG code for the element
-Inserts the element after the given one
data- attributes)
element next to whom insert toReturns: Element the parent element
-Inserts the element after the given one
data- attributes)
element next to whom insert toReturns: Element the parent element
-Creates a <marker> element from the current element
To create a marker you have to specify the bounding rect and reference point:
Returns: object Element
-Returns the element's parent
Returns: Element the parent element
-Creates a <pattern> element from the current element
To create a pattern you have to specify the pattern rect:
Prepends the given element to the current one
Returns: Element the parent element
-Removes element from the DOM
Returns: Element the detached element
-Removes value associated with an element by given key. If key is not provided, removes all the data of the element.
@@ -473,7 +473,7 @@ If key is not provided, removes all the data of the element. keyReturns: object Element
-Gathers the nested Element matching the given set of CSS selectors
Returns: Element result of query selection
-Gathers nested Element objects matching the given set of CSS selectors
Returns: Set array result of query selection
-Stops all the animations for the current element
Returns: Element the current element
-Moves element to the shared <defs> area
Returns: Element the clone
-Returns SVG code for the element, equivalent to HTML's outerHTML
Returns: string SVG code for the element
@@ -536,7 +536,7 @@ If key is not provided, removes all the data of the element. handler for the eventReturns: object Element
-Gets or sets transformation of the element
Returns: object Element
-Creates a <use> element linked to the current element
Returns: Element the <use> element
See Element.select
-Returns a copy of the matrix
Returns: object Matrix
-Returns an inverted version of the matrix
Returns: object Matrix
-Rotates the matrix
Scales the matrix
Default cx, cy is the middle point of the element. +
+Splits matrix into primitive transformations
Returns: object in format:
@@ -749,11 +751,11 @@ If key is not provided, removes all the data of the element.Returns transform string that represents given matrix
Returns: string transform string
-Translate the matrix
Returns x coordinate for given point after transformation described by the matrix. See also Matrix.y
Returns: number x
-Returns y coordinate for given point after transformation described by the matrix. See also Matrix.x
Returns: number y
See Paper.g
-Draws a polygon. See Paper.polyline
-Draws a rectangle
@@ -1050,7 +1052,7 @@ var c = paper.rect(10, 10, 50, 50); // rectangle with rounded corners var c = paper.rect(40, 40, 50, 50, 10); -Returns SVG code for the element, equivalent to HTML's outerHTML
Returns: string SVG code for the element
@@ -1123,7 +1125,7 @@ var t2 = paper.text(50, 50, ["S","n","a","p"]);Returns: object set elements that were deleted
Utility method Returns a matrix based on the given parameters
@@ -1153,7 +1155,7 @@ Returns a matrix based on the given parametersReturns: object Matrix
-Simple implementation of Ajax
Returns: number angle in degrees
-Runs generic animation of one number into another with a caring function
var rect = Snap().rect(0, 0, 10, 10);
+Snap.animate(0, 10, function (val) {
+ rect.attr({
+ x: val
+ });
+}, 1000);
+// in given context is equivalent to
+rect.animate({x: 10}, 1000);
+Creates an animation object
Returns: object animation object
-Creates a DOM fragment from a given list of elements or strings
Returns: Fragment the Fragment
-Converts HSB values to a hex representation of the color
Returns: string hex representation of the color
-Converts HSL values to a hex representation of the color
Returns: string hex representation of the color
-Converts HSL values to an RGB object
string, function, number, etc.Returns: boolean true if given value is of given type
Utility method Parses given path string into an array of arrays of path segments
@@ -1555,7 +1566,7 @@ Parses given path string into an array of arrays of path segments path string or array of segments (in the last case it is returned straight away)Returns: array array of segments
-Utility method Parses given transform string into an array of transformations
@@ -1817,7 +1828,7 @@ Converts path coordinates into relative values angle in degreesReturns: number angle in radians
-Converts RGB values to a hex representation of the color
Returns: string hex representation of the color
-Wraps a DOM element specified by CSS selector as Element
Returns: Element the current element
-Wraps DOM elements specified by CSS selector as set or array of Element