zcy
/
snap.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix for transform strings to be equal to what you set them to be (Matrix roundtrip distortion fix)

master
Dmitry Baranovskiy 2013-10-18 15:38:27 +11:00
parent b31c4ca01c
commit 453482d873
4 changed files with 122 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

155
dist/reference.html vendored
View File

@ -31,10 +31,10 @@
</div>
</header>
<div id="content" class="max-width"><article id="Element" class="Element-section"><header><h2 id="Element" class="undefined">Element<a href="#Element" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Element-extra"></div></section></article><article id="Element.add" class="Element-add-section"><header><h3 id="Element.add" class="dr-method">Element.add()<a href="#Element.add" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1643 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1643">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element-extra"></div></section></article><article id="Element.add" class="Element-add-section"><header><h3 id="Element.add" class="dr-method">Element.add()<a href="#Element.add" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1634 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1634">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.add-extra"></div><div class="dr-method"><p>See <a href="#Element.append" class="dr-link">Element.append</a>
</p>
</div></section></article><article id="Element.after" class="Element-after-section"><header><h3 id="Element.after" class="dr-method">Element.after(el)<a href="#Element.after" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1696 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1696">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.after" class="Element-after-section"><header><h3 id="Element.after" class="dr-method">Element.after(el)<a href="#Element.after" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1687 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1687">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.after-extra"></div><div class="dr-method"><p>Inserts given element after the current one
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -42,7 +42,7 @@
<span class="dr-description">element to insert</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the parent element</span></p>
</div></section></article><article id="Element.animate" class="Element-animate-section"><header><h3 id="Element.animate" class="dr-method">Element.animate(attrs, duration, [easing], [callback])<a href="#Element.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2140 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2140">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.animate" class="Element-animate-section"><header><h3 id="Element.animate" class="dr-method">Element.animate(attrs, duration, [easing], [callback])<a href="#Element.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2134 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2134">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.animate-extra"></div><div class="dr-method"><p>Animates the given attributes of the element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">attrs</span>
@ -61,7 +61,7 @@
<span class="dr-description">callback function that executes when the animation ends</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the current element</span></p>
</div></section></article><article id="Element.append" class="Element-append-section"><header><h3 id="Element.append" class="dr-method">Element.append(el)<a href="#Element.append" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1637 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1637">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.append" class="Element-append-section"><header><h3 id="Element.append" class="dr-method">Element.append(el)<a href="#Element.append" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1628 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1628">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.append-extra"></div><div class="dr-method"><p>Appends the given element to current one
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -69,7 +69,7 @@
<span class="dr-description">element to append</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the parent element</span></p>
</div></section></article><article id="Element.asPX" class="Element-asPX-section"><header><h3 id="Element.asPX" class="dr-method">Element.asPX(attr, [value])<a href="#Element.asPX" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1784 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1784">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.asPX" class="Element-asPX-section"><header><h3 id="Element.asPX" class="dr-method">Element.asPX(attr, [value])<a href="#Element.asPX" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1775 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1775">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.asPX-extra"></div><div class="dr-method"><p>Returns given attribute of the element as a <code>px</code> value (not %, em, etc.)
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">attr</span>
@ -81,7 +81,7 @@
<span class="dr-description">attribute value</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">result of query selection</span></p>
</div></section></article><article id="Element.attr" class="Element-attr-section"><header><h3 id="Element.attr" class="dr-method">Element.attr(…)<a href="#Element.attr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1479 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1479">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.attr" class="Element-attr-section"><header><h3 id="Element.attr" class="dr-method">Element.attr(…)<a href="#Element.attr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1467 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1467">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.attr-extra"></div><div class="dr-method"><p>Gets or sets given attributes of the element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">params</span>
@ -106,7 +106,7 @@
});
console.log(el.attr("fill")); // #fc0
</code></pre></section>
</div></section></article><article id="Element.before" class="Element-before-section"><header><h3 id="Element.before" class="dr-method">Element.before(el)<a href="#Element.before" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1680 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1680">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.before" class="Element-before-section"><header><h3 id="Element.before" class="dr-method">Element.before(el)<a href="#Element.before" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1671 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1671">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.before-extra"></div><div class="dr-method"><p>Inserts given element before the current one
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -122,11 +122,11 @@ console.log(el.attr("fill")); // #fc0
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.clone" class="Element-clone-section"><header><h3 id="Element.clone" class="dr-method">Element.clone()<a href="#Element.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1828 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1828">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.clone" class="Element-clone-section"><header><h3 id="Element.clone" class="dr-method">Element.clone()<a href="#Element.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1819 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1819">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.clone-extra"></div><div class="dr-method"><p>Creates a clone of the element and inserts it after the element
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the clone</span></p>
</div></section></article><article id="Element.data" class="Element-data-section"><header><h3 id="Element.data" class="dr-method">Element.data(key, [value])<a href="#Element.data" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2212 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2212">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.data" class="Element-data-section"><header><h3 id="Element.data" class="dr-method">Element.data(key, [value])<a href="#Element.data" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2206 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2206">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.data-extra"></div><div class="dr-method"><p>Adds or retrieves given value associated with given key. (Don’t confuse
with <code>data-</code> attributes)
</p>
@ -256,7 +256,7 @@ with <code>data-</code> attributes)
<ol class="dr-json"><li><span class="dr-json-key">event</span><span class="dr-type"><em class="dr-type-object">object</em></span><span class="dr-json-description">DOM event object</span>
</ol>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.getBBox" class="Element-getBBox-section"><header><h3 id="Element.getBBox" class="dr-method">Element.getBBox()<a href="#Element.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1528 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1528">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.getBBox" class="Element-getBBox-section"><header><h3 id="Element.getBBox" class="dr-method">Element.getBBox()<a href="#Element.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1516 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1516">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.getBBox-extra"></div><div class="dr-method"><p>Returns the bounding box descriptor for the given element
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">bounding box descriptor:</span></p>
@ -322,7 +322,7 @@ with <code>data-</code> attributes)
<span class="dr-description">context for hover out handler</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.inAnim" class="Element-inAnim-section"><header><h3 id="Element.inAnim" class="dr-method">Element.inAnim()<a href="#Element.inAnim" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2055 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2055">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.inAnim" class="Element-inAnim-section"><header><h3 id="Element.inAnim" class="dr-method">Element.inAnim()<a href="#Element.inAnim" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2046 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2046">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.inAnim-extra"></div><div class="dr-method"><p>Returns a set of animations that may be able to manipulate the current element
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">in format:</span></p>
@ -331,11 +331,11 @@ with <code>data-</code> attributes)
<li><span class="dr-json-key">status</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">gets or sets the status of the animation,</span>
<li><span class="dr-json-key">stop</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">stops the animation</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Element.innerSVG" class="Element-innerSVG-section"><header><h3 id="Element.innerSVG" class="dr-method">Element.innerSVG()<a href="#Element.innerSVG" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2261 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2261">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.innerSVG" class="Element-innerSVG-section"><header><h3 id="Element.innerSVG" class="dr-method">Element.innerSVG()<a href="#Element.innerSVG" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2255 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2255">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.innerSVG-extra"></div><div class="dr-method"><p>Returns SVG code for the element&#39;s contents, equivalent to HTML&#39;s <code>innerHTML</code>
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">SVG code for the element</span></p>
</div></section></article><article id="Element.insertAfter" class="Element-insertAfter-section"><header><h3 id="Element.insertAfter" class="dr-method">Element.insertAfter(el)<a href="#Element.insertAfter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1726 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1726">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.insertAfter" class="Element-insertAfter-section"><header><h3 id="Element.insertAfter" class="dr-method">Element.insertAfter(el)<a href="#Element.insertAfter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1717 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1717">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.insertAfter-extra"></div><div class="dr-method"><p>Inserts the element after the given one
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -343,7 +343,7 @@ with <code>data-</code> attributes)
<span class="dr-description">element next to whom insert to</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the parent element</span></p>
</div></section></article><article id="Element.insertBefore" class="Element-insertBefore-section"><header><h3 id="Element.insertBefore" class="dr-method">Element.insertBefore(el)<a href="#Element.insertBefore" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1711 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1711">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.insertBefore" class="Element-insertBefore-section"><header><h3 id="Element.insertBefore" class="dr-method">Element.insertBefore(el)<a href="#Element.insertBefore" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1702 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1702">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.insertBefore-extra"></div><div class="dr-method"><p>Inserts the element after the given one
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -351,7 +351,7 @@ with <code>data-</code> attributes)
<span class="dr-description">element next to whom insert to</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the parent element</span></p>
</div></section></article><article id="Element.marker" class="Element-marker-section"><header><h3 id="Element.marker" class="dr-method">Element.marker(x, y, width, height, refX, refY)<a href="#Element.marker" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1979 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1979">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.marker" class="Element-marker-section"><header><h3 id="Element.marker" class="dr-method">Element.marker(x, y, width, height, refX, refY)<a href="#Element.marker" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1970 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1970">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.marker-extra"></div><div class="dr-method"><p>Creates a <code>&lt;marker&gt;</code> element from the current element
To create a marker you have to specify the bounding rect and reference point:
</p>
@ -417,11 +417,11 @@ To create a marker you have to specify the bounding rect and reference point:
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.parent" class="Element-parent-section"><header><h3 id="Element.parent" class="dr-method">Element.parent()<a href="#Element.parent" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1625 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1625">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.parent" class="Element-parent-section"><header><h3 id="Element.parent" class="dr-method">Element.parent()<a href="#Element.parent" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1616 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1616">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.parent-extra"></div><div class="dr-method"><p>Returns the element&#39;s parent
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the parent element</span></p>
</div></section></article><article id="Element.pattern" class="Element-pattern-section"><header><h3 id="Element.pattern" class="dr-method">Element.pattern(x, y, width, height)<a href="#Element.pattern" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1938 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1938">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.pattern" class="Element-pattern-section"><header><h3 id="Element.pattern" class="dr-method">Element.pattern(x, y, width, height)<a href="#Element.pattern" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1929 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1929">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.pattern-extra"></div><div class="dr-method"><p>Creates a <code>&lt;pattern&gt;</code> element from the current element
To create a pattern you have to specify the pattern rect:
</p>
@ -451,7 +451,7 @@ c.attr({
fill: p
});
</code></pre></section>
</div></section></article><article id="Element.prepend" class="Element-prepend-section"><header><h3 id="Element.prepend" class="dr-method">Element.prepend(el)<a href="#Element.prepend" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1665 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1665">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.prepend" class="Element-prepend-section"><header><h3 id="Element.prepend" class="dr-method">Element.prepend(el)<a href="#Element.prepend" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1656 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1656">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.prepend-extra"></div><div class="dr-method"><p>Prepends the given element to the current one
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -459,11 +459,11 @@ c.attr({
<span class="dr-description">element to prepend</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the parent element</span></p>
</div></section></article><article id="Element.remove" class="Element-remove-section"><header><h3 id="Element.remove" class="dr-method">Element.remove()<a href="#Element.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1739 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1739">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.remove" class="Element-remove-section"><header><h3 id="Element.remove" class="dr-method">Element.remove()<a href="#Element.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1730 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1730">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.remove-extra"></div><div class="dr-method"><p>Removes element from the DOM
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the detached element</span></p>
</div></section></article><article id="Element.removeData" class="Element-removeData-section"><header><h3 id="Element.removeData" class="dr-method">Element.removeData([key])<a href="#Element.removeData" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2237 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2237">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.removeData" class="Element-removeData-section"><header><h3 id="Element.removeData" class="dr-method">Element.removeData([key])<a href="#Element.removeData" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2231 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2231">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.removeData-extra"></div><div class="dr-method"><p>Removes value associated with an element by given key.
If key is not provided, removes all the data of the element.
</p>
@ -473,7 +473,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">key</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.select" class="Element-select-section"><header><h3 id="Element.select" class="dr-method">Element.select(query)<a href="#Element.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1754 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1754">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.select" class="Element-select-section"><header><h3 id="Element.select" class="dr-method">Element.select(query)<a href="#Element.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1745 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1745">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.select-extra"></div><div class="dr-method"><p>Gathers the nested <a href="#Element" class="dr-link">Element</a> matching the given set of CSS selectors
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>
@ -481,7 +481,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">CSS selector</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">result of query selection</span></p>
</div></section></article><article id="Element.selectAll" class="Element-selectAll-section"><header><h3 id="Element.selectAll" class="dr-method">Element.selectAll(query)<a href="#Element.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1766 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1766">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.selectAll" class="Element-selectAll-section"><header><h3 id="Element.selectAll" class="dr-method">Element.selectAll(query)<a href="#Element.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1757 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1757">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.selectAll-extra"></div><div class="dr-method"><p>Gathers nested <a href="#Element" class="dr-link">Element</a> objects matching the given set of CSS selectors
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>
@ -489,15 +489,15 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">CSS selector</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Set">Set</em> <em class="dr-type-array">array</em> <span class="dr-description">result of query selection</span></p>
</div></section></article><article id="Element.stop" class="Element-stop-section"><header><h3 id="Element.stop" class="dr-method">Element.stop()<a href="#Element.stop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2119 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2119">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.stop" class="Element-stop-section"><header><h3 id="Element.stop" class="dr-method">Element.stop()<a href="#Element.stop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2113 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2113">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.stop-extra"></div><div class="dr-method"><p>Stops all the animations for the current element
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the current element</span></p>
</div></section></article><article id="Element.toDefs" class="Element-toDefs-section"><header><h3 id="Element.toDefs" class="dr-method">Element.toDefs()<a href="#Element.toDefs" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1908 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1908">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.toDefs" class="Element-toDefs-section"><header><h3 id="Element.toDefs" class="dr-method">Element.toDefs()<a href="#Element.toDefs" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1899 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1899">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.toDefs-extra"></div><div class="dr-method"><p>Moves element to the shared <code>&lt;defs&gt;</code> area
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the clone</span></p>
</div></section></article><article id="Element.toString" class="Element-toString-section"><header><h3 id="Element.toString" class="dr-method">Element.toString()<a href="#Element.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2942 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2942">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.toString" class="Element-toString-section"><header><h3 id="Element.toString" class="dr-method">Element.toString()<a href="#Element.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2936 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2936">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.toString-extra"></div><div class="dr-method"><p>Returns SVG code for the element, equivalent to HTML&#39;s <code>outerHTML</code>
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">SVG code for the element</span></p>
@ -536,7 +536,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.transform" class="Element-transform-section"><header><h3 id="Element.transform" class="dr-method">Element.transform(tstr)<a href="#Element.transform" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1583 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1583">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.transform" class="Element-transform-section"><header><h3 id="Element.transform" class="dr-method">Element.transform(tstr)<a href="#Element.transform" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1571 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1571">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.transform-extra"></div><div class="dr-method"><p>Gets or sets transformation of the element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">tstr</span>
@ -657,15 +657,15 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.use" class="Element-use-section"><header><h3 id="Element.use" class="dr-method">Element.use()<a href="#Element.use" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1799 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1799">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.use" class="Element-use-section"><header><h3 id="Element.use" class="dr-method">Element.use()<a href="#Element.use" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1790 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1790">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.use-extra"></div><div class="dr-method"><p>Creates a <code>&lt;use&gt;</code> element linked to the current element
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the <code>&lt;use&gt;</code> element</span></p>
</div></section></article><article id="Fragment" class="Fragment-section"><header><h2 id="Fragment" class="undefined">Fragment<a href="#Fragment" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Fragment-extra"></div></section></article><article id="Fragment.select" class="Fragment-select-section"><header><h3 id="Fragment.select" class="dr-method">Fragment.select()<a href="#Fragment.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2331 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2331">&#x27ad;</a></h3></header>
<section><div class="extra" id="Fragment-extra"></div></section></article><article id="Fragment.select" class="Fragment-select-section"><header><h3 id="Fragment.select" class="dr-method">Fragment.select()<a href="#Fragment.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2325 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2325">&#x27ad;</a></h3></header>
<section><div class="extra" id="Fragment.select-extra"></div><div class="dr-method"><p>See <a href="#Element.select" class="dr-link">Element.select</a>
</p>
</div></section></article><article id="Fragment.selectAll" class="Fragment-selectAll-section"><header><h3 id="Fragment.selectAll" class="dr-method">Fragment.selectAll()<a href="#Fragment.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2338 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2338">&#x27ad;</a></h3></header>
</div></section></article><article id="Fragment.selectAll" class="Fragment-selectAll-section"><header><h3 id="Fragment.selectAll" class="dr-method">Fragment.selectAll()<a href="#Fragment.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2332 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2332">&#x27ad;</a></h3></header>
<section><div class="extra" id="Fragment.selectAll-extra"></div><div class="dr-method"><p>See <a href="#Element.selectAll" class="dr-link">Element.selectAll</a>
</p>
</div></section></article><article id="Matrix" class="Matrix-section"><header><h2 id="Matrix" class="undefined">Matrix<a href="#Matrix" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
@ -697,15 +697,15 @@ If key is not provided, removes all the data of the element.
<span class="dr-type"><em class="dr-type-object">object</em></span>
<span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span></li>
</ol></div>
</div></section></article><article id="Matrix.clone" class="Matrix-clone-section"><header><h3 id="Matrix.clone" class="dr-method">Matrix.clone()<a href="#Matrix.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 437 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L437">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.clone" class="Matrix-clone-section"><header><h3 id="Matrix.clone" class="dr-method">Matrix.clone()<a href="#Matrix.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 436 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L436">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.clone-extra"></div><div class="dr-method"><p>Returns a copy of the matrix
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span></p>
</div></section></article><article id="Matrix.invert" class="Matrix-invert-section"><header><h3 id="Matrix.invert" class="dr-method">Matrix.invert()<a href="#Matrix.invert" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 425 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L425">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.invert" class="Matrix-invert-section"><header><h3 id="Matrix.invert" class="dr-method">Matrix.invert()<a href="#Matrix.invert" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 424 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L424">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.invert-extra"></div><div class="dr-method"><p>Returns an inverted version of the matrix
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span></p>
</div></section></article><article id="Matrix.rotate" class="Matrix-rotate-section"><header><h3 id="Matrix.rotate" class="dr-method">Matrix.rotate(a, x, y)<a href="#Matrix.rotate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 478 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L478">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.rotate" class="Matrix-rotate-section"><header><h3 id="Matrix.rotate" class="dr-method">Matrix.rotate(a, x, y)<a href="#Matrix.rotate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 477 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L477">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.rotate-extra"></div><div class="dr-method"><p>Rotates the matrix
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">a</span>
@ -718,7 +718,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-type"><em class="dr-type-number">number</em></span>
<span class="dr-description">vertical origin point from which to rotate</span></li>
</ol></div>
</div></section></article><article id="Matrix.scale" class="Matrix-scale-section"><header><h3 id="Matrix.scale" class="dr-method">Matrix.scale(x, [y], [cx], [cy])<a href="#Matrix.scale" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 462 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L462">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.scale" class="Matrix-scale-section"><header><h3 id="Matrix.scale" class="dr-method">Matrix.scale(x, [y], [cx], [cy])<a href="#Matrix.scale" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 461 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L461">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.scale-extra"></div><div class="dr-method"><p>Scales the matrix
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -737,7 +737,9 @@ If key is not provided, removes all the data of the element.
<span class="dr-type"><em class="dr-type-number">number</em></span>
<span class="dr-description">vertical origin point from which to scale</span></li>
</ol></div>
</div></section></article><article id="Matrix.split" class="Matrix-split-section"><header><h3 id="Matrix.split" class="dr-method">Matrix.split()<a href="#Matrix.split" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 545 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L545">&#x27ad;</a></h3></header>
<p>Default cx, cy is the middle point of the element.
</p>
</div></section></article><article id="Matrix.split" class="Matrix-split-section"><header><h3 id="Matrix.split" class="dr-method">Matrix.split()<a href="#Matrix.split" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 544 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L544">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.split-extra"></div><div class="dr-method"><p>Splits matrix into primitive transformations
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">in format:</span></p>
@ -749,11 +751,11 @@ If key is not provided, removes all the data of the element.
<li><span class="dr-json-key">rotate</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">rotation in deg</span>
<li><span class="dr-json-key">isSimple</span><span class="dr-type"><em class="dr-type-boolean">boolean</em></span><span class="dr-json-description">could it be represented via simple transformations</span>
</ol>
</div></section></article><article id="Matrix.toTransformString" class="Matrix-toTransformString-section"><header><h3 id="Matrix.toTransformString" class="dr-method">Matrix.toTransformString()<a href="#Matrix.toTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 588 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L588">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.toTransformString" class="Matrix-toTransformString-section"><header><h3 id="Matrix.toTransformString" class="dr-method">Matrix.toTransformString()<a href="#Matrix.toTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 587 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L587">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.toTransformString-extra"></div><div class="dr-method"><p>Returns transform string that represents given matrix
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">transform string</span></p>
</div></section></article><article id="Matrix.translate" class="Matrix-translate-section"><header><h3 id="Matrix.translate" class="dr-method">Matrix.translate(x, y)<a href="#Matrix.translate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 448 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L448">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.translate" class="Matrix-translate-section"><header><h3 id="Matrix.translate" class="dr-method">Matrix.translate(x, y)<a href="#Matrix.translate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 447 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L447">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.translate-extra"></div><div class="dr-method"><p>Translate the matrix
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -763,7 +765,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-type"><em class="dr-type-number">number</em></span>
<span class="dr-description">vertical offset distance</span></li>
</ol></div>
</div></section></article><article id="Matrix.x" class="Matrix-x-section"><header><h3 id="Matrix.x" class="dr-method">Matrix.x(x, y)<a href="#Matrix.x" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 496 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L496">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.x" class="Matrix-x-section"><header><h3 id="Matrix.x" class="dr-method">Matrix.x(x, y)<a href="#Matrix.x" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 495 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L495">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.x-extra"></div><div class="dr-method"><p>Returns x coordinate for given point after transformation described by the matrix. See also <a href="#Matrix.y" class="dr-link">Matrix.y</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -774,7 +776,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">&#160;</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">x</span></p>
</div></section></article><article id="Matrix.y" class="Matrix-y-section"><header><h3 id="Matrix.y" class="dr-method">Matrix.y(x, y)<a href="#Matrix.y" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 508 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L508">&#x27ad;</a></h3></header>
</div></section></article><article id="Matrix.y" class="Matrix-y-section"><header><h3 id="Matrix.y" class="dr-method">Matrix.y(x, y)<a href="#Matrix.y" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 507 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L507">&#x27ad;</a></h3></header>
<section><div class="extra" id="Matrix.y-extra"></div><div class="dr-method"><p>Returns y coordinate for given point after transformation described by the matrix. See also <a href="#Matrix.x" class="dr-link">Matrix.x</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -786,7 +788,7 @@ If key is not provided, removes all the data of the element.
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">y</span></p>
</div></section></article><article id="Paper" class="Paper-section"><header><h2 id="Paper" class="undefined">Paper<a href="#Paper" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Paper-extra"></div></section></article><article id="Paper.circle" class="Paper-circle-section"><header><h3 id="Paper.circle" class="dr-method">Paper.circle(x, y, r)<a href="#Paper.circle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2611 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2611">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper-extra"></div></section></article><article id="Paper.circle" class="Paper-circle-section"><header><h3 id="Paper.circle" class="dr-method">Paper.circle(x, y, r)<a href="#Paper.circle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2605 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2605">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.circle-extra"></div><div class="dr-method"><p>Draws a circle
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -802,7 +804,7 @@ If key is not provided, removes all the data of the element.
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">the <code>circle</code> element</span></p>
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.circle(50, 50, 40);
</code></pre></section>
</div></section></article><article id="Paper.el" class="Paper-el-section"><header><h3 id="Paper.el" class="dr-method">Paper.el(name, attr)<a href="#Paper.el" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2551 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2551">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.el" class="Paper-el-section"><header><h3 id="Paper.el" class="dr-method">Paper.el(name, attr)<a href="#Paper.el" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2545 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2545">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.el-extra"></div><div class="dr-method"><p>Creates an element on paper with a given name and no attributes
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">name</span>
@ -820,7 +822,7 @@ var c = paper.el("circle").attr({
r: 10
});
</code></pre></section>
</div></section></article><article id="Paper.ellipse" class="Paper-ellipse-section"><header><h3 id="Paper.ellipse" class="dr-method">Paper.ellipse(x, y, rx, ry)<a href="#Paper.ellipse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2686 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2686">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.ellipse" class="Paper-ellipse-section"><header><h3 id="Paper.ellipse" class="dr-method">Paper.ellipse(x, y, rx, ry)<a href="#Paper.ellipse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2680 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2680">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.ellipse-extra"></div><div class="dr-method"><p>Draws an ellipse
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -854,7 +856,7 @@ var c = paper.el("circle").attr({
filter: f
});
</code></pre></section>
</div></section></article><article id="Paper.g" class="Paper-g-section"><header><h3 id="Paper.g" class="dr-method">Paper.g([varargs])<a href="#Paper.g" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2762 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2762">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.g" class="Paper-g-section"><header><h3 id="Paper.g" class="dr-method">Paper.g([varargs])<a href="#Paper.g" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2756 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2756">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.g-extra"></div><div class="dr-method"><p>Creates a group element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param optional">varargs</span>
@ -874,7 +876,7 @@ var c = paper.el("circle").attr({
g = paper.g();
g.add(c2, c1);
</code></pre></section>
</div></section></article><article id="Paper.gradient" class="Paper-gradient-section"><header><h3 id="Paper.gradient" class="dr-method">Paper.gradient(gradient)<a href="#Paper.gradient" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2926 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2926">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.gradient" class="Paper-gradient-section"><header><h3 id="Paper.gradient" class="dr-method">Paper.gradient(gradient)<a href="#Paper.gradient" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2920 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2920">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.gradient-extra"></div><div class="dr-method"><p>Creates a gradient element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">gradient</span>
@ -917,10 +919,10 @@ half the width, from black to white:
});
</code></pre></section>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">the <code>gradient</code> element</span></p>
</div></section></article><article id="Paper.group" class="Paper-group-section"><header><h3 id="Paper.group" class="dr-method">Paper.group()<a href="#Paper.group" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2768 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2768">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.group" class="Paper-group-section"><header><h3 id="Paper.group" class="dr-method">Paper.group()<a href="#Paper.group" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2762 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2762">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.group-extra"></div><div class="dr-method"><p>See <a href="#Paper.g" class="dr-link">Paper.g</a>
</p>
</div></section></article><article id="Paper.image" class="Paper-image-section"><header><h3 id="Paper.image" class="dr-method">Paper.image(src, x, y, width, height)<a href="#Paper.image" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2643 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2643">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.image" class="Paper-image-section"><header><h3 id="Paper.image" class="dr-method">Paper.image(src, x, y, width, height)<a href="#Paper.image" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2637 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2637">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.image-extra"></div><div class="dr-method"><p>Places an image on the surface
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">src</span>
@ -945,7 +947,7 @@ half the width, from black to white:
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Raphaël element object with type <code>image</code></span></p>
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.image("apple.png", 10, 10, 80, 80);
</code></pre></section>
</div></section></article><article id="Paper.line" class="Paper-line-section"><header><h3 id="Paper.line" class="dr-method">Paper.line(x1, y1, x2, y2)<a href="#Paper.line" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2824 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2824">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.line" class="Paper-line-section"><header><h3 id="Paper.line" class="dr-method">Paper.line(x1, y1, x2, y2)<a href="#Paper.line" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2818 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2818">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.line-extra"></div><div class="dr-method"><p>Draws a line
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x1</span>
@ -964,7 +966,7 @@ half the width, from black to white:
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">the <code>line</code> element</span></p>
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var t1 = paper.line(50, 50, 100, 100);
</code></pre></section>
</div></section></article><article id="Paper.path" class="Paper-path-section"><header><h3 id="Paper.path" class="dr-method">Paper.path([pathString])<a href="#Paper.path" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2731 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2731">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.path" class="Paper-path-section"><header><h3 id="Paper.path" class="dr-method">Paper.path([pathString])<a href="#Paper.path" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2725 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2725">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.path-extra"></div><div class="dr-method"><p>Creates a <code>&lt;path&gt;</code> element using the given string as the path&#39;s definition
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param optional">pathString</span>
@ -999,10 +1001,10 @@ Note: there is a special case when a path consists of only three commands: <code
// draw a diagonal line:
// move to 10,10, line to 90,90
</code></pre></section>
</div></section></article><article id="Paper.polygon" class="Paper-polygon-section"><header><h3 id="Paper.polygon" class="dr-method">Paper.polygon()<a href="#Paper.polygon" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2873 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2873">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.polygon" class="Paper-polygon-section"><header><h3 id="Paper.polygon" class="dr-method">Paper.polygon()<a href="#Paper.polygon" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2867 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2867">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.polygon-extra"></div><div class="dr-method"><p>Draws a polygon. See <a href="#Paper.polyline" class="dr-link">Paper.polyline</a>
</p>
</div></section></article><article id="Paper.polyline" class="Paper-polyline-section"><header><h3 id="Paper.polyline" class="dr-method">Paper.polyline(…)<a href="#Paper.polyline" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2853 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2853">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.polyline" class="Paper-polyline-section"><header><h3 id="Paper.polyline" class="dr-method">Paper.polyline(…)<a href="#Paper.polyline" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2847 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2847">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.polyline-extra"></div><div class="dr-method"><p>Draws a polyline
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">points</span>
@ -1019,7 +1021,7 @@ Note: there is a special case when a path consists of only three commands: <code
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var p1 = paper.polyline([10, 10, 100, 100]);
var p2 = paper.polyline(10, 10, 100, 100);
</code></pre></section>
</div></section></article><article id="Paper.rect" class="Paper-rect-section"><header><h3 id="Paper.rect" class="dr-method">Paper.rect(x, y, width, height, [rx], [ry])<a href="#Paper.rect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2574 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2574">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.rect" class="Paper-rect-section"><header><h3 id="Paper.rect" class="dr-method">Paper.rect(x, y, width, height, [rx], [ry])<a href="#Paper.rect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2568 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2568">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.rect-extra"></div><div class="dr-method"><p></p>
<p>Draws a rectangle
</p>
@ -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);
</code></pre></section>
</div></section></article><article id="Paper.text" class="Paper-text-section"><header><h3 id="Paper.text" class="dr-method">Paper.text(x, y, text)<a href="#Paper.text" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2796 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2796">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.text" class="Paper-text-section"><header><h3 id="Paper.text" class="dr-method">Paper.text(x, y, text)<a href="#Paper.text" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2790 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2790">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.text-extra"></div><div class="dr-method"><p>Draws a text string
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -1067,7 +1069,7 @@ var c = paper.rect(40, 40, 50, 50, 10);
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var t1 = paper.text(50, 50, "Snap");
var t2 = paper.text(50, 50, ["S","n","a","p"]);
</code></pre></section>
</div></section></article><article id="Paper.toString" class="Paper-toString-section"><header><h3 id="Paper.toString" class="dr-method">Paper.toString()<a href="#Paper.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2942 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2942">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.toString" class="Paper-toString-section"><header><h3 id="Paper.toString" class="dr-method">Paper.toString()<a href="#Paper.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2936 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2936">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.toString-extra"></div><div class="dr-method"><p>Returns SVG code for the element, equivalent to HTML&#39;s <code>outerHTML</code>
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">SVG code for the element</span></p>
@ -1123,7 +1125,7 @@ var t2 = paper.text(50, 50, ["S","n","a","p"]);
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">set elements that were deleted</span></p>
</div></section></article><article id="Snap" class="Snap-section"><header><h2 id="Snap" class="undefined">Snap<a href="#Snap" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Snap-extra"></div></section></article><article id="Snap.Matrix" class="Snap-Matrix-section"><header><h3 id="Snap.Matrix" class="dr-method">Snap.Matrix(…)<a href="#Snap.Matrix" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 620 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L620">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap-extra"></div></section></article><article id="Snap.Matrix" class="Snap-Matrix-section"><header><h3 id="Snap.Matrix" class="dr-method">Snap.Matrix(…)<a href="#Snap.Matrix" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 619 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L619">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.Matrix-extra"></div><div class="dr-method"><p>Utility method
Returns a matrix based on the given parameters
</p>
@ -1153,7 +1155,7 @@ Returns a matrix based on the given parameters
<span class="dr-description">&#160;</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span></p>
</div></section></article><article id="Snap.ajax" class="Snap-ajax-section"><header><h3 id="Snap.ajax" class="dr-method">Snap.ajax(…)<a href="#Snap.ajax" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2974 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2974">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.ajax" class="Snap-ajax-section"><header><h3 id="Snap.ajax" class="dr-method">Snap.ajax(…)<a href="#Snap.ajax" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2968 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2968">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.ajax-extra"></div><div class="dr-method"><p>Simple implementation of Ajax
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">url</span>
@ -1209,7 +1211,7 @@ Returns a matrix based on the given parameters
<span class="dr-description">y coord of third point</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">angle in degrees</span></p>
</div></section></article><article id="Snap.animate" class="Snap-animate-section"><header><h3 id="Snap.animate" class="dr-method">Snap.animate(from, to, setter, duration, [easing], [callback])<a href="#Snap.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2100 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2100">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.animate" class="Snap-animate-section"><header><h3 id="Snap.animate" class="dr-method">Snap.animate(from, to, setter, duration, [easing], [callback])<a href="#Snap.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2095 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2095">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.animate-extra"></div><div class="dr-method"><p>Runs generic animation of one number into another with a caring function
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">from</span>
@ -1241,7 +1243,16 @@ Returns a matrix based on the given parameters
<li><span class="dr-json-key">status</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">gets or sets the status of the animation,</span>
<li><span class="dr-json-key">stop</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">stops the animation</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Snap.animation" class="Snap-animation-section"><header><h3 id="Snap.animation" class="dr-method">Snap.animation(attr, duration, [easing], [callback])<a href="#Snap.animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2038 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2038">&#x27ad;</a></h3></header>
<section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">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);
</code></pre></section>
</div></section></article><article id="Snap.animation" class="Snap-animation-section"><header><h3 id="Snap.animation" class="dr-method">Snap.animation(attr, duration, [easing], [callback])<a href="#Snap.animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2029 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2029">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.animation-extra"></div><div class="dr-method"><p>Creates an animation object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">attr</span>
@ -1260,7 +1271,7 @@ Returns a matrix based on the given parameters
<span class="dr-description">callback function that fires when animation ends</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">animation object</span></p>
</div></section></article><article id="Snap.color" class="Snap-color-section"><header><h3 id="Snap.color" class="dr-method">Snap.color(clr)<a href="#Snap.color" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 857 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L857">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.color" class="Snap-color-section"><header><h3 id="Snap.color" class="dr-method">Snap.color(clr)<a href="#Snap.color" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 856 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L856">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.color-extra"></div><div class="dr-method"><p>Parses the color string and returns an object featuring the color&#39;s component values
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">clr</span>
@ -1406,7 +1417,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
}
}));
</code></pre></section>
</div></section></article><article id="Snap.fragment" class="Snap-fragment-section"><header><h3 id="Snap.fragment" class="dr-method">Snap.fragment(varargs)<a href="#Snap.fragment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2349 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2349">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.fragment" class="Snap-fragment-section"><header><h3 id="Snap.fragment" class="dr-method">Snap.fragment(varargs)<a href="#Snap.fragment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2343 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2343">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.fragment-extra"></div><div class="dr-method"><p>Creates a DOM fragment from a given list of elements or strings
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">varargs</span>
@ -1414,7 +1425,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<span class="dr-description">SVG string</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Fragment">Fragment</em> <span class="dr-description">the <a href="#Fragment" class="dr-link">Fragment</a></span></p>
</div></section></article><article id="Snap.getRGB" class="Snap-getRGB-section"><header><h3 id="Snap.getRGB" class="dr-method">Snap.getRGB(color)<a href="#Snap.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 655 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L655">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.getRGB" class="Snap-getRGB-section"><header><h3 id="Snap.getRGB" class="dr-method">Snap.getRGB(color)<a href="#Snap.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 654 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L654">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.getRGB-extra"></div><div class="dr-method"><p>Parses color string as RGB object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">color</span>
@ -1447,7 +1458,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••,</span>
<li><span class="dr-json-key">error</span><span class="dr-type"><em class="dr-type-boolean">boolean</em></span><span class="dr-json-description">true if string can&#39;t be parsed</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Snap.hsb" class="Snap-hsb-section"><header><h3 id="Snap.hsb" class="dr-method">Snap.hsb(h, s, b)<a href="#Snap.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 744 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L744">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.hsb" class="Snap-hsb-section"><header><h3 id="Snap.hsb" class="dr-method">Snap.hsb(h, s, b)<a href="#Snap.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 743 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L743">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.hsb-extra"></div><div class="dr-method"><p>Converts HSB values to a hex representation of the color
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1461,7 +1472,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<span class="dr-description">value or brightness</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the color</span></p>
</div></section></article><article id="Snap.hsb2rgb" class="Snap-hsb2rgb-section"><header><h3 id="Snap.hsb2rgb" class="dr-method">Snap.hsb2rgb(h, s, v)<a href="#Snap.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 909 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L909">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.hsb2rgb" class="Snap-hsb2rgb-section"><header><h3 id="Snap.hsb2rgb" class="dr-method">Snap.hsb2rgb(h, s, v)<a href="#Snap.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 908 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L908">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.hsb2rgb-extra"></div><div class="dr-method"><p>Converts HSB values to an RGB object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1480,7 +1491,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">blue,</span>
<li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Snap.hsl" class="Snap-hsl-section"><header><h3 id="Snap.hsl" class="dr-method">Snap.hsl(h, s, l)<a href="#Snap.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 757 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L757">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.hsl" class="Snap-hsl-section"><header><h3 id="Snap.hsl" class="dr-method">Snap.hsl(h, s, l)<a href="#Snap.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 756 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L756">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.hsl-extra"></div><div class="dr-method"><p>Converts HSL values to a hex representation of the color
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1494,7 +1505,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<span class="dr-description">luminosity</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the color</span></p>
</div></section></article><article id="Snap.hsl2rgb" class="Snap-hsl2rgb-section"><header><h3 id="Snap.hsl2rgb" class="dr-method">Snap.hsl2rgb(h, s, l)<a href="#Snap.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 945 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L945">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.hsl2rgb" class="Snap-hsl2rgb-section"><header><h3 id="Snap.hsl2rgb" class="dr-method">Snap.hsl2rgb(h, s, l)<a href="#Snap.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 944 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L944">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.hsl2rgb-extra"></div><div class="dr-method"><p>Converts HSL values to an RGB object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1524,7 +1535,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<span class="dr-description">name of the type, e.g., <code>string</code>, <code>function</code>, <code>number</code>, etc.</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-boolean">boolean</em> <span class="dr-description"><code>true</code> if given value is of given type</span></p>
</div></section></article><article id="Snap.load" class="Snap-load-section"><header><h3 id="Snap.load" class="dr-method">Snap.load(url, callback, [scope])<a href="#Snap.load" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 3020 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L3020">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.load" class="Snap-load-section"><header><h3 id="Snap.load" class="dr-method">Snap.load(url, callback, [scope])<a href="#Snap.load" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 3014 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L3014">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.load-extra"></div><div class="dr-method"><p>Loads external SVG file as a <a href="#Fragment" class="dr-link">Fragment</a> (see <a href="#Snap.ajax" class="dr-link">Snap.ajax</a> for more advanced AJAX)
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">url</span>
@ -1538,7 +1549,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<span class="dr-type"><em class="dr-type-object">object</em></span>
<span class="dr-description">scope of callback</span></li>
</ol></div>
</div></section></article><article id="Snap.parse" class="Snap-parse-section"><header><h3 id="Snap.parse" class="dr-method">Snap.parse(svg)<a href="#Snap.parse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2300 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2300">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.parse" class="Snap-parse-section"><header><h3 id="Snap.parse" class="dr-method">Snap.parse(svg)<a href="#Snap.parse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2294 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2294">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.parse-extra"></div><div class="dr-method"><p>Parses SVG fragment and converts it into a <a href="#Fragment" class="dr-link">Fragment</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">svg</span>
@ -1546,7 +1557,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<span class="dr-description">SVG string</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Fragment">Fragment</em> <span class="dr-description">the <a href="#Fragment" class="dr-link">Fragment</a></span></p>
</div></section></article><article id="Snap.parsePathString" class="Snap-parsePathString-section"><header><h3 id="Snap.parsePathString" class="dr-method">Snap.parsePathString(pathString)<a href="#Snap.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1051 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1051">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.parsePathString" class="Snap-parsePathString-section"><header><h3 id="Snap.parsePathString" class="dr-method">Snap.parsePathString(pathString)<a href="#Snap.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1050 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1050">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.parsePathString-extra"></div><div class="dr-method"><p>Utility method
Parses given path string into an array of arrays of path segments
</p>
@ -1555,7 +1566,7 @@ Parses given path string into an array of arrays of path segments
<span class="dr-description">path string or array of segments (in the last case it is returned straight away)</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-array">array</em> <span class="dr-description">array of segments</span></p>
</div></section></article><article id="Snap.parseTransformString" class="Snap-parseTransformString-section"><header><h3 id="Snap.parseTransformString" class="dr-method">Snap.parseTransformString(TString)<a href="#Snap.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1105 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1105">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.parseTransformString" class="Snap-parseTransformString-section"><header><h3 id="Snap.parseTransformString" class="dr-method">Snap.parseTransformString(TString)<a href="#Snap.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1104 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1104">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.parseTransformString-extra"></div><div class="dr-method"><p>Utility method
Parses given transform string into an array of transformations
</p>
@ -1817,7 +1828,7 @@ Converts path coordinates into relative values
<span class="dr-description">angle in degrees</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">angle in radians</span></p>
</div></section></article><article id="Snap.rgb" class="Snap-rgb-section"><header><h3 id="Snap.rgb" class="dr-method">Snap.rgb(r, g, b)<a href="#Snap.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 770 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L770">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.rgb" class="Snap-rgb-section"><header><h3 id="Snap.rgb" class="dr-method">Snap.rgb(r, g, b)<a href="#Snap.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 769 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L769">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.rgb-extra"></div><div class="dr-method"><p>Converts RGB values to a hex representation of the color
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">r</span>
@ -1831,7 +1842,7 @@ Converts path coordinates into relative values
<span class="dr-description">blue</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the color</span></p>
</div></section></article><article id="Snap.rgb2hsb" class="Snap-rgb2hsb-section"><header><h3 id="Snap.rgb2hsb" class="dr-method">Snap.rgb2hsb(r, g, b)<a href="#Snap.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 984 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L984">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.rgb2hsb" class="Snap-rgb2hsb-section"><header><h3 id="Snap.rgb2hsb" class="dr-method">Snap.rgb2hsb(r, g, b)<a href="#Snap.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 983 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L983">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.rgb2hsb-extra"></div><div class="dr-method"><p>Converts RGB values to an HSB object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">r</span>
@ -1849,7 +1860,7 @@ Converts path coordinates into relative values
<li><span class="dr-json-key">s</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">saturation,</span>
<li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">brightness</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Snap.rgb2hsl" class="Snap-rgb2hsl-section"><header><h3 id="Snap.rgb2hsl" class="dr-method">Snap.rgb2hsl(r, g, b)<a href="#Snap.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1017 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1017">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.rgb2hsl" class="Snap-rgb2hsl-section"><header><h3 id="Snap.rgb2hsl" class="dr-method">Snap.rgb2hsl(r, g, b)<a href="#Snap.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1016 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1016">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.rgb2hsl-extra"></div><div class="dr-method"><p>Converts RGB values to an HSL object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">r</span>
@ -1867,7 +1878,7 @@ Converts path coordinates into relative values
<li><span class="dr-json-key">s</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">saturation,</span>
<li><span class="dr-json-key">l</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">luminosity</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Snap.select" class="Snap-select-section"><header><h3 id="Snap.select" class="dr-method">Snap.select(query)<a href="#Snap.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1372 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1372">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.select" class="Snap-select-section"><header><h3 id="Snap.select" class="dr-method">Snap.select(query)<a href="#Snap.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1360 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1360">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.select-extra"></div><div class="dr-method"><p>Wraps a DOM element specified by CSS selector as <a href="#Element" class="dr-link">Element</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>
@ -1875,7 +1886,7 @@ Converts path coordinates into relative values
<span class="dr-description">CSS selector of the element</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the current element</span></p>
</div></section></article><article id="Snap.selectAll" class="Snap-selectAll-section"><header><h3 id="Snap.selectAll" class="dr-method">Snap.selectAll(query)<a href="#Snap.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1383 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1383">&#x27ad;</a></h3></header>
</div></section></article><article id="Snap.selectAll" class="Snap-selectAll-section"><header><h3 id="Snap.selectAll" class="dr-method">Snap.selectAll(query)<a href="#Snap.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1371 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1371">&#x27ad;</a></h3></header>
<section><div class="extra" id="Snap.selectAll-extra"></div><div class="dr-method"><p>Wraps DOM elements specified by CSS selector as set or array of <a href="#Element" class="dr-link">Element</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>

4
dist/snap.svg-min.js vendored
View File

File diff suppressed because one or more lines are too long

52
dist/snap.svg.js vendored
View File

@ -14,7 +14,7 @@
// See the License for the specific language governing permissions and
// limitations under the License.
//
// build: 2013-10-15
// build: 2013-10-18
// Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
@ -1511,7 +1511,6 @@ 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 ]
@ -1545,7 +1544,6 @@ function Matrix(a, b, c, d, e, f) {
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 ]
@ -1555,6 +1553,7 @@ function Matrix(a, b, c, d, e, f) {
- 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
* Default cx, cy is the middle point of the element.
\*/
matrixproto.scale = function (x, y, cx, cy) {
y == null && (y = x);
@ -2332,31 +2331,20 @@ function extractTransform(el, tstr) {
return new Matrix;
}
tstr = svgTransform2string(tstr);
} else if (!rgTransform.test(tstr)) {
tstr = svgTransform2string(tstr);
} else {
tstr = Str(tstr).replace(/\.{3}|\u2026/g, el._.transform || E);
el._.transform = tstr;
if (!rgTransform.test(tstr)) {
tstr = svgTransform2string(tstr);
} else {
tstr = Str(tstr).replace(/\.{3}|\u2026/g, el._.transform || E);
}
}
el._.transform = tstr;
var m = transform2matrix(tstr, el.getBBox(1));
if (doReturn) {
return m;
} else {
el.matrix = m;
}
// _.sx = sx;
// _.sy = sy;
// _.deg = deg;
// _.dx = dx = m.e;
// _.dy = dy = m.f;
//
// if (sx == 1 && sy == 1 && !deg && _.bbox) {
// _.bbox.x += +dx;
// _.bbox.y += +dy;
// } else {
// _.dirtyT = 1;
// }
}
Snap._unit2px = unit2px;
function getSomeDefs(el) {
@ -2652,7 +2640,7 @@ function arrayFirstValue(arr) {
return Snap._.box(_.bbox);
};
var propString = function () {
return this.local;
return this.string;
};
// 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.
@ -2681,14 +2669,17 @@ function arrayFirstValue(arr) {
var _ = this._;
if (tstr == null) {
var global = new Matrix(this.node.getCTM()),
local = extractTransform(this);
local = extractTransform(this),
localString = local.toTransformString(),
string = Str(local) == Str(this.matrix) ?
_.transform : localString;
return {
string: Str(_.transform) || "",
string: string,
globalMatrix: global,
localMatrix: local,
diffMatrix: global.clone().add(local.invert()),
global: global.toTransformString(),
local: local.toTransformString(),
local: localString,
toString: propString
};
}
@ -3168,10 +3159,6 @@ function arrayFirstValue(arr) {
}
return res;
};
// SIERRA unfamiliar with the phrase _caring function,_ so the text for the _setter_ param isn't clear.
// SIERRA With the animation's start/end states defined, how is its _speed_ distinguished from its _duration_?
// SIERRA Text explaining the mina format should move to the section on the mina object interface. (Prior comment applies: object interfaces need to also be documented.)
// SIERRA unclear how to express a custom _easing_ (+)
/*\
* Snap.animate
[ method ]
@ -3193,6 +3180,14 @@ function arrayFirstValue(arr) {
o status (function) gets or sets the status of the animation,
o stop (function) stops the animation
o }
| 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);
\*/
Snap.animate = function (from, to, setter, ms, easing, callback) {
if (typeof easing == "function" && !easing.length) {
@ -3204,7 +3199,6 @@ function arrayFirstValue(arr) {
callback && eve.once("mina.finish." + anim.id, callback);
return anim;
};
// SIERRA Element.stop(). Does it _stop_ or _pause_ the animations? If you run Element.animate() to restart the animation, does it commence from the beginning?
/*\
* Element.stop
[ method ]

37
src/svg.js
View File

@ -414,7 +414,6 @@ 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 ]
@ -448,7 +447,6 @@ function Matrix(a, b, c, d, e, f) {
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 ]
@ -458,6 +456,7 @@ function Matrix(a, b, c, d, e, f) {
- 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
* Default cx, cy is the middle point of the element.
\*/
matrixproto.scale = function (x, y, cx, cy) {
y == null && (y = x);
@ -1235,31 +1234,20 @@ function extractTransform(el, tstr) {
return new Matrix;
}
tstr = svgTransform2string(tstr);
} else if (!rgTransform.test(tstr)) {
tstr = svgTransform2string(tstr);
} else {
tstr = Str(tstr).replace(/\.{3}|\u2026/g, el._.transform || E);
el._.transform = tstr;
if (!rgTransform.test(tstr)) {
tstr = svgTransform2string(tstr);
} else {
tstr = Str(tstr).replace(/\.{3}|\u2026/g, el._.transform || E);
}
}
el._.transform = tstr;
var m = transform2matrix(tstr, el.getBBox(1));
if (doReturn) {
return m;
} else {
el.matrix = m;
}
// _.sx = sx;
// _.sy = sy;
// _.deg = deg;
// _.dx = dx = m.e;
// _.dy = dy = m.f;
//
// if (sx == 1 && sy == 1 && !deg && _.bbox) {
// _.bbox.x += +dx;
// _.bbox.y += +dy;
// } else {
// _.dirtyT = 1;
// }
}
Snap._unit2px = unit2px;
function getSomeDefs(el) {
@ -1555,7 +1543,7 @@ function arrayFirstValue(arr) {
return Snap._.box(_.bbox);
};
var propString = function () {
return this.local;
return this.string;
};
// 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.
@ -1584,14 +1572,17 @@ function arrayFirstValue(arr) {
var _ = this._;
if (tstr == null) {
var global = new Matrix(this.node.getCTM()),
local = extractTransform(this);
local = extractTransform(this),
localString = local.toTransformString(),
string = Str(local) == Str(this.matrix) ?
_.transform : localString;
return {
string: Str(_.transform) || "",
string: string,
globalMatrix: global,
localMatrix: local,
diffMatrix: global.clone().add(local.invert()),
global: global.toTransformString(),
local: local.toTransformString(),
local: localString,
toString: propString
};
}