1<!DOCTYPE html>
2<html>
3    <head>
4        <meta charset="utf-8">
5        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
6        <base href="http://snapsvg.io/docs/">
7        <title>Snap.svg API Reference</title>
8        <link rel="shortcut icon" href="/assets/favicon.ico?v=1">
9        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
10        <link rel="stylesheet" href="/assets/docs/fonts/stylesheet.css?v=201311041519">
11        <link rel="stylesheet" href="/assets/docs/css/topcoat-desktop-light.css?v=201311041519">
12        <link rel="stylesheet" href="/assets/docs/css/main.css?v=201311041519">
13        <link rel="stylesheet" href="/assets/docs/css/dr.css?v=201311041519">
14        <link rel="stylesheet" href="/assets/docs/css/prism.css?v=201311041519">
15        <link rel="stylesheet" href="/assets/style/docs-header.css?v=201311041519">
16        <script>
17            var _gaq = _gaq || [];
18            _gaq.push(['_setAccount', 'UA-44948757-1']);
19            _gaq.push(['_trackPageview']);
20
21            (function() {
22                var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
23                ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
24                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
25            })();
26
27            function trackOutboundLink(link, category, action) {
28                try {
29                    _gaq.push(['_trackEvent', category , action]);
30                } catch(err){}
31
32                setTimeout(function() {
33                    document.location.href = link.href;
34                }, 100);
35            }
36        </script>
37    </head>
38    <body class="light">
39
40        <header id="header">
41            <div class="wrap">
42                <a href="/" class="logo">
43                    <img src="/assets/images/logo.svg" alt=""/>
44                    <span class="header">Snap.svg</span>
45                </a>
46                <nav>
47                    <a href="/">Home</a>
48                    <a href="/about/">Why Snap</a>
49                    <a href="/start/" class="mobile-hide">Getting Started</a>
50                    <a href="/docs/" class="mobile-hide selected">Docs</a>
51                    <a href="/support/">Support</a>
52                    <a href="/demos/" class="mobile-hide">Demos</a>
53                    <a class="bt" href="/assets/downloads/Snap.svg-0.1.0.zip" onclick="trackOutboundLink(this, 'Download', '0.1');return false;">Download</a>
54                </nav>
55            </div>
56        </header>
57
58<!--[if lt IE 9]>
59<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
60
61        <div id="wrapper">
62            <div class="max-width">
63                  <div id="sideNav">
64                      <div class="combo">
65                          <input type="search" id="dr-filter" value="" placeholder="search" class="topcoat-search-input">
66                      </div>
67                      <div id="pageNav">
68                          <ol id="dr-toc">
69
70                              <li class="dr-lvl0">
71                                  <a href="#Element" class="undefined"><span>Element</span></a>
72                              </li>
73
74                              <li class="dr-lvl1">
75                                  <a href="#Element.add" class="dr-method"><span>Element.add()</span></a>
76                              </li>
77
78                              <li class="dr-lvl1">
79                                  <a href="#Element.addClass" class="dr-method"><span>Element.addClass()</span></a>
80                              </li>
81
82                              <li class="dr-lvl1">
83                                  <a href="#Element.after" class="dr-method"><span>Element.after()</span></a>
84                              </li>
85
86                              <li class="dr-lvl1">
87                                  <a href="#Element.animate" class="dr-method"><span>Element.animate()</span></a>
88                              </li>
89
90                              <li class="dr-lvl1">
91                                  <a href="#Element.append" class="dr-method"><span>Element.append()</span></a>
92                              </li>
93
94                              <li class="dr-lvl1">
95                                  <a href="#Element.appendTo" class="dr-method"><span>Element.appendTo()</span></a>
96                              </li>
97
98                              <li class="dr-lvl1">
99                                  <a href="#Element.asPX" class="dr-method"><span>Element.asPX()</span></a>
100                              </li>
101
102                              <li class="dr-lvl1">
103                                  <a href="#Element.attr" class="dr-method"><span>Element.attr()</span></a>
104                              </li>
105
106                              <li class="dr-lvl1">
107                                  <a href="#Element.before" class="dr-method"><span>Element.before()</span></a>
108                              </li>
109
110                              <li class="dr-lvl1">
111                                  <a href="#Element.children" class="dr-method"><span>Element.children()</span></a>
112                              </li>
113
114                              <li class="dr-lvl1">
115                                  <a href="#Element.click" class="dr-method"><span>Element.click()</span></a>
116                              </li>
117
118                              <li class="dr-lvl1">
119                                  <a href="#Element.clone" class="dr-method"><span>Element.clone()</span></a>
120                              </li>
121
122                              <li class="dr-lvl1">
123                                  <a href="#Element.data" class="dr-method"><span>Element.data()</span></a>
124                              </li>
125
126                              <li class="dr-lvl1">
127                                  <a href="#Element.dblclick" class="dr-method"><span>Element.dblclick()</span></a>
128                              </li>
129
130                              <li class="dr-lvl1">
131                                  <a href="#Element.drag" class="dr-method"><span>Element.drag()</span></a>
132                              </li>
133
134                              <li class="dr-lvl1">
135                                  <a href="#Element.getBBox" class="dr-method"><span>Element.getBBox()</span></a>
136                              </li>
137
138                              <li class="dr-lvl1">
139                                  <a href="#Element.getPointAtLength" class="dr-method"><span>Element.getPointAtLength()</span></a>
140                              </li>
141
142                              <li class="dr-lvl1">
143                                  <a href="#Element.getSubpath" class="dr-method"><span>Element.getSubpath()</span></a>
144                              </li>
145
146                              <li class="dr-lvl1">
147                                  <a href="#Element.getTotalLength" class="dr-method"><span>Element.getTotalLength()</span></a>
148                              </li>
149
150                              <li class="dr-lvl1">
151                                  <a href="#Element.hasClass" class="dr-method"><span>Element.hasClass()</span></a>
152                              </li>
153
154                              <li class="dr-lvl1">
155                                  <a href="#Element.hover" class="dr-method"><span>Element.hover()</span></a>
156                              </li>
157
158                              <li class="dr-lvl1">
159                                  <a href="#Element.inAnim" class="dr-method"><span>Element.inAnim()</span></a>
160                              </li>
161
162                              <li class="dr-lvl1">
163                                  <a href="#Element.innerSVG" class="dr-method"><span>Element.innerSVG()</span></a>
164                              </li>
165
166                              <li class="dr-lvl1">
167                                  <a href="#Element.insertAfter" class="dr-method"><span>Element.insertAfter()</span></a>
168                              </li>
169
170                              <li class="dr-lvl1">
171                                  <a href="#Element.insertBefore" class="dr-method"><span>Element.insertBefore()</span></a>
172                              </li>
173
174                              <li class="dr-lvl1">
175                                  <a href="#Element.marker" class="dr-method"><span>Element.marker()</span></a>
176                              </li>
177
178                              <li class="dr-lvl1">
179                                  <a href="#Element.mousedown" class="dr-method"><span>Element.mousedown()</span></a>
180                              </li>
181
182                              <li class="dr-lvl1">
183                                  <a href="#Element.mousemove" class="dr-method"><span>Element.mousemove()</span></a>
184                              </li>
185
186                              <li class="dr-lvl1">
187                                  <a href="#Element.mouseout" class="dr-method"><span>Element.mouseout()</span></a>
188                              </li>
189
190                              <li class="dr-lvl1">
191                                  <a href="#Element.mouseover" class="dr-method"><span>Element.mouseover()</span></a>
192                              </li>
193
194                              <li class="dr-lvl1">
195                                  <a href="#Element.mouseup" class="dr-method"><span>Element.mouseup()</span></a>
196                              </li>
197
198                              <li class="dr-lvl1">
199                                  <a href="#Element.node" class="dr-property"><span>Element.node</span></a>
200                              </li>
201
202                              <li class="dr-lvl1">
203                                  <a href="#Element.outerSVG" class="dr-method"><span>Element.outerSVG()</span></a>
204                              </li>
205
206                              <li class="dr-lvl1">
207                                  <a href="#Element.parent" class="dr-method"><span>Element.parent()</span></a>
208                              </li>
209
210                              <li class="dr-lvl1">
211                                  <a href="#Element.prepend" class="dr-method"><span>Element.prepend()</span></a>
212                              </li>
213
214                              <li class="dr-lvl1">
215                                  <a href="#Element.prependTo" class="dr-method"><span>Element.prependTo()</span></a>
216                              </li>
217
218                              <li class="dr-lvl1">
219                                  <a href="#Element.remove" class="dr-method"><span>Element.remove()</span></a>
220                              </li>
221
222                              <li class="dr-lvl1">
223                                  <a href="#Element.removeClass" class="dr-method"><span>Element.removeClass()</span></a>
224                              </li>
225
226                              <li class="dr-lvl1">
227                                  <a href="#Element.removeData" class="dr-method"><span>Element.removeData()</span></a>
228                              </li>
229
230                              <li class="dr-lvl1">
231                                  <a href="#Element.select" class="dr-method"><span>Element.select()</span></a>
232                              </li>
233
234                              <li class="dr-lvl1">
235                                  <a href="#Element.selectAll" class="dr-method"><span>Element.selectAll()</span></a>
236                              </li>
237
238                              <li class="dr-lvl1">
239                                  <a href="#Element.stop" class="dr-method"><span>Element.stop()</span></a>
240                              </li>
241
242                              <li class="dr-lvl1">
243                                  <a href="#Element.toDefs" class="dr-method"><span>Element.toDefs()</span></a>
244                              </li>
245
246                              <li class="dr-lvl1">
247                                  <a href="#Element.toJSON" class="dr-method"><span>Element.toJSON()</span></a>
248                              </li>
249
250                              <li class="dr-lvl1">
251                                  <a href="#Element.toPattern" class="dr-method"><span>Element.toPattern()</span></a>
252                              </li>
253
254                              <li class="dr-lvl1">
255                                  <a href="#Element.toString" class="dr-method"><span>Element.toString()</span></a>
256                              </li>
257
258                              <li class="dr-lvl1">
259                                  <a href="#Element.toggleClass" class="dr-method"><span>Element.toggleClass()</span></a>
260                              </li>
261
262                              <li class="dr-lvl1">
263                                  <a href="#Element.touchcancel" class="dr-method"><span>Element.touchcancel()</span></a>
264                              </li>
265
266                              <li class="dr-lvl1">
267                                  <a href="#Element.touchend" class="dr-method"><span>Element.touchend()</span></a>
268                              </li>
269
270                              <li class="dr-lvl1">
271                                  <a href="#Element.touchmove" class="dr-method"><span>Element.touchmove()</span></a>
272                              </li>
273
274                              <li class="dr-lvl1">
275                                  <a href="#Element.touchstart" class="dr-method"><span>Element.touchstart()</span></a>
276                              </li>
277
278                              <li class="dr-lvl1">
279                                  <a href="#Element.transform" class="dr-method"><span>Element.transform()</span></a>
280                              </li>
281
282                              <li class="dr-lvl1">
283                                  <a href="#Element.type" class="dr-property"><span>Element.type</span></a>
284                              </li>
285
286                              <li class="dr-lvl1">
287                                  <a href="#Element.unclick" class="dr-method"><span>Element.unclick()</span></a>
288                              </li>
289
290                              <li class="dr-lvl1">
291                                  <a href="#Element.undblclick" class="dr-method"><span>Element.undblclick()</span></a>
292                              </li>
293
294                              <li class="dr-lvl1">
295                                  <a href="#Element.undrag" class="dr-method"><span>Element.undrag()</span></a>
296                              </li>
297
298                              <li class="dr-lvl1">
299                                  <a href="#Element.unhover" class="dr-method"><span>Element.unhover()</span></a>
300                              </li>
301
302                              <li class="dr-lvl1">
303                                  <a href="#Element.unmousedown" class="dr-method"><span>Element.unmousedown()</span></a>
304                              </li>
305
306                              <li class="dr-lvl1">
307                                  <a href="#Element.unmousemove" class="dr-method"><span>Element.unmousemove()</span></a>
308                              </li>
309
310                              <li class="dr-lvl1">
311                                  <a href="#Element.unmouseout" class="dr-method"><span>Element.unmouseout()</span></a>
312                              </li>
313
314                              <li class="dr-lvl1">
315                                  <a href="#Element.unmouseover" class="dr-method"><span>Element.unmouseover()</span></a>
316                              </li>
317
318                              <li class="dr-lvl1">
319                                  <a href="#Element.unmouseup" class="dr-method"><span>Element.unmouseup()</span></a>
320                              </li>
321
322                              <li class="dr-lvl1">
323                                  <a href="#Element.untouchcancel" class="dr-method"><span>Element.untouchcancel()</span></a>
324                              </li>
325
326                              <li class="dr-lvl1">
327                                  <a href="#Element.untouchend" class="dr-method"><span>Element.untouchend()</span></a>
328                              </li>
329
330                              <li class="dr-lvl1">
331                                  <a href="#Element.untouchmove" class="dr-method"><span>Element.untouchmove()</span></a>
332                              </li>
333
334                              <li class="dr-lvl1">
335                                  <a href="#Element.untouchstart" class="dr-method"><span>Element.untouchstart()</span></a>
336                              </li>
337
338                              <li class="dr-lvl1">
339                                  <a href="#Element.use" class="dr-method"><span>Element.use()</span></a>
340                              </li>
341
342                              <li class="dr-lvl0">
343                                  <a href="#Fragment" class="undefined"><span>Fragment</span></a>
344                              </li>
345
346                              <li class="dr-lvl1">
347                                  <a href="#Fragment.select" class="dr-method"><span>Fragment.select()</span></a>
348                              </li>
349
350                              <li class="dr-lvl1">
351                                  <a href="#Fragment.selectAll" class="dr-method"><span>Fragment.selectAll()</span></a>
352                              </li>
353
354                              <li class="dr-lvl0">
355                                  <a href="#Matrix" class="undefined"><span>Matrix</span></a>
356                              </li>
357
358                              <li class="dr-lvl1">
359                                  <a href="#Matrix.add" class="dr-method"><span>Matrix.add()</span></a>
360                              </li>
361
362                              <li class="dr-lvl1">
363                                  <a href="#Matrix.clone" class="dr-method"><span>Matrix.clone()</span></a>
364                              </li>
365
366                              <li class="dr-lvl1">
367                                  <a href="#Matrix.determinant" class="dr-method"><span>Matrix.determinant()</span></a>
368                              </li>
369
370                              <li class="dr-lvl1">
371                                  <a href="#Matrix.invert" class="dr-method"><span>Matrix.invert()</span></a>
372                              </li>
373
374                              <li class="dr-lvl1">
375                                  <a href="#Matrix.rotate" class="dr-method"><span>Matrix.rotate()</span></a>
376                              </li>
377
378                              <li class="dr-lvl1">
379                                  <a href="#Matrix.scale" class="dr-method"><span>Matrix.scale()</span></a>
380                              </li>
381
382                              <li class="dr-lvl1">
383                                  <a href="#Matrix.split" class="dr-method"><span>Matrix.split()</span></a>
384                              </li>
385
386                              <li class="dr-lvl1">
387                                  <a href="#Matrix.toTransformString" class="dr-method"><span>Matrix.toTransformString()</span></a>
388                              </li>
389
390                              <li class="dr-lvl1">
391                                  <a href="#Matrix.translate" class="dr-method"><span>Matrix.translate()</span></a>
392                              </li>
393
394                              <li class="dr-lvl1">
395                                  <a href="#Matrix.x" class="dr-method"><span>Matrix.x()</span></a>
396                              </li>
397
398                              <li class="dr-lvl1">
399                                  <a href="#Matrix.y" class="dr-method"><span>Matrix.y()</span></a>
400                              </li>
401
402                              <li class="dr-lvl0">
403                                  <a href="#Paper" class="undefined"><span>Paper</span></a>
404                              </li>
405
406                              <li class="dr-lvl1">
407                                  <a href="#Paper.circle" class="dr-method"><span>Paper.circle()</span></a>
408                              </li>
409
410                              <li class="dr-lvl1">
411                                  <a href="#Paper.clear" class="dr-method"><span>Paper.clear()</span></a>
412                              </li>
413
414                              <li class="dr-lvl1">
415                                  <a href="#Paper.el" class="dr-method"><span>Paper.el()</span></a>
416                              </li>
417
418                              <li class="dr-lvl1">
419                                  <a href="#Paper.ellipse" class="dr-method"><span>Paper.ellipse()</span></a>
420                              </li>
421
422                              <li class="dr-lvl1">
423                                  <a href="#Paper.filter" class="dr-method"><span>Paper.filter()</span></a>
424                              </li>
425
426                              <li class="dr-lvl1">
427                                  <a href="#Paper.g" class="dr-method"><span>Paper.g()</span></a>
428                              </li>
429
430                              <li class="dr-lvl1">
431                                  <a href="#Paper.gradient" class="dr-method"><span>Paper.gradient()</span></a>
432                              </li>
433
434                              <li class="dr-lvl1">
435                                  <a href="#Paper.group" class="dr-method"><span>Paper.group()</span></a>
436                              </li>
437
438                              <li class="dr-lvl1">
439                                  <a href="#Paper.image" class="dr-method"><span>Paper.image()</span></a>
440                              </li>
441
442                              <li class="dr-lvl1">
443                                  <a href="#Paper.line" class="dr-method"><span>Paper.line()</span></a>
444                              </li>
445
446                              <li class="dr-lvl1">
447                                  <a href="#Paper.mask" class="dr-method"><span>Paper.mask()</span></a>
448                              </li>
449
450                              <li class="dr-lvl1">
451                                  <a href="#Paper.path" class="dr-method"><span>Paper.path()</span></a>
452                              </li>
453
454                              <li class="dr-lvl1">
455                                  <a href="#Paper.polygon" class="dr-method"><span>Paper.polygon()</span></a>
456                              </li>
457
458                              <li class="dr-lvl1">
459                                  <a href="#Paper.polyline" class="dr-method"><span>Paper.polyline()</span></a>
460                              </li>
461
462                              <li class="dr-lvl1">
463                                  <a href="#Paper.ptrn" class="dr-method"><span>Paper.ptrn()</span></a>
464                              </li>
465
466                              <li class="dr-lvl1">
467                                  <a href="#Paper.rect" class="dr-method"><span>Paper.rect()</span></a>
468                              </li>
469
470                              <li class="dr-lvl1">
471                                  <a href="#Paper.svg" class="dr-method"><span>Paper.svg()</span></a>
472                              </li>
473
474                              <li class="dr-lvl1">
475                                  <a href="#Paper.symbol" class="dr-method"><span>Paper.symbol()</span></a>
476                              </li>
477
478                              <li class="dr-lvl1">
479                                  <a href="#Paper.text" class="dr-method"><span>Paper.text()</span></a>
480                              </li>
481
482                              <li class="dr-lvl1">
483                                  <a href="#Paper.toDataURL" class="dr-method"><span>Paper.toDataURL()</span></a>
484                              </li>
485
486                              <li class="dr-lvl1">
487                                  <a href="#Paper.toString" class="dr-method"><span>Paper.toString()</span></a>
488                              </li>
489
490                              <li class="dr-lvl1">
491                                  <a href="#Paper.use" class="dr-method"><span>Paper.use()</span></a>
492                              </li>
493
494                              <li class="dr-lvl0">
495                                  <a href="#Set" class="undefined"><span>Set</span></a>
496                              </li>
497
498                              <li class="dr-lvl1">
499                                  <a href="#Set.animate" class="dr-method"><span>Set.animate()</span></a>
500                              </li>
501
502                              <li class="dr-lvl1">
503                                  <a href="#Set.bind" class="dr-method"><span>Set.bind()</span></a>
504                              </li>
505
506                              <li class="dr-lvl1">
507                                  <a href="#Set.clear" class="dr-method"><span>Set.clear()</span></a>
508                              </li>
509
510                              <li class="dr-lvl1">
511                                  <a href="#Set.exclude" class="dr-method"><span>Set.exclude()</span></a>
512                              </li>
513
514                              <li class="dr-lvl1">
515                                  <a href="#Set.forEach" class="dr-method"><span>Set.forEach()</span></a>
516                              </li>
517
518                              <li class="dr-lvl1">
519                                  <a href="#Set.pop" class="dr-method"><span>Set.pop()</span></a>
520                              </li>
521
522                              <li class="dr-lvl1">
523                                  <a href="#Set.push" class="dr-method"><span>Set.push()</span></a>
524                              </li>
525
526                              <li class="dr-lvl1">
527                                  <a href="#Set.splice" class="dr-method"><span>Set.splice()</span></a>
528                              </li>
529
530                              <li class="dr-lvl0">
531                                  <a href="#Snap" class="undefined"><span>Snap</span></a>
532                              </li>
533
534                              <li class="dr-lvl1">
535                                  <a href="#Snap.Matrix" class="dr-method"><span>Snap.Matrix()</span></a>
536                              </li>
537
538                              <li class="dr-lvl1">
539                                  <a href="#Snap.acos" class="dr-method"><span>Snap.acos()</span></a>
540                              </li>
541
542                              <li class="dr-lvl1">
543                                  <a href="#Snap.ajax" class="dr-method"><span>Snap.ajax()</span></a>
544                              </li>
545
546                              <li class="dr-lvl1">
547                                  <a href="#Snap.angle" class="dr-method"><span>Snap.angle()</span></a>
548                              </li>
549
550                              <li class="dr-lvl1">
551                                  <a href="#Snap.animate" class="dr-method"><span>Snap.animate()</span></a>
552                              </li>
553
554                              <li class="dr-lvl1">
555                                  <a href="#Snap.animation" class="dr-method"><span>Snap.animation()</span></a>
556                              </li>
557
558                              <li class="dr-lvl1">
559                                  <a href="#Snap.asin" class="dr-method"><span>Snap.asin()</span></a>
560                              </li>
561
562                              <li class="dr-lvl1">
563                                  <a href="#Snap.atan" class="dr-method"><span>Snap.atan()</span></a>
564                              </li>
565
566                              <li class="dr-lvl1">
567                                  <a href="#Snap.atan2" class="dr-method"><span>Snap.atan2()</span></a>
568                              </li>
569
570                              <li class="dr-lvl1">
571                                  <a href="#Snap.closestPoint" class="dr-method"><span>Snap.closestPoint()</span></a>
572                              </li>
573
574                              <li class="dr-lvl1">
575                                  <a href="#Snap.color" class="dr-method"><span>Snap.color()</span></a>
576                              </li>
577
578                              <li class="dr-lvl1">
579                                  <a href="#Snap.cos" class="dr-method"><span>Snap.cos()</span></a>
580                              </li>
581
582                              <li class="dr-lvl1">
583                                  <a href="#Snap.deg" class="dr-method"><span>Snap.deg()</span></a>
584                              </li>
585
586                              <li class="dr-lvl1">
587                                  <a href="#Snap.filter" class="undefined"><span>Snap.filter</span></a>
588                              </li>
589
590                              <li class="dr-lvl2">
591                                  <a href="#Snap.filter.blur" class="dr-method"><span>Snap.filter.blur()</span></a>
592                              </li>
593
594                              <li class="dr-lvl2">
595                                  <a href="#Snap.filter.brightness" class="dr-method"><span>Snap.filter.brightness()</span></a>
596                              </li>
597
598                              <li class="dr-lvl2">
599                                  <a href="#Snap.filter.contrast" class="dr-method"><span>Snap.filter.contrast()</span></a>
600                              </li>
601
602                              <li class="dr-lvl2">
603                                  <a href="#Snap.filter.grayscale" class="dr-method"><span>Snap.filter.grayscale()</span></a>
604                              </li>
605
606                              <li class="dr-lvl2">
607                                  <a href="#Snap.filter.hueRotate" class="dr-method"><span>Snap.filter.hueRotate()</span></a>
608                              </li>
609
610                              <li class="dr-lvl2">
611                                  <a href="#Snap.filter.invert" class="dr-method"><span>Snap.filter.invert()</span></a>
612                              </li>
613
614                              <li class="dr-lvl2">
615                                  <a href="#Snap.filter.saturate" class="dr-method"><span>Snap.filter.saturate()</span></a>
616                              </li>
617
618                              <li class="dr-lvl2">
619                                  <a href="#Snap.filter.sepia" class="dr-method"><span>Snap.filter.sepia()</span></a>
620                              </li>
621
622                              <li class="dr-lvl2">
623                                  <a href="#Snap.filter.shadow" class="dr-method"><span>Snap.filter.shadow()</span></a>
624                              </li>
625
626                              <li class="dr-lvl1">
627                                  <a href="#Snap.format" class="dr-method"><span>Snap.format()</span></a>
628                              </li>
629
630                              <li class="dr-lvl1">
631                                  <a href="#Snap.fragment" class="dr-method"><span>Snap.fragment()</span></a>
632                              </li>
633
634                              <li class="dr-lvl1">
635                                  <a href="#Snap.getElementByPoint" class="dr-method"><span>Snap.getElementByPoint()</span></a>
636                              </li>
637
638                              <li class="dr-lvl1">
639                                  <a href="#Snap.getRGB" class="dr-method"><span>Snap.getRGB()</span></a>
640                              </li>
641
642                              <li class="dr-lvl1">
643                                  <a href="#Snap.hsb" class="dr-method"><span>Snap.hsb()</span></a>
644                              </li>
645
646                              <li class="dr-lvl1">
647                                  <a href="#Snap.hsb2rgb" class="dr-method"><span>Snap.hsb2rgb()</span></a>
648                              </li>
649
650                              <li class="dr-lvl1">
651                                  <a href="#Snap.hsl" class="dr-method"><span>Snap.hsl()</span></a>
652                              </li>
653
654                              <li class="dr-lvl1">
655                                  <a href="#Snap.hsl2rgb" class="dr-method"><span>Snap.hsl2rgb()</span></a>
656                              </li>
657
658                              <li class="dr-lvl1">
659                                  <a href="#Snap.is" class="dr-method"><span>Snap.is()</span></a>
660                              </li>
661
662                              <li class="dr-lvl1">
663                                  <a href="#Snap.len" class="dr-method"><span>Snap.len()</span></a>
664                              </li>
665
666                              <li class="dr-lvl1">
667                                  <a href="#Snap.len2" class="dr-method"><span>Snap.len2()</span></a>
668                              </li>
669
670                              <li class="dr-lvl1">
671                                  <a href="#Snap.load" class="dr-method"><span>Snap.load()</span></a>
672                              </li>
673
674                              <li class="dr-lvl1">
675                                  <a href="#Snap.matrix" class="dr-method"><span>Snap.matrix()</span></a>
676                              </li>
677
678                              <li class="dr-lvl1">
679                                  <a href="#Snap.parse" class="dr-method"><span>Snap.parse()</span></a>
680                              </li>
681
682                              <li class="dr-lvl1">
683                                  <a href="#Snap.parsePathString" class="dr-method"><span>Snap.parsePathString()</span></a>
684                              </li>
685
686                              <li class="dr-lvl1">
687                                  <a href="#Snap.parseTransformString" class="dr-method"><span>Snap.parseTransformString()</span></a>
688                              </li>
689
690                              <li class="dr-lvl1">
691                                  <a href="#Snap.path" class="undefined"><span>Snap.path</span></a>
692                              </li>
693
694                              <li class="dr-lvl2">
695                                  <a href="#Snap.path.bezierBBox" class="dr-method"><span>Snap.path.bezierBBox()</span></a>
696                              </li>
697
698                              <li class="dr-lvl2">
699                                  <a href="#Snap.path.findDotsAtSegment" class="dr-method"><span>Snap.path.findDotsAtSegment()</span></a>
700                              </li>
701
702                              <li class="dr-lvl2">
703                                  <a href="#Snap.path.getBBox" class="dr-method"><span>Snap.path.getBBox()</span></a>
704                              </li>
705
706                              <li class="dr-lvl2">
707                                  <a href="#Snap.path.getPointAtLength" class="dr-method"><span>Snap.path.getPointAtLength()</span></a>
708                              </li>
709
710                              <li class="dr-lvl2">
711                                  <a href="#Snap.path.getSubpath" class="dr-method"><span>Snap.path.getSubpath()</span></a>
712                              </li>
713
714                              <li class="dr-lvl2">
715                                  <a href="#Snap.path.getTotalLength" class="dr-method"><span>Snap.path.getTotalLength()</span></a>
716                              </li>
717
718                              <li class="dr-lvl2">
719                                  <a href="#Snap.path.intersection" class="dr-method"><span>Snap.path.intersection()</span></a>
720                              </li>
721
722                              <li class="dr-lvl2">
723                                  <a href="#Snap.path.isBBoxIntersect" class="dr-method"><span>Snap.path.isBBoxIntersect()</span></a>
724                              </li>
725
726                              <li class="dr-lvl2">
727                                  <a href="#Snap.path.isPointInside" class="dr-method"><span>Snap.path.isPointInside()</span></a>
728                              </li>
729
730                              <li class="dr-lvl2">
731                                  <a href="#Snap.path.isPointInsideBBox" class="dr-method"><span>Snap.path.isPointInsideBBox()</span></a>
732                              </li>
733
734                              <li class="dr-lvl2">
735                                  <a href="#Snap.path.map" class="dr-method"><span>Snap.path.map()</span></a>
736                              </li>
737
738                              <li class="dr-lvl2">
739                                  <a href="#Snap.path.toAbsolute" class="dr-method"><span>Snap.path.toAbsolute()</span></a>
740                              </li>
741
742                              <li class="dr-lvl2">
743                                  <a href="#Snap.path.toCubic" class="dr-method"><span>Snap.path.toCubic()</span></a>
744                              </li>
745
746                              <li class="dr-lvl2">
747                                  <a href="#Snap.path.toRelative" class="dr-method"><span>Snap.path.toRelative()</span></a>
748                              </li>
749
750                              <li class="dr-lvl1">
751                                  <a href="#Snap.plugin" class="dr-method"><span>Snap.plugin()</span></a>
752                              </li>
753
754                              <li class="dr-lvl1">
755                                  <a href="#Snap.rad" class="dr-method"><span>Snap.rad()</span></a>
756                              </li>
757
758                              <li class="dr-lvl1">
759                                  <a href="#Snap.rgb" class="dr-method"><span>Snap.rgb()</span></a>
760                              </li>
761
762                              <li class="dr-lvl1">
763                                  <a href="#Snap.rgb2hsb" class="dr-method"><span>Snap.rgb2hsb()</span></a>
764                              </li>
765
766                              <li class="dr-lvl1">
767                                  <a href="#Snap.rgb2hsl" class="dr-method"><span>Snap.rgb2hsl()</span></a>
768                              </li>
769
770                              <li class="dr-lvl1">
771                                  <a href="#Snap.select" class="dr-method"><span>Snap.select()</span></a>
772                              </li>
773
774                              <li class="dr-lvl1">
775                                  <a href="#Snap.selectAll" class="dr-method"><span>Snap.selectAll()</span></a>
776                              </li>
777
778                              <li class="dr-lvl1">
779                                  <a href="#Snap.sin" class="dr-method"><span>Snap.sin()</span></a>
780                              </li>
781
782                              <li class="dr-lvl1">
783                                  <a href="#Snap.snapTo" class="dr-method"><span>Snap.snapTo()</span></a>
784                              </li>
785
786                              <li class="dr-lvl1">
787                                  <a href="#Snap.tan" class="dr-method"><span>Snap.tan()</span></a>
788                              </li>
789
790                              <li class="dr-lvl0">
791                                  <a href="#mina" class="dr-method"><span>mina()</span></a>
792                              </li>
793
794                              <li class="dr-lvl1">
795                                  <a href="#mina.backin" class="dr-method"><span>mina.backin()</span></a>
796                              </li>
797
798                              <li class="dr-lvl1">
799                                  <a href="#mina.backout" class="dr-method"><span>mina.backout()</span></a>
800                              </li>
801
802                              <li class="dr-lvl1">
803                                  <a href="#mina.bounce" class="dr-method"><span>mina.bounce()</span></a>
804                              </li>
805
806                              <li class="dr-lvl1">
807                                  <a href="#mina.easein" class="dr-method"><span>mina.easein()</span></a>
808                              </li>
809
810                              <li class="dr-lvl1">
811                                  <a href="#mina.easeinout" class="dr-method"><span>mina.easeinout()</span></a>
812                              </li>
813
814                              <li class="dr-lvl1">
815                                  <a href="#mina.easeout" class="dr-method"><span>mina.easeout()</span></a>
816                              </li>
817
818                              <li class="dr-lvl1">
819                                  <a href="#mina.elastic" class="dr-method"><span>mina.elastic()</span></a>
820                              </li>
821
822                              <li class="dr-lvl1">
823                                  <a href="#mina.getById" class="dr-method"><span>mina.getById()</span></a>
824                              </li>
825
826                              <li class="dr-lvl1">
827                                  <a href="#mina.linear" class="dr-method"><span>mina.linear()</span></a>
828                              </li>
829
830                              <li class="dr-lvl1">
831                                  <a href="#mina.time" class="dr-method"><span>mina.time()</span></a>
832                              </li>
833
834                          </ol>
835                      </div>
836                  </div>
837              </div>
838              <div id="site">
839                  <div id="content" class="max-width">
840
841                      <article id="Snap">
842                          <header>
843                              <h3 class="dr-method">Snap(…)<a href="#Snap" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 33 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L33">&#x27ad;</a></h3>
844                          </header>
845                          <section>
846                              <div class="extra" id="Snap-extra"></div>
847                              <div class="dr-method">
848
849
850
851
852                                  <p>Creates a drawing surface or wraps existing SVG element.
853</p>
854
855
856
857
858
859
860
861
862
863
864                                  <div class="topcoat-list__container">
865                                      <h3 class="topcoat-list__header">Parameters</h3>
866                                      <ol class="topcoat-list">
867                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
868                                              <span class="dr-type"><em class="dr-type-number">number</em> <em class="dr-type-string">string</em> </span>
869                                              <span class="dr-description">width of surface</span></li>
870                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
871                                              <span class="dr-type"><em class="dr-type-number">number</em> <em class="dr-type-string">string</em> </span>
872                                              <span class="dr-description">height of surface</span></li>
873
874                                      </ol>
875                                  </div>
876
877
878
879
880
881
882
883
884                                  <p>or
885</p>
886
887
888
889
890
891
892
893
894
895
896                                  <div class="topcoat-list__container">
897                                      <h3 class="topcoat-list__header">Parameters</h3>
898                                      <ol class="topcoat-list">
899                                          <li class="topcoat-list__item"><span class="dr-param">DOM</span>
900                                              <span class="dr-type"><em class="dr-type-SVGElement">SVGElement</em> </span>
901                                              <span class="dr-description">element to be wrapped into Snap structure</span></li>
902
903                                      </ol>
904                                  </div>
905
906
907
908
909
910
911
912
913                                  <p>or
914</p>
915
916
917
918
919
920
921
922
923
924
925                                  <div class="topcoat-list__container">
926                                      <h3 class="topcoat-list__header">Parameters</h3>
927                                      <ol class="topcoat-list">
928                                          <li class="topcoat-list__item"><span class="dr-param">array</span>
929                                              <span class="dr-type"><em class="dr-type-array">array</em> </span>
930                                              <span class="dr-description">array of elements (will return set of elements)</span></li>
931
932                                      </ol>
933                                  </div>
934
935
936
937
938
939
940
941
942                                  <p>or
943</p>
944
945
946
947
948
949
950
951
952
953
954                                  <div class="topcoat-list__container">
955                                      <h3 class="topcoat-list__header">Parameters</h3>
956                                      <ol class="topcoat-list">
957                                          <li class="topcoat-list__item"><span class="dr-param">query</span>
958                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
959                                              <span class="dr-description">CSS query selector</span></li>
960
961                                      </ol>
962                                  </div>
963
964
965
966
967
968
969
970
971
972
973
974
975
976                                  <p class="dr-returns">
977                                      <strong class="dr-title">Returns:</strong>
978
979                                      <em class="dr-type-object">object</em>
980
981                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
982                                  </p>
983
984
985
986
987                              </div>
988                          </section>
989                      </article>
990
991                      <article id="Snap.format">
992                          <header>
993                              <h3 class="dr-method">Snap.format(token, json)<a href="#Snap.format" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 200 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L200">&#x27ad;</a></h3>
994                          </header>
995                          <section>
996                              <div class="extra" id="Snap.format-extra"></div>
997                              <div class="dr-method">
998
999
1000
1001
1002                                  <p>Replaces construction of type <code>{&lt;name&gt;}</code> to the corresponding argument
1003</p>
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014                                  <div class="topcoat-list__container">
1015                                      <h3 class="topcoat-list__header">Parameters</h3>
1016                                      <ol class="topcoat-list">
1017                                          <li class="topcoat-list__item"><span class="dr-param">token</span>
1018                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
1019                                              <span class="dr-description">string to format</span></li>
1020                                          <li class="topcoat-list__item"><span class="dr-param">json</span>
1021                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
1022                                              <span class="dr-description">object which properties are used as a replacement</span></li>
1023
1024                                      </ol>
1025                                  </div>
1026
1027
1028
1029
1030
1031
1032
1033
1034
1035
1036
1037
1038
1039                                  <p class="dr-returns">
1040                                      <strong class="dr-title">Returns:</strong>
1041
1042                                      <em class="dr-type-string">string</em>
1043
1044                                      <span class="dr-description">formatted string</span>
1045                                  </p>
1046
1047
1048
1049
1050
1051
1052
1053
1054                                  <h3>Usage</h3>
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">// this draws a rectangular shape equivalent to "M10,20h40v50h-40z"
1067paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", {
1068    x: 10,
1069    y: 20,
1070    dim: {
1071        width: 40,
1072        height: 50,
1073        "negative width": -40
1074    }
1075}));</code></pre></section>
1076
1077
1078
1079
1080
1081                              </div>
1082                          </section>
1083                      </article>
1084
1085                      <article id="Snap.rad">
1086                          <header>
1087                              <h3 class="dr-method">Snap.rad(deg)<a href="#Snap.rad" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 290 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L290">&#x27ad;</a></h3>
1088                          </header>
1089                          <section>
1090                              <div class="extra" id="Snap.rad-extra"></div>
1091                              <div class="dr-method">
1092
1093
1094
1095
1096                                  <p>Transform angle to radians
1097</p>
1098
1099
1100
1101
1102
1103
1104
1105
1106
1107
1108                                  <div class="topcoat-list__container">
1109                                      <h3 class="topcoat-list__header">Parameters</h3>
1110                                      <ol class="topcoat-list">
1111                                          <li class="topcoat-list__item"><span class="dr-param">deg</span>
1112                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1113                                              <span class="dr-description">angle in degrees</span></li>
1114
1115                                      </ol>
1116                                  </div>
1117
1118
1119
1120
1121
1122
1123
1124
1125
1126
1127
1128
1129
1130                                  <p class="dr-returns">
1131                                      <strong class="dr-title">Returns:</strong>
1132
1133                                      <em class="dr-type-number">number</em>
1134
1135                                      <span class="dr-description">angle in radians</span>
1136                                  </p>
1137
1138
1139
1140
1141                              </div>
1142                          </section>
1143                      </article>
1144
1145                      <article id="Snap.deg">
1146                          <header>
1147                              <h3 class="dr-method">Snap.deg(rad)<a href="#Snap.deg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 299 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L299">&#x27ad;</a></h3>
1148                          </header>
1149                          <section>
1150                              <div class="extra" id="Snap.deg-extra"></div>
1151                              <div class="dr-method">
1152
1153
1154
1155
1156                                  <p>Transform angle to degrees
1157</p>
1158
1159
1160
1161
1162
1163
1164
1165
1166
1167
1168                                  <div class="topcoat-list__container">
1169                                      <h3 class="topcoat-list__header">Parameters</h3>
1170                                      <ol class="topcoat-list">
1171                                          <li class="topcoat-list__item"><span class="dr-param">rad</span>
1172                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1173                                              <span class="dr-description">angle in radians</span></li>
1174
1175                                      </ol>
1176                                  </div>
1177
1178
1179
1180
1181
1182
1183
1184
1185
1186
1187
1188
1189
1190                                  <p class="dr-returns">
1191                                      <strong class="dr-title">Returns:</strong>
1192
1193                                      <em class="dr-type-number">number</em>
1194
1195                                      <span class="dr-description">angle in degrees</span>
1196                                  </p>
1197
1198
1199
1200
1201                              </div>
1202                          </section>
1203                      </article>
1204
1205                      <article id="Snap.sin">
1206                          <header>
1207                              <h3 class="dr-method">Snap.sin(angle)<a href="#Snap.sin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 308 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L308">&#x27ad;</a></h3>
1208                          </header>
1209                          <section>
1210                              <div class="extra" id="Snap.sin-extra"></div>
1211                              <div class="dr-method">
1212
1213
1214
1215
1216                                  <p>Equivalent to <code>Math.sin()</code> only works with degrees, not radians.
1217</p>
1218
1219
1220
1221
1222
1223
1224
1225
1226
1227
1228                                  <div class="topcoat-list__container">
1229                                      <h3 class="topcoat-list__header">Parameters</h3>
1230                                      <ol class="topcoat-list">
1231                                          <li class="topcoat-list__item"><span class="dr-param">angle</span>
1232                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1233                                              <span class="dr-description">angle in degrees</span></li>
1234
1235                                      </ol>
1236                                  </div>
1237
1238
1239
1240
1241
1242
1243
1244
1245
1246
1247
1248
1249
1250                                  <p class="dr-returns">
1251                                      <strong class="dr-title">Returns:</strong>
1252
1253                                      <em class="dr-type-number">number</em>
1254
1255                                      <span class="dr-description">sin</span>
1256                                  </p>
1257
1258
1259
1260
1261                              </div>
1262                          </section>
1263                      </article>
1264
1265                      <article id="Snap.tan">
1266                          <header>
1267                              <h3 class="dr-method">Snap.tan(angle)<a href="#Snap.tan" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 319 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L319">&#x27ad;</a></h3>
1268                          </header>
1269                          <section>
1270                              <div class="extra" id="Snap.tan-extra"></div>
1271                              <div class="dr-method">
1272
1273
1274
1275
1276                                  <p>Equivalent to <code>Math.tan()</code> only works with degrees, not radians.
1277</p>
1278
1279
1280
1281
1282
1283
1284
1285
1286
1287
1288                                  <div class="topcoat-list__container">
1289                                      <h3 class="topcoat-list__header">Parameters</h3>
1290                                      <ol class="topcoat-list">
1291                                          <li class="topcoat-list__item"><span class="dr-param">angle</span>
1292                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1293                                              <span class="dr-description">angle in degrees</span></li>
1294
1295                                      </ol>
1296                                  </div>
1297
1298
1299
1300
1301
1302
1303
1304
1305
1306
1307
1308
1309
1310                                  <p class="dr-returns">
1311                                      <strong class="dr-title">Returns:</strong>
1312
1313                                      <em class="dr-type-number">number</em>
1314
1315                                      <span class="dr-description">tan</span>
1316                                  </p>
1317
1318
1319
1320
1321                              </div>
1322                          </section>
1323                      </article>
1324
1325                      <article id="Snap.cos">
1326                          <header>
1327                              <h3 class="dr-method">Snap.cos(angle)<a href="#Snap.cos" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 330 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L330">&#x27ad;</a></h3>
1328                          </header>
1329                          <section>
1330                              <div class="extra" id="Snap.cos-extra"></div>
1331                              <div class="dr-method">
1332
1333
1334
1335
1336                                  <p>Equivalent to <code>Math.cos()</code> only works with degrees, not radians.
1337</p>
1338
1339
1340
1341
1342
1343
1344
1345
1346
1347
1348                                  <div class="topcoat-list__container">
1349                                      <h3 class="topcoat-list__header">Parameters</h3>
1350                                      <ol class="topcoat-list">
1351                                          <li class="topcoat-list__item"><span class="dr-param">angle</span>
1352                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1353                                              <span class="dr-description">angle in degrees</span></li>
1354
1355                                      </ol>
1356                                  </div>
1357
1358
1359
1360
1361
1362
1363
1364
1365
1366
1367
1368
1369
1370                                  <p class="dr-returns">
1371                                      <strong class="dr-title">Returns:</strong>
1372
1373                                      <em class="dr-type-number">number</em>
1374
1375                                      <span class="dr-description">cos</span>
1376                                  </p>
1377
1378
1379
1380
1381                              </div>
1382                          </section>
1383                      </article>
1384
1385                      <article id="Snap.asin">
1386                          <header>
1387                              <h3 class="dr-method">Snap.asin(num)<a href="#Snap.asin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 341 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L341">&#x27ad;</a></h3>
1388                          </header>
1389                          <section>
1390                              <div class="extra" id="Snap.asin-extra"></div>
1391                              <div class="dr-method">
1392
1393
1394
1395
1396                                  <p>Equivalent to <code>Math.asin()</code> only works with degrees, not radians.
1397</p>
1398
1399
1400
1401
1402
1403
1404
1405
1406
1407
1408                                  <div class="topcoat-list__container">
1409                                      <h3 class="topcoat-list__header">Parameters</h3>
1410                                      <ol class="topcoat-list">
1411                                          <li class="topcoat-list__item"><span class="dr-param">num</span>
1412                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1413                                              <span class="dr-description">value</span></li>
1414
1415                                      </ol>
1416                                  </div>
1417
1418
1419
1420
1421
1422
1423
1424
1425
1426
1427
1428
1429
1430                                  <p class="dr-returns">
1431                                      <strong class="dr-title">Returns:</strong>
1432
1433                                      <em class="dr-type-number">number</em>
1434
1435                                      <span class="dr-description">asin in degrees</span>
1436                                  </p>
1437
1438
1439
1440
1441                              </div>
1442                          </section>
1443                      </article>
1444
1445                      <article id="Snap.acos">
1446                          <header>
1447                              <h3 class="dr-method">Snap.acos(num)<a href="#Snap.acos" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 352 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L352">&#x27ad;</a></h3>
1448                          </header>
1449                          <section>
1450                              <div class="extra" id="Snap.acos-extra"></div>
1451                              <div class="dr-method">
1452
1453
1454
1455
1456                                  <p>Equivalent to <code>Math.acos()</code> only works with degrees, not radians.
1457</p>
1458
1459
1460
1461
1462
1463
1464
1465
1466
1467
1468                                  <div class="topcoat-list__container">
1469                                      <h3 class="topcoat-list__header">Parameters</h3>
1470                                      <ol class="topcoat-list">
1471                                          <li class="topcoat-list__item"><span class="dr-param">num</span>
1472                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1473                                              <span class="dr-description">value</span></li>
1474
1475                                      </ol>
1476                                  </div>
1477
1478
1479
1480
1481
1482
1483
1484
1485
1486
1487
1488
1489
1490                                  <p class="dr-returns">
1491                                      <strong class="dr-title">Returns:</strong>
1492
1493                                      <em class="dr-type-number">number</em>
1494
1495                                      <span class="dr-description">acos in degrees</span>
1496                                  </p>
1497
1498
1499
1500
1501                              </div>
1502                          </section>
1503                      </article>
1504
1505                      <article id="Snap.atan">
1506                          <header>
1507                              <h3 class="dr-method">Snap.atan(num)<a href="#Snap.atan" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 363 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L363">&#x27ad;</a></h3>
1508                          </header>
1509                          <section>
1510                              <div class="extra" id="Snap.atan-extra"></div>
1511                              <div class="dr-method">
1512
1513
1514
1515
1516                                  <p>Equivalent to <code>Math.atan()</code> only works with degrees, not radians.
1517</p>
1518
1519
1520
1521
1522
1523
1524
1525
1526
1527
1528                                  <div class="topcoat-list__container">
1529                                      <h3 class="topcoat-list__header">Parameters</h3>
1530                                      <ol class="topcoat-list">
1531                                          <li class="topcoat-list__item"><span class="dr-param">num</span>
1532                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1533                                              <span class="dr-description">value</span></li>
1534
1535                                      </ol>
1536                                  </div>
1537
1538
1539
1540
1541
1542
1543
1544
1545
1546
1547
1548
1549
1550                                  <p class="dr-returns">
1551                                      <strong class="dr-title">Returns:</strong>
1552
1553                                      <em class="dr-type-number">number</em>
1554
1555                                      <span class="dr-description">atan in degrees</span>
1556                                  </p>
1557
1558
1559
1560
1561                              </div>
1562                          </section>
1563                      </article>
1564
1565                      <article id="Snap.atan2">
1566                          <header>
1567                              <h3 class="dr-method">Snap.atan2(num)<a href="#Snap.atan2" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 374 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L374">&#x27ad;</a></h3>
1568                          </header>
1569                          <section>
1570                              <div class="extra" id="Snap.atan2-extra"></div>
1571                              <div class="dr-method">
1572
1573
1574
1575
1576                                  <p>Equivalent to <code>Math.atan2()</code> only works with degrees, not radians.
1577</p>
1578
1579
1580
1581
1582
1583
1584
1585
1586
1587
1588                                  <div class="topcoat-list__container">
1589                                      <h3 class="topcoat-list__header">Parameters</h3>
1590                                      <ol class="topcoat-list">
1591                                          <li class="topcoat-list__item"><span class="dr-param">num</span>
1592                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1593                                              <span class="dr-description">value</span></li>
1594
1595                                      </ol>
1596                                  </div>
1597
1598
1599
1600
1601
1602
1603
1604
1605
1606
1607
1608
1609
1610                                  <p class="dr-returns">
1611                                      <strong class="dr-title">Returns:</strong>
1612
1613                                      <em class="dr-type-number">number</em>
1614
1615                                      <span class="dr-description">atan2 in degrees</span>
1616                                  </p>
1617
1618
1619
1620
1621                              </div>
1622                          </section>
1623                      </article>
1624
1625                      <article id="Snap.angle">
1626                          <header>
1627                              <h3 class="dr-method">Snap.angle(x1, y1, x2, y2, [x3], [y3])<a href="#Snap.angle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 391 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L391">&#x27ad;</a></h3>
1628                          </header>
1629                          <section>
1630                              <div class="extra" id="Snap.angle-extra"></div>
1631                              <div class="dr-method">
1632
1633
1634
1635
1636                                  <p>Returns an angle between two or three points
1637</p>
1638
1639
1640
1641
1642
1643
1644
1645
1646
1647
1648
1649
1650                                  <h3>Parameters</h3>
1651
1652
1653
1654
1655
1656
1657
1658
1659                                  <div class="topcoat-list__container">
1660                                      <h3 class="topcoat-list__header">Parameters</h3>
1661                                      <ol class="topcoat-list">
1662                                          <li class="topcoat-list__item"><span class="dr-param">x1</span>
1663                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1664                                              <span class="dr-description">x coord of first point</span></li>
1665                                          <li class="topcoat-list__item"><span class="dr-param">y1</span>
1666                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1667                                              <span class="dr-description">y coord of first point</span></li>
1668                                          <li class="topcoat-list__item"><span class="dr-param">x2</span>
1669                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1670                                              <span class="dr-description">x coord of second point</span></li>
1671                                          <li class="topcoat-list__item"><span class="dr-param">y2</span>
1672                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1673                                              <span class="dr-description">y coord of second point</span></li>
1674                                          <li class="topcoat-list__item"><span class="dr-param">x3</span>
1675                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1676                                              <span class="dr-description">x coord of third point</span></li>
1677                                          <li class="topcoat-list__item"><span class="dr-param">y3</span>
1678                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1679                                              <span class="dr-description">y coord of third point</span></li>
1680
1681                                      </ol>
1682                                  </div>
1683
1684
1685
1686
1687
1688
1689
1690
1691
1692
1693
1694
1695
1696                                  <p class="dr-returns">
1697                                      <strong class="dr-title">Returns:</strong>
1698
1699                                      <em class="dr-type-number">number</em>
1700
1701                                      <span class="dr-description">angle in degrees</span>
1702                                  </p>
1703
1704
1705
1706
1707                              </div>
1708                          </section>
1709                      </article>
1710
1711                      <article id="Snap.len">
1712                          <header>
1713                              <h3 class="dr-method">Snap.len(x1, y1, x2, y2)<a href="#Snap.len" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 404 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L404">&#x27ad;</a></h3>
1714                          </header>
1715                          <section>
1716                              <div class="extra" id="Snap.len-extra"></div>
1717                              <div class="dr-method">
1718
1719
1720
1721
1722                                  <p>Returns distance between two points
1723</p>
1724
1725
1726
1727
1728
1729
1730
1731
1732
1733
1734
1735
1736                                  <h3>Parameters</h3>
1737
1738
1739
1740
1741
1742
1743
1744
1745                                  <div class="topcoat-list__container">
1746                                      <h3 class="topcoat-list__header">Parameters</h3>
1747                                      <ol class="topcoat-list">
1748                                          <li class="topcoat-list__item"><span class="dr-param">x1</span>
1749                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1750                                              <span class="dr-description">x coord of first point</span></li>
1751                                          <li class="topcoat-list__item"><span class="dr-param">y1</span>
1752                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1753                                              <span class="dr-description">y coord of first point</span></li>
1754                                          <li class="topcoat-list__item"><span class="dr-param">x2</span>
1755                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1756                                              <span class="dr-description">x coord of second point</span></li>
1757                                          <li class="topcoat-list__item"><span class="dr-param">y2</span>
1758                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1759                                              <span class="dr-description">y coord of second point</span></li>
1760
1761                                      </ol>
1762                                  </div>
1763
1764
1765
1766
1767
1768
1769
1770
1771
1772
1773
1774
1775
1776                                  <p class="dr-returns">
1777                                      <strong class="dr-title">Returns:</strong>
1778
1779                                      <em class="dr-type-number">number</em>
1780
1781                                      <span class="dr-description">distance</span>
1782                                  </p>
1783
1784
1785
1786
1787                              </div>
1788                          </section>
1789                      </article>
1790
1791                      <article id="Snap.len2">
1792                          <header>
1793                              <h3 class="dr-method">Snap.len2(x1, y1, x2, y2)<a href="#Snap.len2" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 419 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L419">&#x27ad;</a></h3>
1794                          </header>
1795                          <section>
1796                              <div class="extra" id="Snap.len2-extra"></div>
1797                              <div class="dr-method">
1798
1799
1800
1801
1802                                  <p>Returns squared distance between two points
1803</p>
1804
1805
1806
1807
1808
1809
1810
1811
1812
1813
1814
1815
1816                                  <h3>Parameters</h3>
1817
1818
1819
1820
1821
1822
1823
1824
1825                                  <div class="topcoat-list__container">
1826                                      <h3 class="topcoat-list__header">Parameters</h3>
1827                                      <ol class="topcoat-list">
1828                                          <li class="topcoat-list__item"><span class="dr-param">x1</span>
1829                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1830                                              <span class="dr-description">x coord of first point</span></li>
1831                                          <li class="topcoat-list__item"><span class="dr-param">y1</span>
1832                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1833                                              <span class="dr-description">y coord of first point</span></li>
1834                                          <li class="topcoat-list__item"><span class="dr-param">x2</span>
1835                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1836                                              <span class="dr-description">x coord of second point</span></li>
1837                                          <li class="topcoat-list__item"><span class="dr-param">y2</span>
1838                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1839                                              <span class="dr-description">y coord of second point</span></li>
1840
1841                                      </ol>
1842                                  </div>
1843
1844
1845
1846
1847
1848
1849
1850
1851
1852
1853
1854
1855
1856                                  <p class="dr-returns">
1857                                      <strong class="dr-title">Returns:</strong>
1858
1859                                      <em class="dr-type-number">number</em>
1860
1861                                      <span class="dr-description">distance</span>
1862                                  </p>
1863
1864
1865
1866
1867                              </div>
1868                          </section>
1869                      </article>
1870
1871                      <article id="Snap.closestPoint">
1872                          <header>
1873                              <h3 class="dr-method">Snap.closestPoint(path, x, y)<a href="#Snap.closestPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 439 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L439">&#x27ad;</a></h3>
1874                          </header>
1875                          <section>
1876                              <div class="extra" id="Snap.closestPoint-extra"></div>
1877                              <div class="dr-method">
1878
1879
1880
1881
1882                                  <p>Returns closest point to a given one on a given path.
1883</p>
1884
1885
1886
1887
1888
1889
1890
1891
1892
1893
1894
1895
1896                                  <h3>Parameters</h3>
1897
1898
1899
1900
1901
1902
1903
1904
1905                                  <div class="topcoat-list__container">
1906                                      <h3 class="topcoat-list__header">Parameters</h3>
1907                                      <ol class="topcoat-list">
1908                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
1909                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
1910                                              <span class="dr-description">path element</span></li>
1911                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
1912                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1913                                              <span class="dr-description">x coord of a point</span></li>
1914                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
1915                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
1916                                              <span class="dr-description">y coord of a point</span></li>
1917
1918                                      </ol>
1919                                  </div>
1920
1921
1922
1923
1924
1925
1926
1927
1928
1929
1930
1931
1932
1933                                  <p class="dr-returns">
1934                                      <strong class="dr-title">Returns:</strong>
1935
1936                                      <em class="dr-type-object">object</em>
1937
1938                                      <span class="dr-description">in format</span>
1939                                  </p>
1940
1941
1942
1943
1944                              </div>
1945                          </section>
1946                      </article>
1947
1948                      <article id="Snap.is">
1949                          <header>
1950                              <h3 class="dr-method">Snap.is(o, type)<a href="#Snap.is" 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/Snap.svg/blob/master/src/svg.js#L495">&#x27ad;</a></h3>
1951                          </header>
1952                          <section>
1953                              <div class="extra" id="Snap.is-extra"></div>
1954                              <div class="dr-method">
1955
1956
1957
1958
1959                                  <p>Handy replacement for the <code>typeof</code> operator
1960</p>
1961
1962
1963
1964
1965
1966
1967
1968
1969
1970
1971                                  <div class="topcoat-list__container">
1972                                      <h3 class="topcoat-list__header">Parameters</h3>
1973                                      <ol class="topcoat-list">
1974                                          <li class="topcoat-list__item"><span class="dr-param">o</span>
1975                                              <span class="dr-type"><em class="dr-type-…">…</em> </span>
1976                                              <span class="dr-description">any object or primitive</span></li>
1977                                          <li class="topcoat-list__item"><span class="dr-param">type</span>
1978                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
1979                                              <span class="dr-description">name of the type, e.g., <code>string</code>, <code>function</code>, <code>number</code>, etc.</span></li>
1980
1981                                      </ol>
1982                                  </div>
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996                                  <p class="dr-returns">
1997                                      <strong class="dr-title">Returns:</strong>
1998
1999                                      <em class="dr-type-boolean">boolean</em>
2000
2001                                      <span class="dr-description"><code>true</code> if given value is of given type</span>
2002                                  </p>
2003
2004
2005
2006
2007                              </div>
2008                          </section>
2009                      </article>
2010
2011                      <article id="Snap.snapTo">
2012                          <header>
2013                              <h3 class="dr-method">Snap.snapTo(values, value, [tolerance])<a href="#Snap.snapTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 506 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L506">&#x27ad;</a></h3>
2014                          </header>
2015                          <section>
2016                              <div class="extra" id="Snap.snapTo-extra"></div>
2017                              <div class="dr-method">
2018
2019
2020
2021
2022                                  <p>Snaps given value to given grid
2023</p>
2024
2025
2026
2027
2028
2029
2030
2031
2032
2033
2034                                  <div class="topcoat-list__container">
2035                                      <h3 class="topcoat-list__header">Parameters</h3>
2036                                      <ol class="topcoat-list">
2037                                          <li class="topcoat-list__item"><span class="dr-param">values</span>
2038                                              <span class="dr-type"><em class="dr-type-array">array</em> <em class="dr-type-number">number</em> </span>
2039                                              <span class="dr-description">given array of values or step of the grid</span></li>
2040                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
2041                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2042                                              <span class="dr-description">value to adjust</span></li>
2043                                          <li class="topcoat-list__item"><span class="dr-param">tolerance</span>
2044                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2045                                              <span class="dr-description">maximum distance to the target value that would trigger the snap. Default is <code>10</code>.</span></li>
2046
2047                                      </ol>
2048                                  </div>
2049
2050
2051
2052
2053
2054
2055
2056
2057
2058
2059
2060
2061
2062                                  <p class="dr-returns">
2063                                      <strong class="dr-title">Returns:</strong>
2064
2065                                      <em class="dr-type-number">number</em>
2066
2067                                      <span class="dr-description">adjusted value</span>
2068                                  </p>
2069
2070
2071
2072
2073                              </div>
2074                          </section>
2075                      </article>
2076
2077                      <article id="Snap.getRGB">
2078                          <header>
2079                              <h3 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 559 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L559">&#x27ad;</a></h3>
2080                          </header>
2081                          <section>
2082                              <div class="extra" id="Snap.getRGB-extra"></div>
2083                              <div class="dr-method">
2084
2085
2086
2087
2088                                  <p>Parses color string as RGB object
2089</p>
2090
2091
2092
2093
2094
2095
2096
2097
2098
2099
2100                                  <div class="topcoat-list__container">
2101                                      <h3 class="topcoat-list__header">Parameters</h3>
2102                                      <ol class="topcoat-list">
2103                                          <li class="topcoat-list__item"><span class="dr-param">color</span>
2104                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
2105                                              <span class="dr-description">color string in one of the following formats:</span></li>
2106
2107                                      </ol>
2108                                  </div>
2109
2110
2111
2112
2113
2114
2115
2116
2117
2118
2119                                  <ul>
2120
2121
2122
2123
2124
2125
2126
2127
2128
2129
2130
2131                                      <li>Color name (<code>red</code>, <code>green</code>, <code>cornflowerblue</code>, etc)</li>
2132
2133
2134
2135
2136
2137
2138
2139
2140
2141
2142
2143                                      <li>#••• — shortened HTML color: (<code>#000</code>, <code>#fc0</code>, etc.)</li>
2144
2145
2146
2147
2148
2149
2150
2151
2152
2153
2154
2155                                      <li>#•••••• — full length HTML color: (<code>#000000</code>, <code>#bd2300</code>)</li>
2156
2157
2158
2159
2160
2161
2162
2163
2164
2165
2166
2167                                      <li>rgb(•••, •••, •••) — red, green and blue channels values: (<code>rgb(200,&nbsp;100,&nbsp;0)</code>)</li>
2168
2169
2170
2171
2172
2173
2174
2175
2176
2177
2178
2179                                      <li>rgba(•••, •••, •••, •••) — also with opacity</li>
2180
2181
2182
2183
2184
2185
2186
2187
2188
2189
2190
2191                                      <li>rgb(•••%, •••%, •••%) — same as above, but in %: (<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>)</li>
2192
2193
2194
2195
2196
2197
2198
2199
2200
2201
2202
2203                                      <li>rgba(•••%, •••%, •••%, •••%) — also with opacity</li>
2204
2205
2206
2207
2208
2209
2210
2211
2212
2213
2214
2215                                      <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>)</li>
2216
2217
2218
2219
2220
2221
2222
2223
2224
2225
2226
2227                                      <li>hsba(•••, •••, •••, •••) — also with opacity</li>
2228
2229
2230
2231
2232
2233
2234
2235
2236
2237
2238
2239                                      <li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
2240
2241
2242
2243
2244
2245
2246
2247
2248
2249
2250
2251                                      <li>hsba(•••%, •••%, •••%, •••%) — also with opacity</li>
2252
2253
2254
2255
2256
2257
2258
2259
2260
2261
2262
2263                                      <li>hsl(•••, •••, •••) — hue, saturation and luminosity values: (<code>hsb(0.5,&nbsp;0.25,&nbsp;0.5)</code>)</li>
2264
2265
2266
2267
2268
2269
2270
2271
2272
2273
2274
2275                                      <li>hsla(•••, •••, •••, •••) — also with opacity</li>
2276
2277
2278
2279
2280
2281
2282
2283
2284
2285
2286
2287                                      <li>hsl(•••%, •••%, •••%) — same as above, but in %</li>
2288
2289
2290
2291
2292
2293
2294
2295
2296
2297
2298
2299                                      <li>hsla(•••%, •••%, •••%, •••%) — also with opacity</li>
2300
2301
2302
2303
2304
2305
2306
2307
2308
2309
2310
2311                                  </ul>
2312
2313
2314
2315
2316
2317
2318
2319
2320
2321                                  <p>Note that <code>%</code> can be used any time: <code>rgb(20%, 255, 50%)</code>.
2322</p>
2323
2324
2325
2326
2327
2328
2329
2330
2331
2332
2333
2334
2335
2336
2337                                  <p class="dr-returns">
2338                                      <strong class="dr-title">Returns:</strong>
2339
2340                                      <em class="dr-type-object">object</em>
2341
2342                                      <span class="dr-description">RGB object in the following format:</span>
2343                                  </p>
2344
2345
2346
2347
2348
2349
2350
2351
2352
2353
2354
2355                                  <ol class="dr-json">
2356
2357
2358                                      <li>{<ol class="dr-json">
2359
2360
2361
2362                                      <li>
2363                                          <span class="dr-json-key">r</span>
2364                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2365                                          <span class="dr-json-description">red,</span>
2366                                      </li>
2367
2368
2369
2370                                      <li>
2371                                          <span class="dr-json-key">g</span>
2372                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2373                                          <span class="dr-json-description">green,</span>
2374                                      </li>
2375
2376
2377
2378                                      <li>
2379                                          <span class="dr-json-key">b</span>
2380                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2381                                          <span class="dr-json-description">blue,</span>
2382                                      </li>
2383
2384
2385
2386                                      <li>
2387                                          <span class="dr-json-key">hex</span>
2388                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
2389                                          <span class="dr-json-description">color in HTML/CSS format: #••••••,</span>
2390                                      </li>
2391
2392
2393
2394                                      <li>
2395                                          <span class="dr-json-key">error</span>
2396                                          <span class="dr-type"><em class="dr-type-boolean">boolean</em> </span>
2397                                          <span class="dr-json-description">true if string can&#39;t be parsed</span>
2398                                      </li>
2399
2400
2401
2402                                      </ol></li><li>}</li>
2403
2404
2405                                  </ol>
2406
2407
2408                              </div>
2409                          </section>
2410                      </article>
2411
2412                      <article id="Snap.hsb">
2413                          <header>
2414                              <h3 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 647 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L647">&#x27ad;</a></h3>
2415                          </header>
2416                          <section>
2417                              <div class="extra" id="Snap.hsb-extra"></div>
2418                              <div class="dr-method">
2419
2420
2421
2422
2423                                  <p>Converts HSB values to a hex representation of the color
2424</p>
2425
2426
2427
2428
2429
2430
2431
2432
2433
2434
2435                                  <div class="topcoat-list__container">
2436                                      <h3 class="topcoat-list__header">Parameters</h3>
2437                                      <ol class="topcoat-list">
2438                                          <li class="topcoat-list__item"><span class="dr-param">h</span>
2439                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2440                                              <span class="dr-description">hue</span></li>
2441                                          <li class="topcoat-list__item"><span class="dr-param">s</span>
2442                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2443                                              <span class="dr-description">saturation</span></li>
2444                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
2445                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2446                                              <span class="dr-description">value or brightness</span></li>
2447
2448                                      </ol>
2449                                  </div>
2450
2451
2452
2453
2454
2455
2456
2457
2458
2459
2460
2461
2462
2463                                  <p class="dr-returns">
2464                                      <strong class="dr-title">Returns:</strong>
2465
2466                                      <em class="dr-type-string">string</em>
2467
2468                                      <span class="dr-description">hex representation of the color</span>
2469                                  </p>
2470
2471
2472
2473
2474                              </div>
2475                          </section>
2476                      </article>
2477
2478                      <article id="Snap.hsl">
2479                          <header>
2480                              <h3 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 660 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L660">&#x27ad;</a></h3>
2481                          </header>
2482                          <section>
2483                              <div class="extra" id="Snap.hsl-extra"></div>
2484                              <div class="dr-method">
2485
2486
2487
2488
2489                                  <p>Converts HSL values to a hex representation of the color
2490</p>
2491
2492
2493
2494
2495
2496
2497
2498
2499
2500
2501                                  <div class="topcoat-list__container">
2502                                      <h3 class="topcoat-list__header">Parameters</h3>
2503                                      <ol class="topcoat-list">
2504                                          <li class="topcoat-list__item"><span class="dr-param">h</span>
2505                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2506                                              <span class="dr-description">hue</span></li>
2507                                          <li class="topcoat-list__item"><span class="dr-param">s</span>
2508                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2509                                              <span class="dr-description">saturation</span></li>
2510                                          <li class="topcoat-list__item"><span class="dr-param">l</span>
2511                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2512                                              <span class="dr-description">luminosity</span></li>
2513
2514                                      </ol>
2515                                  </div>
2516
2517
2518
2519
2520
2521
2522
2523
2524
2525
2526
2527
2528
2529                                  <p class="dr-returns">
2530                                      <strong class="dr-title">Returns:</strong>
2531
2532                                      <em class="dr-type-string">string</em>
2533
2534                                      <span class="dr-description">hex representation of the color</span>
2535                                  </p>
2536
2537
2538
2539
2540                              </div>
2541                          </section>
2542                      </article>
2543
2544                      <article id="Snap.rgb">
2545                          <header>
2546                              <h3 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 673 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L673">&#x27ad;</a></h3>
2547                          </header>
2548                          <section>
2549                              <div class="extra" id="Snap.rgb-extra"></div>
2550                              <div class="dr-method">
2551
2552
2553
2554
2555                                  <p>Converts RGB values to a hex representation of the color
2556</p>
2557
2558
2559
2560
2561
2562
2563
2564
2565
2566
2567                                  <div class="topcoat-list__container">
2568                                      <h3 class="topcoat-list__header">Parameters</h3>
2569                                      <ol class="topcoat-list">
2570                                          <li class="topcoat-list__item"><span class="dr-param">r</span>
2571                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2572                                              <span class="dr-description">red</span></li>
2573                                          <li class="topcoat-list__item"><span class="dr-param">g</span>
2574                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2575                                              <span class="dr-description">green</span></li>
2576                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
2577                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2578                                              <span class="dr-description">blue</span></li>
2579
2580                                      </ol>
2581                                  </div>
2582
2583
2584
2585
2586
2587
2588
2589
2590
2591
2592
2593
2594
2595                                  <p class="dr-returns">
2596                                      <strong class="dr-title">Returns:</strong>
2597
2598                                      <em class="dr-type-string">string</em>
2599
2600                                      <span class="dr-description">hex representation of the color</span>
2601                                  </p>
2602
2603
2604
2605
2606                              </div>
2607                          </section>
2608                      </article>
2609
2610                      <article id="Snap.color">
2611                          <header>
2612                              <h3 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 759 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L759">&#x27ad;</a></h3>
2613                          </header>
2614                          <section>
2615                              <div class="extra" id="Snap.color-extra"></div>
2616                              <div class="dr-method">
2617
2618
2619
2620
2621                                  <p>Parses the color string and returns an object featuring the color&#39;s component values
2622</p>
2623
2624
2625
2626
2627
2628
2629
2630
2631
2632
2633                                  <div class="topcoat-list__container">
2634                                      <h3 class="topcoat-list__header">Parameters</h3>
2635                                      <ol class="topcoat-list">
2636                                          <li class="topcoat-list__item"><span class="dr-param">clr</span>
2637                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
2638                                              <span class="dr-description">color string in one of the supported formats (see <a href="#Snap.getRGB" class="dr-link">Snap.getRGB</a>)</span></li>
2639
2640                                      </ol>
2641                                  </div>
2642
2643
2644
2645
2646
2647
2648
2649
2650
2651
2652
2653
2654
2655                                  <p class="dr-returns">
2656                                      <strong class="dr-title">Returns:</strong>
2657
2658                                      <em class="dr-type-object">object</em>
2659
2660                                      <span class="dr-description">Combined RGB/HSB object in the following format:</span>
2661                                  </p>
2662
2663
2664
2665
2666
2667
2668
2669
2670
2671
2672
2673                                  <ol class="dr-json">
2674
2675
2676                                      <li>{<ol class="dr-json">
2677
2678
2679
2680                                      <li>
2681                                          <span class="dr-json-key">r</span>
2682                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2683                                          <span class="dr-json-description">red,</span>
2684                                      </li>
2685
2686
2687
2688                                      <li>
2689                                          <span class="dr-json-key">g</span>
2690                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2691                                          <span class="dr-json-description">green,</span>
2692                                      </li>
2693
2694
2695
2696                                      <li>
2697                                          <span class="dr-json-key">b</span>
2698                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2699                                          <span class="dr-json-description">blue,</span>
2700                                      </li>
2701
2702
2703
2704                                      <li>
2705                                          <span class="dr-json-key">hex</span>
2706                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
2707                                          <span class="dr-json-description">color in HTML/CSS format: #••••••,</span>
2708                                      </li>
2709
2710
2711
2712                                      <li>
2713                                          <span class="dr-json-key">error</span>
2714                                          <span class="dr-type"><em class="dr-type-boolean">boolean</em> </span>
2715                                          <span class="dr-json-description"><code>true</code> if string can&#39;t be parsed,</span>
2716                                      </li>
2717
2718
2719
2720                                      <li>
2721                                          <span class="dr-json-key">h</span>
2722                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2723                                          <span class="dr-json-description">hue,</span>
2724                                      </li>
2725
2726
2727
2728                                      <li>
2729                                          <span class="dr-json-key">s</span>
2730                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2731                                          <span class="dr-json-description">saturation,</span>
2732                                      </li>
2733
2734
2735
2736                                      <li>
2737                                          <span class="dr-json-key">v</span>
2738                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2739                                          <span class="dr-json-description">value (brightness),</span>
2740                                      </li>
2741
2742
2743
2744                                      <li>
2745                                          <span class="dr-json-key">l</span>
2746                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2747                                          <span class="dr-json-description">lightness</span>
2748                                      </li>
2749
2750
2751
2752                                      </ol></li><li>}</li>
2753
2754
2755                                  </ol>
2756
2757
2758                              </div>
2759                          </section>
2760                      </article>
2761
2762                      <article id="Snap.hsb2rgb">
2763                          <header>
2764                              <h3 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 811 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L811">&#x27ad;</a></h3>
2765                          </header>
2766                          <section>
2767                              <div class="extra" id="Snap.hsb2rgb-extra"></div>
2768                              <div class="dr-method">
2769
2770
2771
2772
2773                                  <p>Converts HSB values to an RGB object
2774</p>
2775
2776
2777
2778
2779
2780
2781
2782
2783
2784
2785                                  <div class="topcoat-list__container">
2786                                      <h3 class="topcoat-list__header">Parameters</h3>
2787                                      <ol class="topcoat-list">
2788                                          <li class="topcoat-list__item"><span class="dr-param">h</span>
2789                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2790                                              <span class="dr-description">hue</span></li>
2791                                          <li class="topcoat-list__item"><span class="dr-param">s</span>
2792                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2793                                              <span class="dr-description">saturation</span></li>
2794                                          <li class="topcoat-list__item"><span class="dr-param">v</span>
2795                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2796                                              <span class="dr-description">value or brightness</span></li>
2797
2798                                      </ol>
2799                                  </div>
2800
2801
2802
2803
2804
2805
2806
2807
2808
2809
2810
2811
2812
2813                                  <p class="dr-returns">
2814                                      <strong class="dr-title">Returns:</strong>
2815
2816                                      <em class="dr-type-object">object</em>
2817
2818                                      <span class="dr-description">RGB object in the following format:</span>
2819                                  </p>
2820
2821
2822
2823
2824
2825
2826
2827
2828
2829
2830
2831                                  <ol class="dr-json">
2832
2833
2834                                      <li>{<ol class="dr-json">
2835
2836
2837
2838                                      <li>
2839                                          <span class="dr-json-key">r</span>
2840                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2841                                          <span class="dr-json-description">red,</span>
2842                                      </li>
2843
2844
2845
2846                                      <li>
2847                                          <span class="dr-json-key">g</span>
2848                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2849                                          <span class="dr-json-description">green,</span>
2850                                      </li>
2851
2852
2853
2854                                      <li>
2855                                          <span class="dr-json-key">b</span>
2856                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2857                                          <span class="dr-json-description">blue,</span>
2858                                      </li>
2859
2860
2861
2862                                      <li>
2863                                          <span class="dr-json-key">hex</span>
2864                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
2865                                          <span class="dr-json-description">color in HTML/CSS format: #••••••</span>
2866                                      </li>
2867
2868
2869
2870                                      </ol></li><li>}</li>
2871
2872
2873                                  </ol>
2874
2875
2876                              </div>
2877                          </section>
2878                      </article>
2879
2880                      <article id="Snap.hsl2rgb">
2881                          <header>
2882                              <h3 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 847 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L847">&#x27ad;</a></h3>
2883                          </header>
2884                          <section>
2885                              <div class="extra" id="Snap.hsl2rgb-extra"></div>
2886                              <div class="dr-method">
2887
2888
2889
2890
2891                                  <p>Converts HSL values to an RGB object
2892</p>
2893
2894
2895
2896
2897
2898
2899
2900
2901
2902
2903                                  <div class="topcoat-list__container">
2904                                      <h3 class="topcoat-list__header">Parameters</h3>
2905                                      <ol class="topcoat-list">
2906                                          <li class="topcoat-list__item"><span class="dr-param">h</span>
2907                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2908                                              <span class="dr-description">hue</span></li>
2909                                          <li class="topcoat-list__item"><span class="dr-param">s</span>
2910                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2911                                              <span class="dr-description">saturation</span></li>
2912                                          <li class="topcoat-list__item"><span class="dr-param">l</span>
2913                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
2914                                              <span class="dr-description">luminosity</span></li>
2915
2916                                      </ol>
2917                                  </div>
2918
2919
2920
2921
2922
2923
2924
2925
2926
2927
2928
2929
2930
2931                                  <p class="dr-returns">
2932                                      <strong class="dr-title">Returns:</strong>
2933
2934                                      <em class="dr-type-object">object</em>
2935
2936                                      <span class="dr-description">RGB object in the following format:</span>
2937                                  </p>
2938
2939
2940
2941
2942
2943
2944
2945
2946
2947
2948
2949                                  <ol class="dr-json">
2950
2951
2952                                      <li>{<ol class="dr-json">
2953
2954
2955
2956                                      <li>
2957                                          <span class="dr-json-key">r</span>
2958                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2959                                          <span class="dr-json-description">red,</span>
2960                                      </li>
2961
2962
2963
2964                                      <li>
2965                                          <span class="dr-json-key">g</span>
2966                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2967                                          <span class="dr-json-description">green,</span>
2968                                      </li>
2969
2970
2971
2972                                      <li>
2973                                          <span class="dr-json-key">b</span>
2974                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
2975                                          <span class="dr-json-description">blue,</span>
2976                                      </li>
2977
2978
2979
2980                                      <li>
2981                                          <span class="dr-json-key">hex</span>
2982                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
2983                                          <span class="dr-json-description">color in HTML/CSS format: #••••••</span>
2984                                      </li>
2985
2986
2987
2988                                      </ol></li><li>}</li>
2989
2990
2991                                  </ol>
2992
2993
2994                              </div>
2995                          </section>
2996                      </article>
2997
2998                      <article id="Snap.rgb2hsb">
2999                          <header>
3000                              <h3 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 886 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L886">&#x27ad;</a></h3>
3001                          </header>
3002                          <section>
3003                              <div class="extra" id="Snap.rgb2hsb-extra"></div>
3004                              <div class="dr-method">
3005
3006
3007
3008
3009                                  <p>Converts RGB values to an HSB object
3010</p>
3011
3012
3013
3014
3015
3016
3017
3018
3019
3020
3021                                  <div class="topcoat-list__container">
3022                                      <h3 class="topcoat-list__header">Parameters</h3>
3023                                      <ol class="topcoat-list">
3024                                          <li class="topcoat-list__item"><span class="dr-param">r</span>
3025                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
3026                                              <span class="dr-description">red</span></li>
3027                                          <li class="topcoat-list__item"><span class="dr-param">g</span>
3028                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
3029                                              <span class="dr-description">green</span></li>
3030                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
3031                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
3032                                              <span class="dr-description">blue</span></li>
3033
3034                                      </ol>
3035                                  </div>
3036
3037
3038
3039
3040
3041
3042
3043
3044
3045
3046
3047
3048
3049                                  <p class="dr-returns">
3050                                      <strong class="dr-title">Returns:</strong>
3051
3052                                      <em class="dr-type-object">object</em>
3053
3054                                      <span class="dr-description">HSB object in the following format:</span>
3055                                  </p>
3056
3057
3058
3059
3060
3061
3062
3063
3064
3065
3066
3067                                  <ol class="dr-json">
3068
3069
3070                                      <li>{<ol class="dr-json">
3071
3072
3073
3074                                      <li>
3075                                          <span class="dr-json-key">h</span>
3076                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
3077                                          <span class="dr-json-description">hue,</span>
3078                                      </li>
3079
3080
3081
3082                                      <li>
3083                                          <span class="dr-json-key">s</span>
3084                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
3085                                          <span class="dr-json-description">saturation,</span>
3086                                      </li>
3087
3088
3089
3090                                      <li>
3091                                          <span class="dr-json-key">b</span>
3092                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
3093                                          <span class="dr-json-description">brightness</span>
3094                                      </li>
3095
3096
3097
3098                                      </ol></li><li>}</li>
3099
3100
3101                                  </ol>
3102
3103
3104                              </div>
3105                          </section>
3106                      </article>
3107
3108                      <article id="Snap.rgb2hsl">
3109                          <header>
3110                              <h3 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 919 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L919">&#x27ad;</a></h3>
3111                          </header>
3112                          <section>
3113                              <div class="extra" id="Snap.rgb2hsl-extra"></div>
3114                              <div class="dr-method">
3115
3116
3117
3118
3119                                  <p>Converts RGB values to an HSL object
3120</p>
3121
3122
3123
3124
3125
3126
3127
3128
3129
3130
3131                                  <div class="topcoat-list__container">
3132                                      <h3 class="topcoat-list__header">Parameters</h3>
3133                                      <ol class="topcoat-list">
3134                                          <li class="topcoat-list__item"><span class="dr-param">r</span>
3135                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
3136                                              <span class="dr-description">red</span></li>
3137                                          <li class="topcoat-list__item"><span class="dr-param">g</span>
3138                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
3139                                              <span class="dr-description">green</span></li>
3140                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
3141                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
3142                                              <span class="dr-description">blue</span></li>
3143
3144                                      </ol>
3145                                  </div>
3146
3147
3148
3149
3150
3151
3152
3153
3154
3155
3156
3157
3158
3159                                  <p class="dr-returns">
3160                                      <strong class="dr-title">Returns:</strong>
3161
3162                                      <em class="dr-type-object">object</em>
3163
3164                                      <span class="dr-description">HSL object in the following format:</span>
3165                                  </p>
3166
3167
3168
3169
3170
3171
3172
3173
3174
3175
3176
3177                                  <ol class="dr-json">
3178
3179
3180                                      <li>{<ol class="dr-json">
3181
3182
3183
3184                                      <li>
3185                                          <span class="dr-json-key">h</span>
3186                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
3187                                          <span class="dr-json-description">hue,</span>
3188                                      </li>
3189
3190
3191
3192                                      <li>
3193                                          <span class="dr-json-key">s</span>
3194                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
3195                                          <span class="dr-json-description">saturation,</span>
3196                                      </li>
3197
3198
3199
3200                                      <li>
3201                                          <span class="dr-json-key">l</span>
3202                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
3203                                          <span class="dr-json-description">luminosity</span>
3204                                      </li>
3205
3206
3207
3208                                      </ol></li><li>}</li>
3209
3210
3211                                  </ol>
3212
3213
3214                              </div>
3215                          </section>
3216                      </article>
3217
3218                      <article id="Snap.parsePathString">
3219                          <header>
3220                              <h3 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 952 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L952">&#x27ad;</a></h3>
3221                          </header>
3222                          <section>
3223                              <div class="extra" id="Snap.parsePathString-extra"></div>
3224                              <div class="dr-method">
3225
3226
3227
3228
3229                                  <p>Utility method
3230Parses given path string into an array of arrays of path segments
3231</p>
3232
3233
3234
3235
3236
3237
3238
3239
3240
3241
3242                                  <div class="topcoat-list__container">
3243                                      <h3 class="topcoat-list__header">Parameters</h3>
3244                                      <ol class="topcoat-list">
3245                                          <li class="topcoat-list__item"><span class="dr-param">pathString</span>
3246                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-array">array</em> </span>
3247                                              <span class="dr-description">path string or array of segments (in the last case it is returned straight away)</span></li>
3248
3249                                      </ol>
3250                                  </div>
3251
3252
3253
3254
3255
3256
3257
3258
3259
3260
3261
3262
3263
3264                                  <p class="dr-returns">
3265                                      <strong class="dr-title">Returns:</strong>
3266
3267                                      <em class="dr-type-array">array</em>
3268
3269                                      <span class="dr-description">array of segments</span>
3270                                  </p>
3271
3272
3273
3274
3275                              </div>
3276                          </section>
3277                      </article>
3278
3279                      <article id="Snap.parseTransformString">
3280                          <header>
3281                              <h3 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 1005 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1005">&#x27ad;</a></h3>
3282                          </header>
3283                          <section>
3284                              <div class="extra" id="Snap.parseTransformString-extra"></div>
3285                              <div class="dr-method">
3286
3287
3288
3289
3290                                  <p>Utility method
3291Parses given transform string into an array of transformations
3292</p>
3293
3294
3295
3296
3297
3298
3299
3300
3301
3302
3303                                  <div class="topcoat-list__container">
3304                                      <h3 class="topcoat-list__header">Parameters</h3>
3305                                      <ol class="topcoat-list">
3306                                          <li class="topcoat-list__item"><span class="dr-param">TString</span>
3307                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-array">array</em> </span>
3308                                              <span class="dr-description">transform string or array of transformations (in the last case it is returned straight away)</span></li>
3309
3310                                      </ol>
3311                                  </div>
3312
3313
3314
3315
3316
3317
3318
3319
3320
3321
3322
3323
3324
3325                                  <p class="dr-returns">
3326                                      <strong class="dr-title">Returns:</strong>
3327
3328                                      <em class="dr-type-array">array</em>
3329
3330                                      <span class="dr-description">array of transformations</span>
3331                                  </p>
3332
3333
3334
3335
3336                              </div>
3337                          </section>
3338                      </article>
3339
3340                      <article id="Snap.select">
3341                          <header>
3342                              <h3 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 1265 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1265">&#x27ad;</a></h3>
3343                          </header>
3344                          <section>
3345                              <div class="extra" id="Snap.select-extra"></div>
3346                              <div class="dr-method">
3347
3348
3349
3350
3351                                  <p>Wraps a DOM element specified by CSS selector as <a href="#Element" class="dr-link">Element</a>
3352</p>
3353
3354
3355
3356
3357
3358
3359
3360
3361
3362
3363                                  <div class="topcoat-list__container">
3364                                      <h3 class="topcoat-list__header">Parameters</h3>
3365                                      <ol class="topcoat-list">
3366                                          <li class="topcoat-list__item"><span class="dr-param">query</span>
3367                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
3368                                              <span class="dr-description">CSS selector of the element</span></li>
3369
3370                                      </ol>
3371                                  </div>
3372
3373
3374
3375
3376
3377
3378
3379
3380
3381
3382
3383
3384
3385                                  <p class="dr-returns">
3386                                      <strong class="dr-title">Returns:</strong>
3387
3388                                      <em class="dr-type-Element">Element</em>
3389
3390                                      <span class="dr-description">the current element</span>
3391                                  </p>
3392
3393
3394
3395
3396                              </div>
3397                          </section>
3398                      </article>
3399
3400                      <article id="Snap.selectAll">
3401                          <header>
3402                              <h3 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 1277 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1277">&#x27ad;</a></h3>
3403                          </header>
3404                          <section>
3405                              <div class="extra" id="Snap.selectAll-extra"></div>
3406                              <div class="dr-method">
3407
3408
3409
3410
3411                                  <p>Wraps DOM elements specified by CSS selector as set or array of <a href="#Element" class="dr-link">Element</a>
3412</p>
3413
3414
3415
3416
3417
3418
3419
3420
3421
3422
3423                                  <div class="topcoat-list__container">
3424                                      <h3 class="topcoat-list__header">Parameters</h3>
3425                                      <ol class="topcoat-list">
3426                                          <li class="topcoat-list__item"><span class="dr-param">query</span>
3427                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
3428                                              <span class="dr-description">CSS selector of the element</span></li>
3429
3430                                      </ol>
3431                                  </div>
3432
3433
3434
3435
3436
3437
3438
3439
3440
3441
3442
3443
3444
3445                                  <p class="dr-returns">
3446                                      <strong class="dr-title">Returns:</strong>
3447
3448                                      <em class="dr-type-Element">Element</em>
3449
3450                                      <span class="dr-description">the current element</span>
3451                                  </p>
3452
3453
3454
3455
3456                              </div>
3457                          </section>
3458                      </article>
3459
3460                      <article id="Element.node">
3461                          <header>
3462                              <h3 class="dr-property">Element.node()<a href="#Element.node" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1339 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1339">&#x27ad;</a></h3>
3463                          </header>
3464                          <section>
3465                              <div class="extra" id="Element.node-extra"></div>
3466                              <div class="dr-property">
3467
3468
3469
3470
3471                                  <p>Gives you a reference to the DOM object, so you can assign event handlers or just mess around.
3472</p>
3473
3474
3475
3476
3477
3478
3479
3480
3481
3482
3483
3484
3485                                  <h3>Usage</h3>
3486
3487
3488
3489
3490
3491
3492
3493
3494
3495
3496
3497                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">// draw a circle at coordinate 10,10 with radius of 10
3498var c = paper.circle(10, 10, 10);
3499c.node.onclick = function () {
3500    c.attr("fill", "red");
3501};</code></pre></section>
3502
3503
3504
3505
3506
3507                              </div>
3508                          </section>
3509                      </article>
3510
3511                      <article id="Element.type">
3512                          <header>
3513                              <h3 class="dr-property">Element.type()<a href="#Element.type" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1349 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1349">&#x27ad;</a></h3>
3514                          </header>
3515                          <section>
3516                              <div class="extra" id="Element.type-extra"></div>
3517                              <div class="dr-property">
3518
3519
3520
3521
3522                                  <p>SVG tag name of the given element.
3523</p>
3524
3525
3526
3527
3528
3529
3530
3531
3532                              </div>
3533                          </section>
3534                      </article>
3535
3536                      <article id="Element.attr">
3537                          <header>
3538                              <h3 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 1391 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1391">&#x27ad;</a></h3>
3539                          </header>
3540                          <section>
3541                              <div class="extra" id="Element.attr-extra"></div>
3542                              <div class="dr-method">
3543
3544
3545
3546
3547                                  <p>Gets or sets given attributes of the element.
3548</p>
3549
3550
3551
3552
3553
3554
3555
3556
3557
3558
3559                                  <div class="topcoat-list__container">
3560                                      <h3 class="topcoat-list__header">Parameters</h3>
3561                                      <ol class="topcoat-list">
3562                                          <li class="topcoat-list__item"><span class="dr-param">params</span>
3563                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
3564                                              <span class="dr-description">contains key-value pairs of attributes you want to set</span></li>
3565
3566                                      </ol>
3567                                  </div>
3568
3569
3570
3571
3572
3573
3574
3575
3576                                  <p>or
3577</p>
3578
3579
3580
3581
3582
3583
3584
3585
3586
3587
3588                                  <div class="topcoat-list__container">
3589                                      <h3 class="topcoat-list__header">Parameters</h3>
3590                                      <ol class="topcoat-list">
3591                                          <li class="topcoat-list__item"><span class="dr-param">param</span>
3592                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
3593                                              <span class="dr-description">name of the attribute</span></li>
3594
3595                                      </ol>
3596                                  </div>
3597
3598
3599
3600
3601
3602
3603
3604
3605
3606
3607
3608
3609
3610                                  <p class="dr-returns">
3611                                      <strong class="dr-title">Returns:</strong>
3612
3613                                      <em class="dr-type-Element">Element</em>
3614
3615                                      <span class="dr-description">the current element</span>
3616                                  </p>
3617
3618
3619
3620
3621
3622                                  <p>or
3623</p>
3624
3625
3626
3627
3628
3629
3630
3631
3632
3633
3634
3635
3636
3637
3638                                  <p class="dr-returns">
3639                                      <strong class="dr-title">Returns:</strong>
3640
3641                                      <em class="dr-type-string">string</em>
3642
3643                                      <span class="dr-description">value of attribute</span>
3644                                  </p>
3645
3646
3647
3648
3649
3650
3651
3652
3653                                  <h3>Usage</h3>
3654
3655
3656
3657
3658
3659
3660
3661
3662
3663
3664
3665                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">el.attr({
3666    fill: "#fc0",
3667    stroke: "#000",
3668    strokeWidth: 2, // CamelCase...
3669    "fill-opacity": 0.5, // or dash-separated names
3670    width: "*=2" // prefixed values
3671});
3672console.log(el.attr("fill")); // #fc0</code></pre></section>
3673
3674
3675
3676
3677
3678
3679                                  <p>Prefixed values in format <code>&quot;+=10&quot;</code> supported. All four operations
3680(<code>+</code>, <code>-</code>, <code>*</code> and <code>/</code>) could be used. Optionally you can use units for <code>+</code>
3681and <code>-</code>: <code>&quot;+=2em&quot;</code>.
3682</p>
3683
3684
3685
3686
3687
3688
3689
3690
3691                              </div>
3692                          </section>
3693                      </article>
3694
3695                      <article id="Snap.parse">
3696                          <header>
3697                              <h3 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 1432 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1432">&#x27ad;</a></h3>
3698                          </header>
3699                          <section>
3700                              <div class="extra" id="Snap.parse-extra"></div>
3701                              <div class="dr-method">
3702
3703
3704
3705
3706                                  <p>Parses SVG fragment and converts it into a <a href="#Fragment" class="dr-link">Fragment</a>
3707</p>
3708
3709
3710
3711
3712
3713
3714
3715
3716
3717
3718                                  <div class="topcoat-list__container">
3719                                      <h3 class="topcoat-list__header">Parameters</h3>
3720                                      <ol class="topcoat-list">
3721                                          <li class="topcoat-list__item"><span class="dr-param">svg</span>
3722                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
3723                                              <span class="dr-description">SVG string</span></li>
3724
3725                                      </ol>
3726                                  </div>
3727
3728
3729
3730
3731
3732
3733
3734
3735
3736
3737
3738
3739
3740                                  <p class="dr-returns">
3741                                      <strong class="dr-title">Returns:</strong>
3742
3743                                      <em class="dr-type-Fragment">Fragment</em>
3744
3745                                      <span class="dr-description">the <a href="#Fragment" class="dr-link">Fragment</a></span>
3746                                  </p>
3747
3748
3749
3750
3751                              </div>
3752                          </section>
3753                      </article>
3754
3755                      <article id="Snap.fragment">
3756                          <header>
3757                              <h3 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 1466 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1466">&#x27ad;</a></h3>
3758                          </header>
3759                          <section>
3760                              <div class="extra" id="Snap.fragment-extra"></div>
3761                              <div class="dr-method">
3762
3763
3764
3765
3766                                  <p>Creates a DOM fragment from a given list of elements or strings
3767</p>
3768
3769
3770
3771
3772
3773
3774
3775
3776
3777
3778                                  <div class="topcoat-list__container">
3779                                      <h3 class="topcoat-list__header">Parameters</h3>
3780                                      <ol class="topcoat-list">
3781                                          <li class="topcoat-list__item"><span class="dr-param">varargs</span>
3782                                              <span class="dr-type"><em class="dr-type-…">…</em> </span>
3783                                              <span class="dr-description">SVG string</span></li>
3784
3785                                      </ol>
3786                                  </div>
3787
3788
3789
3790
3791
3792
3793
3794
3795
3796
3797
3798
3799
3800                                  <p class="dr-returns">
3801                                      <strong class="dr-title">Returns:</strong>
3802
3803                                      <em class="dr-type-Fragment">Fragment</em>
3804
3805                                      <span class="dr-description">the <a href="#Fragment" class="dr-link">Fragment</a></span>
3806                                  </p>
3807
3808
3809
3810
3811                              </div>
3812                          </section>
3813                      </article>
3814
3815                      <article id="Paper.el">
3816                          <header>
3817                              <h3 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 1569 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1569">&#x27ad;</a></h3>
3818                          </header>
3819                          <section>
3820                              <div class="extra" id="Paper.el-extra"></div>
3821                              <div class="dr-method">
3822
3823
3824
3825
3826                                  <p>Creates an element on paper with a given name and no attributes
3827</p>
3828
3829
3830
3831
3832
3833
3834
3835
3836
3837
3838                                  <div class="topcoat-list__container">
3839                                      <h3 class="topcoat-list__header">Parameters</h3>
3840                                      <ol class="topcoat-list">
3841                                          <li class="topcoat-list__item"><span class="dr-param">name</span>
3842                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
3843                                              <span class="dr-description">tag name</span></li>
3844                                          <li class="topcoat-list__item"><span class="dr-param">attr</span>
3845                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
3846                                              <span class="dr-description">attributes</span></li>
3847
3848                                      </ol>
3849                                  </div>
3850
3851
3852
3853
3854
3855
3856
3857
3858
3859
3860
3861
3862
3863                                  <p class="dr-returns">
3864                                      <strong class="dr-title">Returns:</strong>
3865
3866                                      <em class="dr-type-Element">Element</em>
3867
3868                                      <span class="dr-description">the current element</span>
3869                                  </p>
3870
3871
3872
3873
3874
3875
3876
3877
3878                                  <h3>Usage</h3>
3879
3880
3881
3882
3883
3884
3885
3886
3887
3888
3889
3890                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.circle(10, 10, 10); // is the same as...
3891var c = paper.el("circle").attr({
3892    cx: 10,
3893    cy: 10,
3894    r: 10
3895});
3896// and the same as
3897var c = paper.el("circle", {
3898    cx: 10,
3899    cy: 10,
3900    r: 10
3901});</code></pre></section>
3902
3903
3904
3905
3906
3907                              </div>
3908                          </section>
3909                      </article>
3910
3911                      <article id="Element.children">
3912                          <header>
3913                              <h3 class="dr-method">Element.children()<a href="#Element.children" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1581 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1581">&#x27ad;</a></h3>
3914                          </header>
3915                          <section>
3916                              <div class="extra" id="Element.children-extra"></div>
3917                              <div class="dr-method">
3918
3919
3920
3921
3922                                  <p>Returns array of all the children of the element.
3923</p>
3924
3925
3926
3927
3928
3929
3930
3931
3932
3933
3934
3935
3936
3937
3938                                  <p class="dr-returns">
3939                                      <strong class="dr-title">Returns:</strong>
3940
3941                                      <em class="dr-type-array">array</em>
3942
3943                                      <span class="dr-description">array of Elements</span>
3944                                  </p>
3945
3946
3947
3948
3949                              </div>
3950                          </section>
3951                      </article>
3952
3953                      <article id="Element.toJSON">
3954                          <header>
3955                              <h3 class="dr-method">Element.toJSON()<a href="#Element.toJSON" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1614 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1614">&#x27ad;</a></h3>
3956                          </header>
3957                          <section>
3958                              <div class="extra" id="Element.toJSON-extra"></div>
3959                              <div class="dr-method">
3960
3961
3962
3963
3964                                  <p>Returns object representation of the given element and all its children.
3965</p>
3966
3967
3968
3969
3970
3971
3972
3973
3974
3975
3976
3977
3978
3979
3980                                  <p class="dr-returns">
3981                                      <strong class="dr-title">Returns:</strong>
3982
3983                                      <em class="dr-type-object">object</em>
3984
3985                                      <span class="dr-description">in format</span>
3986                                  </p>
3987
3988
3989
3990
3991
3992
3993
3994
3995
3996
3997
3998                                  <ol class="dr-json">
3999
4000
4001                                      <li>{<ol class="dr-json">
4002
4003
4004
4005                                      <li>
4006                                          <span class="dr-json-key">type</span>
4007                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
4008                                          <span class="dr-json-description">this.type,</span>
4009                                      </li>
4010
4011
4012
4013                                      <li>
4014                                          <span class="dr-json-key">attr</span>
4015                                          <span class="dr-type"><em class="dr-type-object">object</em> </span>
4016                                          <span class="dr-json-description">attributes map,</span>
4017                                      </li>
4018
4019
4020
4021                                      <li>
4022                                          <span class="dr-json-key">childNodes</span>
4023                                          <span class="dr-type"><em class="dr-type-array">array</em> </span>
4024                                          <span class="dr-json-description">optional array of children in the same format</span>
4025                                      </li>
4026
4027
4028
4029                                      </ol></li><li>}</li>
4030
4031
4032                                  </ol>
4033
4034
4035                              </div>
4036                          </section>
4037                      </article>
4038
4039                      <article id="Snap.ajax">
4040                          <header>
4041                              <h3 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 1732 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1732">&#x27ad;</a></h3>
4042                          </header>
4043                          <section>
4044                              <div class="extra" id="Snap.ajax-extra"></div>
4045                              <div class="dr-method">
4046
4047
4048
4049
4050                                  <p>Simple implementation of Ajax
4051</p>
4052
4053
4054
4055
4056
4057
4058
4059
4060
4061
4062                                  <div class="topcoat-list__container">
4063                                      <h3 class="topcoat-list__header">Parameters</h3>
4064                                      <ol class="topcoat-list">
4065                                          <li class="topcoat-list__item"><span class="dr-param">url</span>
4066                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
4067                                              <span class="dr-description">URL</span></li>
4068                                          <li class="topcoat-list__item"><span class="dr-param">postData</span>
4069                                              <span class="dr-type"><em class="dr-type-object">object</em> <em class="dr-type-string">string</em> </span>
4070                                              <span class="dr-description">data for post request</span></li>
4071                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
4072                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
4073                                              <span class="dr-description">callback</span></li>
4074                                          <li class="topcoat-list__item"><span class="dr-param">scope</span>
4075                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
4076                                              <span class="dr-description">scope of callback</span></li>
4077
4078                                      </ol>
4079                                  </div>
4080
4081
4082
4083
4084
4085
4086
4087
4088                                  <p>or
4089</p>
4090
4091
4092
4093
4094
4095
4096
4097
4098
4099
4100                                  <div class="topcoat-list__container">
4101                                      <h3 class="topcoat-list__header">Parameters</h3>
4102                                      <ol class="topcoat-list">
4103                                          <li class="topcoat-list__item"><span class="dr-param">url</span>
4104                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
4105                                              <span class="dr-description">URL</span></li>
4106                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
4107                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
4108                                              <span class="dr-description">callback</span></li>
4109                                          <li class="topcoat-list__item"><span class="dr-param">scope</span>
4110                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
4111                                              <span class="dr-description">scope of callback</span></li>
4112
4113                                      </ol>
4114                                  </div>
4115
4116
4117
4118
4119
4120
4121
4122
4123
4124
4125
4126
4127
4128                                  <p class="dr-returns">
4129                                      <strong class="dr-title">Returns:</strong>
4130
4131                                      <em class="dr-type-XMLHttpRequest">XMLHttpRequest</em>
4132
4133                                      <span class="dr-description">the XMLHttpRequest object, just in case</span>
4134                                  </p>
4135
4136
4137
4138
4139                              </div>
4140                          </section>
4141                      </article>
4142
4143                      <article id="Snap.load">
4144                          <header>
4145                              <h3 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 1778 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1778">&#x27ad;</a></h3>
4146                          </header>
4147                          <section>
4148                              <div class="extra" id="Snap.load-extra"></div>
4149                              <div class="dr-method">
4150
4151
4152
4153
4154                                  <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)
4155</p>
4156
4157
4158
4159
4160
4161
4162
4163
4164
4165
4166                                  <div class="topcoat-list__container">
4167                                      <h3 class="topcoat-list__header">Parameters</h3>
4168                                      <ol class="topcoat-list">
4169                                          <li class="topcoat-list__item"><span class="dr-param">url</span>
4170                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
4171                                              <span class="dr-description">URL</span></li>
4172                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
4173                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
4174                                              <span class="dr-description">callback</span></li>
4175                                          <li class="topcoat-list__item"><span class="dr-param">scope</span>
4176                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
4177                                              <span class="dr-description">scope of callback</span></li>
4178
4179                                      </ol>
4180                                  </div>
4181
4182
4183
4184
4185
4186
4187
4188                              </div>
4189                          </section>
4190                      </article>
4191
4192                      <article id="Snap.getElementByPoint">
4193                          <header>
4194                              <h3 class="dr-method">Snap.getElementByPoint(x, y)<a href="#Snap.getElementByPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1809 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1809">&#x27ad;</a></h3>
4195                          </header>
4196                          <section>
4197                              <div class="extra" id="Snap.getElementByPoint-extra"></div>
4198                              <div class="dr-method">
4199
4200
4201
4202
4203                                  <p>Returns you topmost element under given point.
4204</p>
4205
4206
4207
4208
4209
4210
4211
4212
4213
4214
4215
4216
4217
4218
4219                                  <p class="dr-returns">
4220                                      <strong class="dr-title">Returns:</strong>
4221
4222                                      <em class="dr-type-object">object</em>
4223
4224                                      <span class="dr-description">Snap element object</span>
4225                                  </p>
4226
4227
4228
4229
4230
4231
4232                                  <div class="topcoat-list__container">
4233                                      <h3 class="topcoat-list__header">Parameters</h3>
4234                                      <ol class="topcoat-list">
4235                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
4236                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
4237                                              <span class="dr-description">x coordinate from the top left corner of the window</span></li>
4238                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
4239                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
4240                                              <span class="dr-description">y coordinate from the top left corner of the window</span></li>
4241
4242                                      </ol>
4243                                  </div>
4244
4245
4246
4247
4248
4249
4250
4251
4252
4253
4254
4255                                  <h3>Usage</h3>
4256
4257
4258
4259
4260
4261
4262
4263
4264
4265
4266
4267                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">Snap.getElementByPoint(mouseX, mouseY).attr({stroke: "#f00"});</code></pre></section>
4268
4269
4270
4271
4272
4273                              </div>
4274                          </section>
4275                      </article>
4276
4277                      <article id="Snap.plugin">
4278                          <header>
4279                              <h3 class="dr-method">Snap.plugin(f)<a href="#Snap.plugin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1844 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1844">&#x27ad;</a></h3>
4280                          </header>
4281                          <section>
4282                              <div class="extra" id="Snap.plugin-extra"></div>
4283                              <div class="dr-method">
4284
4285
4286
4287
4288                                  <p>Let you write plugins. You pass in a function with five arguments, like this:
4289</p>
4290
4291
4292
4293
4294
4295
4296
4297
4298
4299
4300
4301
4302
4303                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">Snap.plugin(function (Snap, Element, Paper, global, Fragment) {
4304    Snap.newmethod = function () {};
4305    Element.prototype.newmethod = function () {};
4306    Paper.prototype.newmethod = function () {};
4307});</code></pre></section>
4308
4309
4310
4311
4312
4313
4314                                  <p>Inside the function you have access to all main objects (and their
4315prototypes). This allow you to extend anything you want.
4316</p>
4317
4318
4319
4320
4321
4322
4323
4324
4325
4326
4327                                  <div class="topcoat-list__container">
4328                                      <h3 class="topcoat-list__header">Parameters</h3>
4329                                      <ol class="topcoat-list">
4330                                          <li class="topcoat-list__item"><span class="dr-param">f</span>
4331                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
4332                                              <span class="dr-description">your plugin body</span></li>
4333
4334                                      </ol>
4335                                  </div>
4336
4337
4338
4339
4340
4341
4342
4343                              </div>
4344                          </section>
4345                      </article>
4346
4347                      <article id="Element.getBBox">
4348                          <header>
4349                              <h3 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 49 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L49">&#x27ad;</a></h3>
4350                          </header>
4351                          <section>
4352                              <div class="extra" id="Element.getBBox-extra"></div>
4353                              <div class="dr-method">
4354
4355
4356
4357
4358                                  <p>Returns the bounding box descriptor for the given element
4359</p>
4360
4361
4362
4363
4364
4365
4366
4367
4368
4369
4370
4371
4372
4373
4374                                  <p class="dr-returns">
4375                                      <strong class="dr-title">Returns:</strong>
4376
4377                                      <em class="dr-type-object">object</em>
4378
4379                                      <span class="dr-description">bounding box descriptor:</span>
4380                                  </p>
4381
4382
4383
4384
4385
4386
4387
4388
4389
4390
4391
4392                                  <ol class="dr-json">
4393
4394
4395                                      <li>{<ol class="dr-json">
4396
4397
4398
4399                                      <li>
4400                                          <span class="dr-json-key">cx:</span>
4401                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4402                                          <span class="dr-json-description">x of the center,</span>
4403                                      </li>
4404
4405
4406
4407                                      <li>
4408                                          <span class="dr-json-key">cy:</span>
4409                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4410                                          <span class="dr-json-description">x of the center,</span>
4411                                      </li>
4412
4413
4414
4415                                      <li>
4416                                          <span class="dr-json-key">h:</span>
4417                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4418                                          <span class="dr-json-description">height,</span>
4419                                      </li>
4420
4421
4422
4423                                      <li>
4424                                          <span class="dr-json-key">height:</span>
4425                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4426                                          <span class="dr-json-description">height,</span>
4427                                      </li>
4428
4429
4430
4431                                      <li>
4432                                          <span class="dr-json-key">path:</span>
4433                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
4434                                          <span class="dr-json-description">path command for the box,</span>
4435                                      </li>
4436
4437
4438
4439                                      <li>
4440                                          <span class="dr-json-key">r0:</span>
4441                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4442                                          <span class="dr-json-description">radius of a circle that fully encloses the box,</span>
4443                                      </li>
4444
4445
4446
4447                                      <li>
4448                                          <span class="dr-json-key">r1:</span>
4449                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4450                                          <span class="dr-json-description">radius of the smallest circle that can be enclosed,</span>
4451                                      </li>
4452
4453
4454
4455                                      <li>
4456                                          <span class="dr-json-key">r2:</span>
4457                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4458                                          <span class="dr-json-description">radius of the largest circle that can be enclosed,</span>
4459                                      </li>
4460
4461
4462
4463                                      <li>
4464                                          <span class="dr-json-key">vb:</span>
4465                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
4466                                          <span class="dr-json-description">box as a viewbox command,</span>
4467                                      </li>
4468
4469
4470
4471                                      <li>
4472                                          <span class="dr-json-key">w:</span>
4473                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4474                                          <span class="dr-json-description">width,</span>
4475                                      </li>
4476
4477
4478
4479                                      <li>
4480                                          <span class="dr-json-key">width:</span>
4481                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4482                                          <span class="dr-json-description">width,</span>
4483                                      </li>
4484
4485
4486
4487                                      <li>
4488                                          <span class="dr-json-key">x2:</span>
4489                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4490                                          <span class="dr-json-description">x of the right side,</span>
4491                                      </li>
4492
4493
4494
4495                                      <li>
4496                                          <span class="dr-json-key">x:</span>
4497                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4498                                          <span class="dr-json-description">x of the left side,</span>
4499                                      </li>
4500
4501
4502
4503                                      <li>
4504                                          <span class="dr-json-key">y2:</span>
4505                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4506                                          <span class="dr-json-description">y of the bottom edge,</span>
4507                                      </li>
4508
4509
4510
4511                                      <li>
4512                                          <span class="dr-json-key">y:</span>
4513                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
4514                                          <span class="dr-json-description">y of the top edge</span>
4515                                      </li>
4516
4517
4518
4519                                      </ol></li><li>}</li>
4520
4521
4522                                  </ol>
4523
4524
4525                              </div>
4526                          </section>
4527                      </article>
4528
4529                      <article id="Element.transform">
4530                          <header>
4531                              <h3 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 141 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L141">&#x27ad;</a></h3>
4532                          </header>
4533                          <section>
4534                              <div class="extra" id="Element.transform-extra"></div>
4535                              <div class="dr-method">
4536
4537
4538
4539
4540                                  <p>Gets or sets transformation of the element
4541</p>
4542
4543
4544
4545
4546
4547
4548
4549
4550
4551
4552                                  <div class="topcoat-list__container">
4553                                      <h3 class="topcoat-list__header">Parameters</h3>
4554                                      <ol class="topcoat-list">
4555                                          <li class="topcoat-list__item"><span class="dr-param">tstr</span>
4556                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
4557                                              <span class="dr-description">transform string in Snap or SVG format</span></li>
4558
4559                                      </ol>
4560                                  </div>
4561
4562
4563
4564
4565
4566
4567
4568
4569
4570
4571
4572
4573
4574                                  <p class="dr-returns">
4575                                      <strong class="dr-title">Returns:</strong>
4576
4577                                      <em class="dr-type-Element">Element</em>
4578
4579                                      <span class="dr-description">the current element</span>
4580                                  </p>
4581
4582
4583
4584
4585
4586                                  <p>or
4587</p>
4588
4589
4590
4591
4592
4593
4594
4595
4596
4597
4598
4599
4600
4601
4602                                  <p class="dr-returns">
4603                                      <strong class="dr-title">Returns:</strong>
4604
4605                                      <em class="dr-type-object">object</em>
4606
4607                                      <span class="dr-description">transformation descriptor:</span>
4608                                  </p>
4609
4610
4611
4612
4613
4614
4615
4616
4617
4618
4619
4620                                  <ol class="dr-json">
4621
4622
4623                                      <li>{<ol class="dr-json">
4624
4625
4626
4627                                      <li>
4628                                          <span class="dr-json-key">string</span>
4629                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
4630                                          <span class="dr-json-description">transform string,</span>
4631                                      </li>
4632
4633
4634
4635                                      <li>
4636                                          <span class="dr-json-key">globalMatrix</span>
4637                                          <span class="dr-type"><em class="dr-type-Matrix">Matrix</em> </span>
4638                                          <span class="dr-json-description">matrix of all transformations applied to element or its parents,</span>
4639                                      </li>
4640
4641
4642
4643                                      <li>
4644                                          <span class="dr-json-key">localMatrix</span>
4645                                          <span class="dr-type"><em class="dr-type-Matrix">Matrix</em> </span>
4646                                          <span class="dr-json-description">matrix of transformations applied only to the element,</span>
4647                                      </li>
4648
4649
4650
4651                                      <li>
4652                                          <span class="dr-json-key">diffMatrix</span>
4653                                          <span class="dr-type"><em class="dr-type-Matrix">Matrix</em> </span>
4654                                          <span class="dr-json-description">matrix of difference between global and local transformations,</span>
4655                                      </li>
4656
4657
4658
4659                                      <li>
4660                                          <span class="dr-json-key">global</span>
4661                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
4662                                          <span class="dr-json-description">global transformation as string,</span>
4663                                      </li>
4664
4665
4666
4667                                      <li>
4668                                          <span class="dr-json-key">local</span>
4669                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
4670                                          <span class="dr-json-description">local transformation as string,</span>
4671                                      </li>
4672
4673
4674
4675                                      <li>
4676                                          <span class="dr-json-key">toString</span>
4677                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
4678                                          <span class="dr-json-description">returns <code>string</code> property</span>
4679                                      </li>
4680
4681
4682
4683                                      </ol></li><li>}</li>
4684
4685
4686                                  </ol>
4687
4688
4689                              </div>
4690                          </section>
4691                      </article>
4692
4693                      <article id="Element.parent">
4694                          <header>
4695                              <h3 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 199 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L199">&#x27ad;</a></h3>
4696                          </header>
4697                          <section>
4698                              <div class="extra" id="Element.parent-extra"></div>
4699                              <div class="dr-method">
4700
4701
4702
4703
4704                                  <p>Returns the element&#39;s parent
4705</p>
4706
4707
4708
4709
4710
4711
4712
4713
4714
4715
4716
4717
4718
4719
4720                                  <p class="dr-returns">
4721                                      <strong class="dr-title">Returns:</strong>
4722
4723                                      <em class="dr-type-Element">Element</em>
4724
4725                                      <span class="dr-description">the parent element</span>
4726                                  </p>
4727
4728
4729
4730
4731                              </div>
4732                          </section>
4733                      </article>
4734
4735                      <article id="Element.append">
4736                          <header>
4737                              <h3 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 211 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L211">&#x27ad;</a></h3>
4738                          </header>
4739                          <section>
4740                              <div class="extra" id="Element.append-extra"></div>
4741                              <div class="dr-method">
4742
4743
4744
4745
4746                                  <p>Appends the given element to current one
4747</p>
4748
4749
4750
4751
4752
4753
4754
4755
4756
4757
4758                                  <div class="topcoat-list__container">
4759                                      <h3 class="topcoat-list__header">Parameters</h3>
4760                                      <ol class="topcoat-list">
4761                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
4762                                              <span class="dr-type"><em class="dr-type-Element">Element</em> <em class="dr-type-Set">Set</em> </span>
4763                                              <span class="dr-description">element to append</span></li>
4764
4765                                      </ol>
4766                                  </div>
4767
4768
4769
4770
4771
4772
4773
4774
4775
4776
4777
4778
4779
4780                                  <p class="dr-returns">
4781                                      <strong class="dr-title">Returns:</strong>
4782
4783                                      <em class="dr-type-Element">Element</em>
4784
4785                                      <span class="dr-description">the parent element</span>
4786                                  </p>
4787
4788
4789
4790
4791                              </div>
4792                          </section>
4793                      </article>
4794
4795                      <article id="Element.add">
4796                          <header>
4797                              <h3 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 217 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L217">&#x27ad;</a></h3>
4798                          </header>
4799                          <section>
4800                              <div class="extra" id="Element.add-extra"></div>
4801                              <div class="dr-method">
4802
4803
4804
4805
4806                                  <p>See <a href="#Element.append" class="dr-link">Element.append</a>
4807</p>
4808
4809
4810
4811
4812
4813
4814
4815
4816                              </div>
4817                          </section>
4818                      </article>
4819
4820                      <article id="Element.appendTo">
4821                          <header>
4822                              <h3 class="dr-method">Element.appendTo(el)<a href="#Element.appendTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 241 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L241">&#x27ad;</a></h3>
4823                          </header>
4824                          <section>
4825                              <div class="extra" id="Element.appendTo-extra"></div>
4826                              <div class="dr-method">
4827
4828
4829
4830
4831                                  <p>Appends the current element to the given one
4832</p>
4833
4834
4835
4836
4837
4838
4839
4840
4841
4842
4843                                  <div class="topcoat-list__container">
4844                                      <h3 class="topcoat-list__header">Parameters</h3>
4845                                      <ol class="topcoat-list">
4846                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
4847                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
4848                                              <span class="dr-description">parent element to append to</span></li>
4849
4850                                      </ol>
4851                                  </div>
4852
4853
4854
4855
4856
4857
4858
4859
4860
4861
4862
4863
4864
4865                                  <p class="dr-returns">
4866                                      <strong class="dr-title">Returns:</strong>
4867
4868                                      <em class="dr-type-Element">Element</em>
4869
4870                                      <span class="dr-description">the child element</span>
4871                                  </p>
4872
4873
4874
4875
4876                              </div>
4877                          </section>
4878                      </article>
4879
4880                      <article id="Element.prepend">
4881                          <header>
4882                              <h3 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 257 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L257">&#x27ad;</a></h3>
4883                          </header>
4884                          <section>
4885                              <div class="extra" id="Element.prepend-extra"></div>
4886                              <div class="dr-method">
4887
4888
4889
4890
4891                                  <p>Prepends the given element to the current one
4892</p>
4893
4894
4895
4896
4897
4898
4899
4900
4901
4902
4903                                  <div class="topcoat-list__container">
4904                                      <h3 class="topcoat-list__header">Parameters</h3>
4905                                      <ol class="topcoat-list">
4906                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
4907                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
4908                                              <span class="dr-description">element to prepend</span></li>
4909
4910                                      </ol>
4911                                  </div>
4912
4913
4914
4915
4916
4917
4918
4919
4920
4921
4922
4923
4924
4925                                  <p class="dr-returns">
4926                                      <strong class="dr-title">Returns:</strong>
4927
4928                                      <em class="dr-type-Element">Element</em>
4929
4930                                      <span class="dr-description">the parent element</span>
4931                                  </p>
4932
4933
4934
4935
4936                              </div>
4937                          </section>
4938                      </article>
4939
4940                      <article id="Element.prependTo">
4941                          <header>
4942                              <h3 class="dr-method">Element.prependTo(el)<a href="#Element.prependTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 291 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L291">&#x27ad;</a></h3>
4943                          </header>
4944                          <section>
4945                              <div class="extra" id="Element.prependTo-extra"></div>
4946                              <div class="dr-method">
4947
4948
4949
4950
4951                                  <p>Prepends the current element to the given one
4952</p>
4953
4954
4955
4956
4957
4958
4959
4960
4961
4962
4963                                  <div class="topcoat-list__container">
4964                                      <h3 class="topcoat-list__header">Parameters</h3>
4965                                      <ol class="topcoat-list">
4966                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
4967                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
4968                                              <span class="dr-description">parent element to prepend to</span></li>
4969
4970                                      </ol>
4971                                  </div>
4972
4973
4974
4975
4976
4977
4978
4979
4980
4981
4982
4983
4984
4985                                  <p class="dr-returns">
4986                                      <strong class="dr-title">Returns:</strong>
4987
4988                                      <em class="dr-type-Element">Element</em>
4989
4990                                      <span class="dr-description">the child element</span>
4991                                  </p>
4992
4993
4994
4995
4996                              </div>
4997                          </section>
4998                      </article>
4999
5000                      <article id="Element.before">
5001                          <header>
5002                              <h3 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 305 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L305">&#x27ad;</a></h3>
5003                          </header>
5004                          <section>
5005                              <div class="extra" id="Element.before-extra"></div>
5006                              <div class="dr-method">
5007
5008
5009
5010
5011                                  <p>Inserts given element before the current one
5012</p>
5013
5014
5015
5016
5017
5018
5019
5020
5021
5022
5023                                  <div class="topcoat-list__container">
5024                                      <h3 class="topcoat-list__header">Parameters</h3>
5025                                      <ol class="topcoat-list">
5026                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
5027                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
5028                                              <span class="dr-description">element to insert</span></li>
5029
5030                                      </ol>
5031                                  </div>
5032
5033
5034
5035
5036
5037
5038
5039
5040
5041
5042
5043
5044
5045                                  <p class="dr-returns">
5046                                      <strong class="dr-title">Returns:</strong>
5047
5048                                      <em class="dr-type-Element">Element</em>
5049
5050                                      <span class="dr-description">the parent element</span>
5051                                  </p>
5052
5053
5054
5055
5056                              </div>
5057                          </section>
5058                      </article>
5059
5060                      <article id="Element.after">
5061                          <header>
5062                              <h3 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 333 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L333">&#x27ad;</a></h3>
5063                          </header>
5064                          <section>
5065                              <div class="extra" id="Element.after-extra"></div>
5066                              <div class="dr-method">
5067
5068
5069
5070
5071                                  <p>Inserts given element after the current one
5072</p>
5073
5074
5075
5076
5077
5078
5079
5080
5081
5082
5083                                  <div class="topcoat-list__container">
5084                                      <h3 class="topcoat-list__header">Parameters</h3>
5085                                      <ol class="topcoat-list">
5086                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
5087                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
5088                                              <span class="dr-description">element to insert</span></li>
5089
5090                                      </ol>
5091                                  </div>
5092
5093
5094
5095
5096
5097
5098
5099
5100
5101
5102
5103
5104
5105                                  <p class="dr-returns">
5106                                      <strong class="dr-title">Returns:</strong>
5107
5108                                      <em class="dr-type-Element">Element</em>
5109
5110                                      <span class="dr-description">the parent element</span>
5111                                  </p>
5112
5113
5114
5115
5116                              </div>
5117                          </section>
5118                      </article>
5119
5120                      <article id="Element.insertBefore">
5121                          <header>
5122                              <h3 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 355 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L355">&#x27ad;</a></h3>
5123                          </header>
5124                          <section>
5125                              <div class="extra" id="Element.insertBefore-extra"></div>
5126                              <div class="dr-method">
5127
5128
5129
5130
5131                                  <p>Inserts the element after the given one
5132</p>
5133
5134
5135
5136
5137
5138
5139
5140
5141
5142
5143                                  <div class="topcoat-list__container">
5144                                      <h3 class="topcoat-list__header">Parameters</h3>
5145                                      <ol class="topcoat-list">
5146                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
5147                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
5148                                              <span class="dr-description">element next to whom insert to</span></li>
5149
5150                                      </ol>
5151                                  </div>
5152
5153
5154
5155
5156
5157
5158
5159
5160
5161
5162
5163
5164
5165                                  <p class="dr-returns">
5166                                      <strong class="dr-title">Returns:</strong>
5167
5168                                      <em class="dr-type-Element">Element</em>
5169
5170                                      <span class="dr-description">the parent element</span>
5171                                  </p>
5172
5173
5174
5175
5176                              </div>
5177                          </section>
5178                      </article>
5179
5180                      <article id="Element.insertAfter">
5181                          <header>
5182                              <h3 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 373 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L373">&#x27ad;</a></h3>
5183                          </header>
5184                          <section>
5185                              <div class="extra" id="Element.insertAfter-extra"></div>
5186                              <div class="dr-method">
5187
5188
5189
5190
5191                                  <p>Inserts the element after the given one
5192</p>
5193
5194
5195
5196
5197
5198
5199
5200
5201
5202
5203                                  <div class="topcoat-list__container">
5204                                      <h3 class="topcoat-list__header">Parameters</h3>
5205                                      <ol class="topcoat-list">
5206                                          <li class="topcoat-list__item"><span class="dr-param">el</span>
5207                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
5208                                              <span class="dr-description">element next to whom insert to</span></li>
5209
5210                                      </ol>
5211                                  </div>
5212
5213
5214
5215
5216
5217
5218
5219
5220
5221
5222
5223
5224
5225                                  <p class="dr-returns">
5226                                      <strong class="dr-title">Returns:</strong>
5227
5228                                      <em class="dr-type-Element">Element</em>
5229
5230                                      <span class="dr-description">the parent element</span>
5231                                  </p>
5232
5233
5234
5235
5236                              </div>
5237                          </section>
5238                      </article>
5239
5240                      <article id="Element.remove">
5241                          <header>
5242                              <h3 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 389 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L389">&#x27ad;</a></h3>
5243                          </header>
5244                          <section>
5245                              <div class="extra" id="Element.remove-extra"></div>
5246                              <div class="dr-method">
5247
5248
5249
5250
5251                                  <p>Removes element from the DOM
5252</p>
5253
5254
5255
5256
5257
5258
5259
5260
5261
5262
5263
5264
5265
5266
5267                                  <p class="dr-returns">
5268                                      <strong class="dr-title">Returns:</strong>
5269
5270                                      <em class="dr-type-Element">Element</em>
5271
5272                                      <span class="dr-description">the detached element</span>
5273                                  </p>
5274
5275
5276
5277
5278                              </div>
5279                          </section>
5280                      </article>
5281
5282                      <article id="Element.select">
5283                          <header>
5284                              <h3 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 406 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L406">&#x27ad;</a></h3>
5285                          </header>
5286                          <section>
5287                              <div class="extra" id="Element.select-extra"></div>
5288                              <div class="dr-method">
5289
5290
5291
5292
5293                                  <p>Gathers the nested <a href="#Element" class="dr-link">Element</a> matching the given set of CSS selectors
5294</p>
5295
5296
5297
5298
5299
5300
5301
5302
5303
5304
5305                                  <div class="topcoat-list__container">
5306                                      <h3 class="topcoat-list__header">Parameters</h3>
5307                                      <ol class="topcoat-list">
5308                                          <li class="topcoat-list__item"><span class="dr-param">query</span>
5309                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
5310                                              <span class="dr-description">CSS selector</span></li>
5311
5312                                      </ol>
5313                                  </div>
5314
5315
5316
5317
5318
5319
5320
5321
5322
5323
5324
5325
5326
5327                                  <p class="dr-returns">
5328                                      <strong class="dr-title">Returns:</strong>
5329
5330                                      <em class="dr-type-Element">Element</em>
5331
5332                                      <span class="dr-description">result of query selection</span>
5333                                  </p>
5334
5335
5336
5337
5338                              </div>
5339                          </section>
5340                      </article>
5341
5342                      <article id="Element.selectAll">
5343                          <header>
5344                              <h3 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 418 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L418">&#x27ad;</a></h3>
5345                          </header>
5346                          <section>
5347                              <div class="extra" id="Element.selectAll-extra"></div>
5348                              <div class="dr-method">
5349
5350
5351
5352
5353                                  <p>Gathers nested <a href="#Element" class="dr-link">Element</a> objects matching the given set of CSS selectors
5354</p>
5355
5356
5357
5358
5359
5360
5361
5362
5363
5364
5365                                  <div class="topcoat-list__container">
5366                                      <h3 class="topcoat-list__header">Parameters</h3>
5367                                      <ol class="topcoat-list">
5368                                          <li class="topcoat-list__item"><span class="dr-param">query</span>
5369                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
5370                                              <span class="dr-description">CSS selector</span></li>
5371
5372                                      </ol>
5373                                  </div>
5374
5375
5376
5377
5378
5379
5380
5381
5382
5383
5384
5385
5386
5387                                  <p class="dr-returns">
5388                                      <strong class="dr-title">Returns:</strong>
5389
5390                                      <em class="dr-type-Set">Set</em>
5391
5392                                      <em class="dr-type-array">array</em>
5393
5394                                      <span class="dr-description">result of query selection</span>
5395                                  </p>
5396
5397
5398
5399
5400                              </div>
5401                          </section>
5402                      </article>
5403
5404                      <article id="Element.asPX">
5405                          <header>
5406                              <h3 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 436 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L436">&#x27ad;</a></h3>
5407                          </header>
5408                          <section>
5409                              <div class="extra" id="Element.asPX-extra"></div>
5410                              <div class="dr-method">
5411
5412
5413
5414
5415                                  <p>Returns given attribute of the element as a <code>px</code> value (not %, em, etc.)
5416</p>
5417
5418
5419
5420
5421
5422
5423
5424
5425
5426
5427                                  <div class="topcoat-list__container">
5428                                      <h3 class="topcoat-list__header">Parameters</h3>
5429                                      <ol class="topcoat-list">
5430                                          <li class="topcoat-list__item"><span class="dr-param">attr</span>
5431                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
5432                                              <span class="dr-description">attribute name</span></li>
5433                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
5434                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
5435                                              <span class="dr-description">attribute value</span></li>
5436
5437                                      </ol>
5438                                  </div>
5439
5440
5441
5442
5443
5444
5445
5446
5447
5448
5449
5450
5451
5452                                  <p class="dr-returns">
5453                                      <strong class="dr-title">Returns:</strong>
5454
5455                                      <em class="dr-type-Element">Element</em>
5456
5457                                      <span class="dr-description">result of query selection</span>
5458                                  </p>
5459
5460
5461
5462
5463                              </div>
5464                          </section>
5465                      </article>
5466
5467                      <article id="Element.use">
5468                          <header>
5469                              <h3 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 451 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L451">&#x27ad;</a></h3>
5470                          </header>
5471                          <section>
5472                              <div class="extra" id="Element.use-extra"></div>
5473                              <div class="dr-method">
5474
5475
5476
5477
5478                                  <p>Creates a <code>&lt;use&gt;</code> element linked to the current element
5479</p>
5480
5481
5482
5483
5484
5485
5486
5487
5488
5489
5490
5491
5492
5493
5494                                  <p class="dr-returns">
5495                                      <strong class="dr-title">Returns:</strong>
5496
5497                                      <em class="dr-type-Element">Element</em>
5498
5499                                      <span class="dr-description">the <code>&lt;use&gt;</code> element</span>
5500                                  </p>
5501
5502
5503
5504
5505                              </div>
5506                          </section>
5507                      </article>
5508
5509                      <article id="Element.clone">
5510                          <header>
5511                              <h3 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 542 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L542">&#x27ad;</a></h3>
5512                          </header>
5513                          <section>
5514                              <div class="extra" id="Element.clone-extra"></div>
5515                              <div class="dr-method">
5516
5517
5518
5519
5520                                  <p>Creates a clone of the element and inserts it after the element
5521</p>
5522
5523
5524
5525
5526
5527
5528
5529
5530
5531
5532
5533
5534
5535
5536                                  <p class="dr-returns">
5537                                      <strong class="dr-title">Returns:</strong>
5538
5539                                      <em class="dr-type-Element">Element</em>
5540
5541                                      <span class="dr-description">the clone</span>
5542                                  </p>
5543
5544
5545
5546
5547                              </div>
5548                          </section>
5549                      </article>
5550
5551                      <article id="Element.toDefs">
5552                          <header>
5553                              <h3 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 559 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L559">&#x27ad;</a></h3>
5554                          </header>
5555                          <section>
5556                              <div class="extra" id="Element.toDefs-extra"></div>
5557                              <div class="dr-method">
5558
5559
5560
5561
5562                                  <p>Moves element to the shared <code>&lt;defs&gt;</code> area
5563</p>
5564
5565
5566
5567
5568
5569
5570
5571
5572
5573
5574
5575
5576
5577
5578                                  <p class="dr-returns">
5579                                      <strong class="dr-title">Returns:</strong>
5580
5581                                      <em class="dr-type-Element">Element</em>
5582
5583                                      <span class="dr-description">the element</span>
5584                                  </p>
5585
5586
5587
5588
5589                              </div>
5590                          </section>
5591                      </article>
5592
5593                      <article id="Element.toPattern">
5594                          <header>
5595                              <h3 class="dr-method">Element.toPattern(x, y, width, height)<a href="#Element.toPattern" 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/Snap.svg/blob/master/src/svg.js#L587">&#x27ad;</a></h3>
5596                          </header>
5597                          <section>
5598                              <div class="extra" id="Element.toPattern-extra"></div>
5599                              <div class="dr-method">
5600
5601
5602
5603
5604                                  <p>Creates a <code>&lt;pattern&gt;</code> element from the current element
5605To create a pattern you have to specify the pattern rect:
5606</p>
5607
5608
5609
5610
5611
5612
5613
5614
5615
5616
5617                                  <div class="topcoat-list__container">
5618                                      <h3 class="topcoat-list__header">Parameters</h3>
5619                                      <ol class="topcoat-list">
5620                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
5621                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-number">number</em> </span>
5622                                              <span class="dr-description"></span></li>
5623                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
5624                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-number">number</em> </span>
5625                                              <span class="dr-description"></span></li>
5626                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
5627                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-number">number</em> </span>
5628                                              <span class="dr-description"></span></li>
5629                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
5630                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-number">number</em> </span>
5631                                              <span class="dr-description"></span></li>
5632
5633                                      </ol>
5634                                  </div>
5635
5636
5637
5638
5639
5640
5641
5642
5643
5644
5645
5646
5647
5648                                  <p class="dr-returns">
5649                                      <strong class="dr-title">Returns:</strong>
5650
5651                                      <em class="dr-type-Element">Element</em>
5652
5653                                      <span class="dr-description">the <code>&lt;pattern&gt;</code> element</span>
5654                                  </p>
5655
5656
5657
5658
5659
5660                                  <p>You can use pattern later on as an argument for <code>fill</code> attribute:
5661</p>
5662
5663
5664
5665
5666
5667
5668
5669
5670
5671
5672
5673
5674
5675                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var p = paper.path("M10-5-10,15M15,0,0,15M0-5-20,15").attr({
5676        fill: "none",
5677        stroke: "#bada55",
5678        strokeWidth: 5
5679    }).pattern(0, 0, 10, 10),
5680    c = paper.circle(200, 200, 100);
5681c.attr({
5682    fill: p
5683});</code></pre></section>
5684
5685
5686
5687
5688
5689                              </div>
5690                          </section>
5691                      </article>
5692
5693                      <article id="Element.marker">
5694                          <header>
5695                              <h3 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 628 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L628">&#x27ad;</a></h3>
5696                          </header>
5697                          <section>
5698                              <div class="extra" id="Element.marker-extra"></div>
5699                              <div class="dr-method">
5700
5701
5702
5703
5704                                  <p>Creates a <code>&lt;marker&gt;</code> element from the current element
5705To create a marker you have to specify the bounding rect and reference point:
5706</p>
5707
5708
5709
5710
5711
5712
5713
5714
5715
5716
5717                                  <div class="topcoat-list__container">
5718                                      <h3 class="topcoat-list__header">Parameters</h3>
5719                                      <ol class="topcoat-list">
5720                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
5721                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5722                                              <span class="dr-description"></span></li>
5723                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
5724                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5725                                              <span class="dr-description"></span></li>
5726                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
5727                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5728                                              <span class="dr-description"></span></li>
5729                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
5730                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5731                                              <span class="dr-description"></span></li>
5732                                          <li class="topcoat-list__item"><span class="dr-param">refX</span>
5733                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5734                                              <span class="dr-description"></span></li>
5735                                          <li class="topcoat-list__item"><span class="dr-param">refY</span>
5736                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5737                                              <span class="dr-description"></span></li>
5738
5739                                      </ol>
5740                                  </div>
5741
5742
5743
5744
5745
5746
5747
5748
5749
5750
5751
5752
5753
5754                                  <p class="dr-returns">
5755                                      <strong class="dr-title">Returns:</strong>
5756
5757                                      <em class="dr-type-Element">Element</em>
5758
5759                                      <span class="dr-description">the <code>&lt;marker&gt;</code> element</span>
5760                                  </p>
5761
5762
5763
5764
5765
5766                                  <p>You can specify the marker later as an argument for <code>marker-start</code>, <code>marker-end</code>, <code>marker-mid</code>, and <code>marker</code> attributes. The <code>marker</code> attribute places the marker at every point along the path, and <code>marker-mid</code> places them at every point except the start and end.
5767</p>
5768
5769
5770
5771
5772
5773
5774
5775
5776                              </div>
5777                          </section>
5778                      </article>
5779
5780                      <article id="Snap.animation">
5781                          <header>
5782                              <h3 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 687 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L687">&#x27ad;</a></h3>
5783                          </header>
5784                          <section>
5785                              <div class="extra" id="Snap.animation-extra"></div>
5786                              <div class="dr-method">
5787
5788
5789
5790
5791                                  <p>Creates an animation object
5792</p>
5793
5794
5795
5796
5797
5798
5799
5800
5801
5802
5803                                  <div class="topcoat-list__container">
5804                                      <h3 class="topcoat-list__header">Parameters</h3>
5805                                      <ol class="topcoat-list">
5806                                          <li class="topcoat-list__item"><span class="dr-param">attr</span>
5807                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
5808                                              <span class="dr-description">attributes of final destination</span></li>
5809                                          <li class="topcoat-list__item"><span class="dr-param">duration</span>
5810                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5811                                              <span class="dr-description">duration of the animation, in milliseconds</span></li>
5812                                          <li class="topcoat-list__item"><span class="dr-param">easing</span>
5813                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
5814                                              <span class="dr-description">one of easing functions of <a href="#mina" class="dr-link">mina</a> or custom one</span></li>
5815                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
5816                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
5817                                              <span class="dr-description">callback function that fires when animation ends</span></li>
5818
5819                                      </ol>
5820                                  </div>
5821
5822
5823
5824
5825
5826
5827
5828
5829
5830
5831
5832
5833
5834                                  <p class="dr-returns">
5835                                      <strong class="dr-title">Returns:</strong>
5836
5837                                      <em class="dr-type-object">object</em>
5838
5839                                      <span class="dr-description">animation object</span>
5840                                  </p>
5841
5842
5843
5844
5845                              </div>
5846                          </section>
5847                      </article>
5848
5849                      <article id="Element.inAnim">
5850                          <header>
5851                              <h3 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 705 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L705">&#x27ad;</a></h3>
5852                          </header>
5853                          <section>
5854                              <div class="extra" id="Element.inAnim-extra"></div>
5855                              <div class="dr-method">
5856
5857
5858
5859
5860                                  <p>Returns a set of animations that may be able to manipulate the current element
5861</p>
5862
5863
5864
5865
5866
5867
5868
5869
5870
5871
5872
5873
5874
5875
5876                                  <p class="dr-returns">
5877                                      <strong class="dr-title">Returns:</strong>
5878
5879                                      <em class="dr-type-object">object</em>
5880
5881                                      <span class="dr-description">in format:</span>
5882                                  </p>
5883
5884
5885
5886
5887
5888
5889
5890
5891
5892
5893
5894                                  <ol class="dr-json">
5895
5896
5897                                      <li>{<ol class="dr-json">
5898
5899
5900
5901                                      <li>
5902                                          <span class="dr-json-key">anim</span>
5903                                          <span class="dr-type"><em class="dr-type-object">object</em> </span>
5904                                          <span class="dr-json-description">animation object,</span>
5905                                      </li>
5906
5907
5908
5909                                      <li>
5910                                          <span class="dr-json-key">mina</span>
5911                                          <span class="dr-type"><em class="dr-type-object">object</em> </span>
5912                                          <span class="dr-json-description"><a href="#mina" class="dr-link">mina</a> object,</span>
5913                                      </li>
5914
5915
5916
5917                                      <li>
5918                                          <span class="dr-json-key">curStatus</span>
5919                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
5920                                          <span class="dr-json-description">0..1 — status of the animation: 0 — just started, 1 — just finished,</span>
5921                                      </li>
5922
5923
5924
5925                                      <li>
5926                                          <span class="dr-json-key">status</span>
5927                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
5928                                          <span class="dr-json-description">gets or sets the status of the animation,</span>
5929                                      </li>
5930
5931
5932
5933                                      <li>
5934                                          <span class="dr-json-key">stop</span>
5935                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
5936                                          <span class="dr-json-description">stops the animation</span>
5937                                      </li>
5938
5939
5940
5941                                      </ol></li><li>}</li>
5942
5943
5944                                  </ol>
5945
5946
5947                              </div>
5948                          </section>
5949                      </article>
5950
5951                      <article id="Snap.animate">
5952                          <header>
5953                              <h3 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 755 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L755">&#x27ad;</a></h3>
5954                          </header>
5955                          <section>
5956                              <div class="extra" id="Snap.animate-extra"></div>
5957                              <div class="dr-method">
5958
5959
5960
5961
5962                                  <p>Runs generic animation of one number into another with a caring function
5963</p>
5964
5965
5966
5967
5968
5969
5970
5971
5972
5973
5974                                  <div class="topcoat-list__container">
5975                                      <h3 class="topcoat-list__header">Parameters</h3>
5976                                      <ol class="topcoat-list">
5977                                          <li class="topcoat-list__item"><span class="dr-param">from</span>
5978                                              <span class="dr-type"><em class="dr-type-number">number</em> <em class="dr-type-array">array</em> </span>
5979                                              <span class="dr-description">number or array of numbers</span></li>
5980                                          <li class="topcoat-list__item"><span class="dr-param">to</span>
5981                                              <span class="dr-type"><em class="dr-type-number">number</em> <em class="dr-type-array">array</em> </span>
5982                                              <span class="dr-description">number or array of numbers</span></li>
5983                                          <li class="topcoat-list__item"><span class="dr-param">setter</span>
5984                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
5985                                              <span class="dr-description">caring function that accepts one number argument</span></li>
5986                                          <li class="topcoat-list__item"><span class="dr-param">duration</span>
5987                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
5988                                              <span class="dr-description">duration, in milliseconds</span></li>
5989                                          <li class="topcoat-list__item"><span class="dr-param">easing</span>
5990                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
5991                                              <span class="dr-description">easing function from <a href="#mina" class="dr-link">mina</a> or custom</span></li>
5992                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
5993                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
5994                                              <span class="dr-description">callback function to execute when animation ends</span></li>
5995
5996                                      </ol>
5997                                  </div>
5998
5999
6000
6001
6002
6003
6004
6005
6006
6007
6008
6009
6010
6011                                  <p class="dr-returns">
6012                                      <strong class="dr-title">Returns:</strong>
6013
6014                                      <em class="dr-type-object">object</em>
6015
6016                                      <span class="dr-description">animation object in <a href="#mina" class="dr-link">mina</a> format</span>
6017                                  </p>
6018
6019
6020
6021
6022
6023
6024
6025
6026
6027
6028
6029                                  <ol class="dr-json">
6030
6031
6032                                      <li>{<ol class="dr-json">
6033
6034
6035
6036                                      <li>
6037                                          <span class="dr-json-key">id</span>
6038                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
6039                                          <span class="dr-json-description">animation id, consider it read-only,</span>
6040                                      </li>
6041
6042
6043
6044                                      <li>
6045                                          <span class="dr-json-key">duration</span>
6046                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
6047                                          <span class="dr-json-description">gets or sets the duration of the animation,</span>
6048                                      </li>
6049
6050
6051
6052                                      <li>
6053                                          <span class="dr-json-key">easing</span>
6054                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
6055                                          <span class="dr-json-description">easing,</span>
6056                                      </li>
6057
6058
6059
6060                                      <li>
6061                                          <span class="dr-json-key">speed</span>
6062                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
6063                                          <span class="dr-json-description">gets or sets the speed of the animation,</span>
6064                                      </li>
6065
6066
6067
6068                                      <li>
6069                                          <span class="dr-json-key">status</span>
6070                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
6071                                          <span class="dr-json-description">gets or sets the status of the animation,</span>
6072                                      </li>
6073
6074
6075
6076                                      <li>
6077                                          <span class="dr-json-key">stop</span>
6078                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
6079                                          <span class="dr-json-description">stops the animation</span>
6080                                      </li>
6081
6082
6083
6084                                      </ol></li><li>}</li>
6085
6086
6087                                  </ol>
6088
6089
6090
6091
6092
6093
6094
6095                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var rect = Snap().rect(0, 0, 10, 10);
6096Snap.animate(0, 10, function (val) {
6097    rect.attr({
6098        x: val
6099    });
6100}, 1000);
6101// in given context is equivalent to
6102rect.animate({x: 10}, 1000);</code></pre></section>
6103
6104
6105
6106
6107
6108                              </div>
6109                          </section>
6110                      </article>
6111
6112                      <article id="Element.stop">
6113                          <header>
6114                              <h3 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 773 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L773">&#x27ad;</a></h3>
6115                          </header>
6116                          <section>
6117                              <div class="extra" id="Element.stop-extra"></div>
6118                              <div class="dr-method">
6119
6120
6121
6122
6123                                  <p>Stops all the animations for the current element
6124</p>
6125
6126
6127
6128
6129
6130
6131
6132
6133
6134
6135
6136
6137
6138
6139                                  <p class="dr-returns">
6140                                      <strong class="dr-title">Returns:</strong>
6141
6142                                      <em class="dr-type-Element">Element</em>
6143
6144                                      <span class="dr-description">the current element</span>
6145                                  </p>
6146
6147
6148
6149
6150                              </div>
6151                          </section>
6152                      </article>
6153
6154                      <article id="Element.animate">
6155                          <header>
6156                              <h3 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 792 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L792">&#x27ad;</a></h3>
6157                          </header>
6158                          <section>
6159                              <div class="extra" id="Element.animate-extra"></div>
6160                              <div class="dr-method">
6161
6162
6163
6164
6165                                  <p>Animates the given attributes of the element
6166</p>
6167
6168
6169
6170
6171
6172
6173
6174
6175
6176
6177                                  <div class="topcoat-list__container">
6178                                      <h3 class="topcoat-list__header">Parameters</h3>
6179                                      <ol class="topcoat-list">
6180                                          <li class="topcoat-list__item"><span class="dr-param">attrs</span>
6181                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
6182                                              <span class="dr-description">key-value pairs of destination attributes</span></li>
6183                                          <li class="topcoat-list__item"><span class="dr-param">duration</span>
6184                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6185                                              <span class="dr-description">duration of the animation in milliseconds</span></li>
6186                                          <li class="topcoat-list__item"><span class="dr-param">easing</span>
6187                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
6188                                              <span class="dr-description">easing function from <a href="#mina" class="dr-link">mina</a> or custom</span></li>
6189                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
6190                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
6191                                              <span class="dr-description">callback function that executes when the animation ends</span></li>
6192
6193                                      </ol>
6194                                  </div>
6195
6196
6197
6198
6199
6200
6201
6202
6203
6204
6205
6206
6207
6208                                  <p class="dr-returns">
6209                                      <strong class="dr-title">Returns:</strong>
6210
6211                                      <em class="dr-type-Element">Element</em>
6212
6213                                      <span class="dr-description">the current element</span>
6214                                  </p>
6215
6216
6217
6218
6219                              </div>
6220                          </section>
6221                      </article>
6222
6223                      <article id="Element.data">
6224                          <header>
6225                              <h3 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 865 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L865">&#x27ad;</a></h3>
6226                          </header>
6227                          <section>
6228                              <div class="extra" id="Element.data-extra"></div>
6229                              <div class="dr-method">
6230
6231
6232
6233
6234                                  <p>Adds or retrieves given value associated with given key. (Don’t confuse
6235with <code>data-</code> attributes)
6236</p><p>See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
6237</p>
6238
6239
6240
6241
6242
6243
6244
6245
6246
6247
6248                                  <div class="topcoat-list__container">
6249                                      <h3 class="topcoat-list__header">Parameters</h3>
6250                                      <ol class="topcoat-list">
6251                                          <li class="topcoat-list__item"><span class="dr-param">key</span>
6252                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
6253                                              <span class="dr-description">key to store data</span></li>
6254                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
6255                                              <span class="dr-type"><em class="dr-type-any">any</em> </span>
6256                                              <span class="dr-description">value to store</span></li>
6257
6258                                      </ol>
6259                                  </div>
6260
6261
6262
6263
6264
6265
6266
6267
6268
6269
6270
6271
6272
6273                                  <p class="dr-returns">
6274                                      <strong class="dr-title">Returns:</strong>
6275
6276                                      <em class="dr-type-object">object</em>
6277
6278                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
6279                                  </p>
6280
6281
6282
6283
6284
6285                                  <p>or, if value is not specified:
6286</p>
6287
6288
6289
6290
6291
6292
6293
6294
6295
6296
6297
6298
6299
6300
6301                                  <p class="dr-returns">
6302                                      <strong class="dr-title">Returns:</strong>
6303
6304                                      <em class="dr-type-any">any</em>
6305
6306                                      <span class="dr-description">value</span>
6307                                  </p>
6308
6309
6310
6311
6312
6313
6314
6315
6316                                  <h3>Usage</h3>
6317
6318
6319
6320
6321
6322
6323
6324
6325
6326
6327
6328                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">for (var i = 0, i < 5, i++) {
6329    paper.circle(10 + 15 * i, 10, 10)
6330         .attr({fill: "#000"})
6331         .data("i", i)
6332         .click(function () {
6333            alert(this.data("i"));
6334         });
6335}</code></pre></section>
6336
6337
6338
6339
6340
6341                              </div>
6342                          </section>
6343                      </article>
6344
6345                      <article id="Element.removeData">
6346                          <header>
6347                              <h3 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 894 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L894">&#x27ad;</a></h3>
6348                          </header>
6349                          <section>
6350                              <div class="extra" id="Element.removeData-extra"></div>
6351                              <div class="dr-method">
6352
6353
6354
6355
6356                                  <p>Removes value associated with an element by given key.
6357If key is not provided, removes all the data of the element.
6358</p>
6359
6360
6361
6362
6363
6364
6365
6366
6367
6368
6369                                  <div class="topcoat-list__container">
6370                                      <h3 class="topcoat-list__header">Parameters</h3>
6371                                      <ol class="topcoat-list">
6372                                          <li class="topcoat-list__item"><span class="dr-param">key</span>
6373                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
6374                                              <span class="dr-description">key</span></li>
6375
6376                                      </ol>
6377                                  </div>
6378
6379
6380
6381
6382
6383
6384
6385
6386
6387
6388
6389
6390
6391                                  <p class="dr-returns">
6392                                      <strong class="dr-title">Returns:</strong>
6393
6394                                      <em class="dr-type-object">object</em>
6395
6396                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
6397                                  </p>
6398
6399
6400
6401
6402                              </div>
6403                          </section>
6404                      </article>
6405
6406                      <article id="Element.outerSVG">
6407                          <header>
6408                              <h3 class="dr-method">Element.outerSVG()<a href="#Element.outerSVG" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 911 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L911">&#x27ad;</a></h3>
6409                          </header>
6410                          <section>
6411                              <div class="extra" id="Element.outerSVG-extra"></div>
6412                              <div class="dr-method">
6413
6414
6415
6416
6417                                  <p>Returns SVG code for the element, equivalent to HTML&#39;s <code>outerHTML</code>.
6418</p><p>See also <a href="#Element.innerSVG" class="dr-link">Element.innerSVG</a>
6419</p>
6420
6421
6422
6423
6424
6425
6426
6427
6428
6429
6430
6431
6432
6433
6434                                  <p class="dr-returns">
6435                                      <strong class="dr-title">Returns:</strong>
6436
6437                                      <em class="dr-type-string">string</em>
6438
6439                                      <span class="dr-description">SVG code for the element</span>
6440                                  </p>
6441
6442
6443
6444
6445                              </div>
6446                          </section>
6447                      </article>
6448
6449                      <article id="Element.toString">
6450                          <header>
6451                              <h3 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 917 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L917">&#x27ad;</a></h3>
6452                          </header>
6453                          <section>
6454                              <div class="extra" id="Element.toString-extra"></div>
6455                              <div class="dr-method">
6456
6457
6458
6459
6460                                  <p>See <a href="#Element.outerSVG" class="dr-link">Element.outerSVG</a>
6461</p>
6462
6463
6464
6465
6466
6467
6468
6469
6470                              </div>
6471                          </section>
6472                      </article>
6473
6474                      <article id="Element.innerSVG">
6475                          <header>
6476                              <h3 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 925 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L925">&#x27ad;</a></h3>
6477                          </header>
6478                          <section>
6479                              <div class="extra" id="Element.innerSVG-extra"></div>
6480                              <div class="dr-method">
6481
6482
6483
6484
6485                                  <p>Returns SVG code for the element&#39;s contents, equivalent to HTML&#39;s <code>innerHTML</code>
6486</p>
6487
6488
6489
6490
6491
6492
6493
6494
6495
6496
6497
6498
6499
6500
6501                                  <p class="dr-returns">
6502                                      <strong class="dr-title">Returns:</strong>
6503
6504                                      <em class="dr-type-string">string</em>
6505
6506                                      <span class="dr-description">SVG code for the element</span>
6507                                  </p>
6508
6509
6510
6511
6512                              </div>
6513                          </section>
6514                      </article>
6515
6516                      <article id="Fragment.select">
6517                          <header>
6518                              <h3 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 972 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L972">&#x27ad;</a></h3>
6519                          </header>
6520                          <section>
6521                              <div class="extra" id="Fragment.select-extra"></div>
6522                              <div class="dr-method">
6523
6524
6525
6526
6527                                  <p>See <a href="#Element.select" class="dr-link">Element.select</a>
6528</p>
6529
6530
6531
6532
6533
6534
6535
6536
6537                              </div>
6538                          </section>
6539                      </article>
6540
6541                      <article id="Fragment.selectAll">
6542                          <header>
6543                              <h3 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 979 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L979">&#x27ad;</a></h3>
6544                          </header>
6545                          <section>
6546                              <div class="extra" id="Fragment.selectAll-extra"></div>
6547                              <div class="dr-method">
6548
6549
6550
6551
6552                                  <p>See <a href="#Element.selectAll" class="dr-link">Element.selectAll</a>
6553</p>
6554
6555
6556
6557
6558
6559
6560
6561
6562                              </div>
6563                          </section>
6564                      </article>
6565
6566                      <article id="Matrix.add">
6567                          <header>
6568                              <h3 class="dr-method">Matrix.add(…)<a href="#Matrix.add" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 60 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L60">&#x27ad;</a></h3>
6569                          </header>
6570                          <section>
6571                              <div class="extra" id="Matrix.add-extra"></div>
6572                              <div class="dr-method">
6573
6574
6575
6576
6577                                  <p>Adds the given matrix to existing one
6578</p>
6579
6580
6581
6582
6583
6584
6585
6586
6587
6588
6589                                  <div class="topcoat-list__container">
6590                                      <h3 class="topcoat-list__header">Parameters</h3>
6591                                      <ol class="topcoat-list">
6592                                          <li class="topcoat-list__item"><span class="dr-param">a</span>
6593                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6594                                              <span class="dr-description"></span></li>
6595                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
6596                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6597                                              <span class="dr-description"></span></li>
6598                                          <li class="topcoat-list__item"><span class="dr-param">c</span>
6599                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6600                                              <span class="dr-description"></span></li>
6601                                          <li class="topcoat-list__item"><span class="dr-param">d</span>
6602                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6603                                              <span class="dr-description"></span></li>
6604                                          <li class="topcoat-list__item"><span class="dr-param">e</span>
6605                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6606                                              <span class="dr-description"></span></li>
6607                                          <li class="topcoat-list__item"><span class="dr-param">f</span>
6608                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6609                                              <span class="dr-description"></span></li>
6610
6611                                      </ol>
6612                                  </div>
6613
6614
6615
6616
6617
6618
6619
6620
6621                                  <p>or
6622</p>
6623
6624
6625
6626
6627
6628
6629
6630
6631
6632
6633                                  <div class="topcoat-list__container">
6634                                      <h3 class="topcoat-list__header">Parameters</h3>
6635                                      <ol class="topcoat-list">
6636                                          <li class="topcoat-list__item"><span class="dr-param">matrix</span>
6637                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
6638                                              <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span></li>
6639
6640                                      </ol>
6641                                  </div>
6642
6643
6644
6645
6646
6647
6648
6649                              </div>
6650                          </section>
6651                      </article>
6652
6653                      <article id="Matrix.invert">
6654                          <header>
6655                              <h3 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 94 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L94">&#x27ad;</a></h3>
6656                          </header>
6657                          <section>
6658                              <div class="extra" id="Matrix.invert-extra"></div>
6659                              <div class="dr-method">
6660
6661
6662
6663
6664                                  <p>Returns an inverted version of the matrix
6665</p>
6666
6667
6668
6669
6670
6671
6672
6673
6674
6675
6676
6677
6678
6679
6680                                  <p class="dr-returns">
6681                                      <strong class="dr-title">Returns:</strong>
6682
6683                                      <em class="dr-type-object">object</em>
6684
6685                                      <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span>
6686                                  </p>
6687
6688
6689
6690
6691                              </div>
6692                          </section>
6693                      </article>
6694
6695                      <article id="Matrix.clone">
6696                          <header>
6697                              <h3 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 106 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L106">&#x27ad;</a></h3>
6698                          </header>
6699                          <section>
6700                              <div class="extra" id="Matrix.clone-extra"></div>
6701                              <div class="dr-method">
6702
6703
6704
6705
6706                                  <p>Returns a copy of the matrix
6707</p>
6708
6709
6710
6711
6712
6713
6714
6715
6716
6717
6718
6719
6720
6721
6722                                  <p class="dr-returns">
6723                                      <strong class="dr-title">Returns:</strong>
6724
6725                                      <em class="dr-type-object">object</em>
6726
6727                                      <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span>
6728                                  </p>
6729
6730
6731
6732
6733                              </div>
6734                          </section>
6735                      </article>
6736
6737                      <article id="Matrix.translate">
6738                          <header>
6739                              <h3 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 117 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L117">&#x27ad;</a></h3>
6740                          </header>
6741                          <section>
6742                              <div class="extra" id="Matrix.translate-extra"></div>
6743                              <div class="dr-method">
6744
6745
6746
6747
6748                                  <p>Translate the matrix
6749</p>
6750
6751
6752
6753
6754
6755
6756
6757
6758
6759
6760                                  <div class="topcoat-list__container">
6761                                      <h3 class="topcoat-list__header">Parameters</h3>
6762                                      <ol class="topcoat-list">
6763                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
6764                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6765                                              <span class="dr-description">horizontal offset distance</span></li>
6766                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
6767                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6768                                              <span class="dr-description">vertical offset distance</span></li>
6769
6770                                      </ol>
6771                                  </div>
6772
6773
6774
6775
6776
6777
6778
6779                              </div>
6780                          </section>
6781                      </article>
6782
6783                      <article id="Matrix.scale">
6784                          <header>
6785                              <h3 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 131 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L131">&#x27ad;</a></h3>
6786                          </header>
6787                          <section>
6788                              <div class="extra" id="Matrix.scale-extra"></div>
6789                              <div class="dr-method">
6790
6791
6792
6793
6794                                  <p>Scales the matrix
6795</p>
6796
6797
6798
6799
6800
6801
6802
6803
6804
6805
6806                                  <div class="topcoat-list__container">
6807                                      <h3 class="topcoat-list__header">Parameters</h3>
6808                                      <ol class="topcoat-list">
6809                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
6810                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6811                                              <span class="dr-description">amount to be scaled, with <code>1</code> resulting in no change</span></li>
6812                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
6813                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6814                                              <span class="dr-description">amount to scale along the vertical axis. (Otherwise <code>x</code> applies to both axes.)</span></li>
6815                                          <li class="topcoat-list__item"><span class="dr-param">cx</span>
6816                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6817                                              <span class="dr-description">horizontal origin point from which to scale</span></li>
6818                                          <li class="topcoat-list__item"><span class="dr-param">cy</span>
6819                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6820                                              <span class="dr-description">vertical origin point from which to scale</span></li>
6821
6822                                      </ol>
6823                                  </div>
6824
6825
6826
6827
6828
6829
6830
6831
6832                                  <p>Default cx, cy is the middle point of the element.
6833</p>
6834
6835
6836
6837
6838
6839
6840
6841
6842                              </div>
6843                          </section>
6844                      </article>
6845
6846                      <article id="Matrix.rotate">
6847                          <header>
6848                              <h3 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 147 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L147">&#x27ad;</a></h3>
6849                          </header>
6850                          <section>
6851                              <div class="extra" id="Matrix.rotate-extra"></div>
6852                              <div class="dr-method">
6853
6854
6855
6856
6857                                  <p>Rotates the matrix
6858</p>
6859
6860
6861
6862
6863
6864
6865
6866
6867
6868
6869                                  <div class="topcoat-list__container">
6870                                      <h3 class="topcoat-list__header">Parameters</h3>
6871                                      <ol class="topcoat-list">
6872                                          <li class="topcoat-list__item"><span class="dr-param">a</span>
6873                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6874                                              <span class="dr-description">angle of rotation, in degrees</span></li>
6875                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
6876                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6877                                              <span class="dr-description">horizontal origin point from which to rotate</span></li>
6878                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
6879                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6880                                              <span class="dr-description">vertical origin point from which to rotate</span></li>
6881
6882                                      </ol>
6883                                  </div>
6884
6885
6886
6887
6888
6889
6890
6891                              </div>
6892                          </section>
6893                      </article>
6894
6895                      <article id="Matrix.x">
6896                          <header>
6897                              <h3 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 165 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L165">&#x27ad;</a></h3>
6898                          </header>
6899                          <section>
6900                              <div class="extra" id="Matrix.x-extra"></div>
6901                              <div class="dr-method">
6902
6903
6904
6905
6906                                  <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>
6907</p>
6908
6909
6910
6911
6912
6913
6914
6915
6916
6917
6918                                  <div class="topcoat-list__container">
6919                                      <h3 class="topcoat-list__header">Parameters</h3>
6920                                      <ol class="topcoat-list">
6921                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
6922                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6923                                              <span class="dr-description"></span></li>
6924                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
6925                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6926                                              <span class="dr-description"></span></li>
6927
6928                                      </ol>
6929                                  </div>
6930
6931
6932
6933
6934
6935
6936
6937
6938
6939
6940
6941
6942
6943                                  <p class="dr-returns">
6944                                      <strong class="dr-title">Returns:</strong>
6945
6946                                      <em class="dr-type-number">number</em>
6947
6948                                      <span class="dr-description">x</span>
6949                                  </p>
6950
6951
6952
6953
6954                              </div>
6955                          </section>
6956                      </article>
6957
6958                      <article id="Matrix.y">
6959                          <header>
6960                              <h3 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 177 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L177">&#x27ad;</a></h3>
6961                          </header>
6962                          <section>
6963                              <div class="extra" id="Matrix.y-extra"></div>
6964                              <div class="dr-method">
6965
6966
6967
6968
6969                                  <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>
6970</p>
6971
6972
6973
6974
6975
6976
6977
6978
6979
6980
6981                                  <div class="topcoat-list__container">
6982                                      <h3 class="topcoat-list__header">Parameters</h3>
6983                                      <ol class="topcoat-list">
6984                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
6985                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6986                                              <span class="dr-description"></span></li>
6987                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
6988                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
6989                                              <span class="dr-description"></span></li>
6990
6991                                      </ol>
6992                                  </div>
6993
6994
6995
6996
6997
6998
6999
7000
7001
7002
7003
7004
7005
7006                                  <p class="dr-returns">
7007                                      <strong class="dr-title">Returns:</strong>
7008
7009                                      <em class="dr-type-number">number</em>
7010
7011                                      <span class="dr-description">y</span>
7012                                  </p>
7013
7014
7015
7016
7017                              </div>
7018                          </section>
7019                      </article>
7020
7021                      <article id="Matrix.determinant">
7022                          <header>
7023                              <h3 class="dr-method">Matrix.determinant()<a href="#Matrix.determinant" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 204 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L204">&#x27ad;</a></h3>
7024                          </header>
7025                          <section>
7026                              <div class="extra" id="Matrix.determinant-extra"></div>
7027                              <div class="dr-method">
7028
7029
7030
7031
7032                                  <p>Finds determinant of the given matrix.
7033</p>
7034
7035
7036
7037
7038
7039
7040
7041
7042
7043
7044
7045
7046
7047
7048                                  <p class="dr-returns">
7049                                      <strong class="dr-title">Returns:</strong>
7050
7051                                      <em class="dr-type-number">number</em>
7052
7053                                      <span class="dr-description">determinant</span>
7054                                  </p>
7055
7056
7057
7058
7059                              </div>
7060                          </section>
7061                      </article>
7062
7063                      <article id="Matrix.split">
7064                          <header>
7065                              <h3 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 221 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L221">&#x27ad;</a></h3>
7066                          </header>
7067                          <section>
7068                              <div class="extra" id="Matrix.split-extra"></div>
7069                              <div class="dr-method">
7070
7071
7072
7073
7074                                  <p>Splits matrix into primitive transformations
7075</p>
7076
7077
7078
7079
7080
7081
7082
7083
7084
7085
7086
7087
7088
7089
7090                                  <p class="dr-returns">
7091                                      <strong class="dr-title">Returns:</strong>
7092
7093                                      <em class="dr-type-object">object</em>
7094
7095                                      <span class="dr-description">in format:</span>
7096                                  </p>
7097
7098
7099
7100
7101
7102
7103
7104
7105
7106
7107
7108                                  <ol class="dr-json">
7109
7110
7111                                      <li>
7112                                          <span class="dr-json-key">dx</span>
7113                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
7114                                          <span class="dr-json-description">translation by x</span>
7115                                      </li>
7116
7117
7118
7119                                      <li>
7120                                          <span class="dr-json-key">dy</span>
7121                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
7122                                          <span class="dr-json-description">translation by y</span>
7123                                      </li>
7124
7125
7126
7127                                      <li>
7128                                          <span class="dr-json-key">scalex</span>
7129                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
7130                                          <span class="dr-json-description">scale by x</span>
7131                                      </li>
7132
7133
7134
7135                                      <li>
7136                                          <span class="dr-json-key">scaley</span>
7137                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
7138                                          <span class="dr-json-description">scale by y</span>
7139                                      </li>
7140
7141
7142
7143                                      <li>
7144                                          <span class="dr-json-key">shear</span>
7145                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
7146                                          <span class="dr-json-description">shear</span>
7147                                      </li>
7148
7149
7150
7151                                      <li>
7152                                          <span class="dr-json-key">rotate</span>
7153                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
7154                                          <span class="dr-json-description">rotation in deg</span>
7155                                      </li>
7156
7157
7158
7159                                      <li>
7160                                          <span class="dr-json-key">isSimple</span>
7161                                          <span class="dr-type"><em class="dr-type-boolean">boolean</em> </span>
7162                                          <span class="dr-json-description">could it be represented via simple transformations</span>
7163                                      </li>
7164
7165
7166                                  </ol>
7167
7168
7169                              </div>
7170                          </section>
7171                      </article>
7172
7173                      <article id="Matrix.toTransformString">
7174                          <header>
7175                              <h3 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 267 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L267">&#x27ad;</a></h3>
7176                          </header>
7177                          <section>
7178                              <div class="extra" id="Matrix.toTransformString-extra"></div>
7179                              <div class="dr-method">
7180
7181
7182
7183
7184                                  <p>Returns transform string that represents given matrix
7185</p>
7186
7187
7188
7189
7190
7191
7192
7193
7194
7195
7196
7197
7198
7199
7200                                  <p class="dr-returns">
7201                                      <strong class="dr-title">Returns:</strong>
7202
7203                                      <em class="dr-type-string">string</em>
7204
7205                                      <span class="dr-description">transform string</span>
7206                                  </p>
7207
7208
7209
7210
7211                              </div>
7212                          </section>
7213                      </article>
7214
7215                      <article id="Snap.Matrix">
7216                          <header>
7217                              <h3 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 288 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L288">&#x27ad;</a></h3>
7218                          </header>
7219                          <section>
7220                              <div class="extra" id="Snap.Matrix-extra"></div>
7221                              <div class="dr-method">
7222
7223
7224
7225
7226                                  <p>Matrix constructor, extend on your own risk.
7227To create matrices use <a href="#Snap.matrix" class="dr-link">Snap.matrix</a>.
7228</p>
7229
7230
7231
7232
7233
7234
7235
7236
7237                              </div>
7238                          </section>
7239                      </article>
7240
7241                      <article id="Snap.matrix">
7242                          <header>
7243                              <h3 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 306 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L306">&#x27ad;</a></h3>
7244                          </header>
7245                          <section>
7246                              <div class="extra" id="Snap.matrix-extra"></div>
7247                              <div class="dr-method">
7248
7249
7250
7251
7252                                  <p>Utility method
7253Returns a matrix based on the given parameters
7254</p>
7255
7256
7257
7258
7259
7260
7261
7262
7263
7264
7265                                  <div class="topcoat-list__container">
7266                                      <h3 class="topcoat-list__header">Parameters</h3>
7267                                      <ol class="topcoat-list">
7268                                          <li class="topcoat-list__item"><span class="dr-param">a</span>
7269                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7270                                              <span class="dr-description"></span></li>
7271                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
7272                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7273                                              <span class="dr-description"></span></li>
7274                                          <li class="topcoat-list__item"><span class="dr-param">c</span>
7275                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7276                                              <span class="dr-description"></span></li>
7277                                          <li class="topcoat-list__item"><span class="dr-param">d</span>
7278                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7279                                              <span class="dr-description"></span></li>
7280                                          <li class="topcoat-list__item"><span class="dr-param">e</span>
7281                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7282                                              <span class="dr-description"></span></li>
7283                                          <li class="topcoat-list__item"><span class="dr-param">f</span>
7284                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7285                                              <span class="dr-description"></span></li>
7286
7287                                      </ol>
7288                                  </div>
7289
7290
7291
7292
7293
7294
7295
7296
7297                                  <p>or
7298</p>
7299
7300
7301
7302
7303
7304
7305
7306
7307
7308
7309                                  <div class="topcoat-list__container">
7310                                      <h3 class="topcoat-list__header">Parameters</h3>
7311                                      <ol class="topcoat-list">
7312                                          <li class="topcoat-list__item"><span class="dr-param">svgMatrix</span>
7313                                              <span class="dr-type"><em class="dr-type-SVGMatrix">SVGMatrix</em> </span>
7314                                              <span class="dr-description"></span></li>
7315
7316                                      </ol>
7317                                  </div>
7318
7319
7320
7321
7322
7323
7324
7325
7326
7327
7328
7329
7330
7331                                  <p class="dr-returns">
7332                                      <strong class="dr-title">Returns:</strong>
7333
7334                                      <em class="dr-type-object">object</em>
7335
7336                                      <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span>
7337                                  </p>
7338
7339
7340
7341
7342                              </div>
7343                          </section>
7344                      </article>
7345
7346                      <article id="Paper.rect">
7347                          <header>
7348                              <h3 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 37 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L37">&#x27ad;</a></h3>
7349                          </header>
7350                          <section>
7351                              <div class="extra" id="Paper.rect-extra"></div>
7352                              <div class="dr-method">
7353
7354
7355
7356
7357                                  <p></p><p>Draws a rectangle
7358</p>
7359
7360
7361
7362
7363
7364
7365
7366
7367
7368
7369                                  <div class="topcoat-list__container">
7370                                      <h3 class="topcoat-list__header">Parameters</h3>
7371                                      <ol class="topcoat-list">
7372                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
7373                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7374                                              <span class="dr-description">x coordinate of the top left corner</span></li>
7375                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
7376                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7377                                              <span class="dr-description">y coordinate of the top left corner</span></li>
7378                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
7379                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7380                                              <span class="dr-description">width</span></li>
7381                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
7382                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7383                                              <span class="dr-description">height</span></li>
7384                                          <li class="topcoat-list__item"><span class="dr-param">rx</span>
7385                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7386                                              <span class="dr-description">horizontal radius for rounded corners, default is 0</span></li>
7387                                          <li class="topcoat-list__item"><span class="dr-param">ry</span>
7388                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7389                                              <span class="dr-description">vertical radius for rounded corners, default is rx or 0</span></li>
7390
7391                                      </ol>
7392                                  </div>
7393
7394
7395
7396
7397
7398
7399
7400
7401
7402
7403
7404
7405
7406                                  <p class="dr-returns">
7407                                      <strong class="dr-title">Returns:</strong>
7408
7409                                      <em class="dr-type-object">object</em>
7410
7411                                      <span class="dr-description">the <code>rect</code> element</span>
7412                                  </p>
7413
7414
7415
7416
7417
7418
7419
7420
7421                                  <h3>Usage</h3>
7422
7423
7424
7425
7426
7427
7428
7429
7430
7431
7432
7433                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">// regular rectangle
7434var c = paper.rect(10, 10, 50, 50);
7435// rectangle with rounded corners
7436var c = paper.rect(40, 40, 50, 50, 10);</code></pre></section>
7437
7438
7439
7440
7441
7442                              </div>
7443                          </section>
7444                      </article>
7445
7446                      <article id="Paper.circle">
7447                          <header>
7448                              <h3 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 72 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L72">&#x27ad;</a></h3>
7449                          </header>
7450                          <section>
7451                              <div class="extra" id="Paper.circle-extra"></div>
7452                              <div class="dr-method">
7453
7454
7455
7456
7457                                  <p>Draws a circle
7458</p>
7459
7460
7461
7462
7463
7464
7465
7466
7467
7468
7469                                  <div class="topcoat-list__container">
7470                                      <h3 class="topcoat-list__header">Parameters</h3>
7471                                      <ol class="topcoat-list">
7472                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
7473                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7474                                              <span class="dr-description">x coordinate of the centre</span></li>
7475                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
7476                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7477                                              <span class="dr-description">y coordinate of the centre</span></li>
7478                                          <li class="topcoat-list__item"><span class="dr-param">r</span>
7479                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7480                                              <span class="dr-description">radius</span></li>
7481
7482                                      </ol>
7483                                  </div>
7484
7485
7486
7487
7488
7489
7490
7491
7492
7493
7494
7495
7496
7497                                  <p class="dr-returns">
7498                                      <strong class="dr-title">Returns:</strong>
7499
7500                                      <em class="dr-type-object">object</em>
7501
7502                                      <span class="dr-description">the <code>circle</code> element</span>
7503                                  </p>
7504
7505
7506
7507
7508
7509
7510
7511
7512                                  <h3>Usage</h3>
7513
7514
7515
7516
7517
7518
7519
7520
7521
7522
7523
7524                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.circle(50, 50, 40);</code></pre></section>
7525
7526
7527
7528
7529
7530                              </div>
7531                          </section>
7532                      </article>
7533
7534                      <article id="Paper.image">
7535                          <header>
7536                              <h3 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 123 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L123">&#x27ad;</a></h3>
7537                          </header>
7538                          <section>
7539                              <div class="extra" id="Paper.image-extra"></div>
7540                              <div class="dr-method">
7541
7542
7543
7544
7545                                  <p>Places an image on the surface
7546</p>
7547
7548
7549
7550
7551
7552
7553
7554
7555
7556
7557                                  <div class="topcoat-list__container">
7558                                      <h3 class="topcoat-list__header">Parameters</h3>
7559                                      <ol class="topcoat-list">
7560                                          <li class="topcoat-list__item"><span class="dr-param">src</span>
7561                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
7562                                              <span class="dr-description">URI of the source image</span></li>
7563                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
7564                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7565                                              <span class="dr-description">x offset position</span></li>
7566                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
7567                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7568                                              <span class="dr-description">y offset position</span></li>
7569                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
7570                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7571                                              <span class="dr-description">width of the image</span></li>
7572                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
7573                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7574                                              <span class="dr-description">height of the image</span></li>
7575
7576                                      </ol>
7577                                  </div>
7578
7579
7580
7581
7582
7583
7584
7585
7586
7587
7588
7589
7590
7591                                  <p class="dr-returns">
7592                                      <strong class="dr-title">Returns:</strong>
7593
7594                                      <em class="dr-type-object">object</em>
7595
7596                                      <span class="dr-description">the <code>image</code> element</span>
7597                                  </p>
7598
7599
7600
7601
7602
7603                                  <p>or
7604</p>
7605
7606
7607
7608
7609
7610
7611
7612
7613
7614
7615
7616
7617
7618
7619                                  <p class="dr-returns">
7620                                      <strong class="dr-title">Returns:</strong>
7621
7622                                      <em class="dr-type-object">object</em>
7623
7624                                      <span class="dr-description">Snap element object with type <code>image</code></span>
7625                                  </p>
7626
7627
7628
7629
7630
7631
7632
7633
7634                                  <h3>Usage</h3>
7635
7636
7637
7638
7639
7640
7641
7642
7643
7644
7645
7646                                  <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>
7647
7648
7649
7650
7651
7652                              </div>
7653                          </section>
7654                      </article>
7655
7656                      <article id="Paper.ellipse">
7657                          <header>
7658                              <h3 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 166 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L166">&#x27ad;</a></h3>
7659                          </header>
7660                          <section>
7661                              <div class="extra" id="Paper.ellipse-extra"></div>
7662                              <div class="dr-method">
7663
7664
7665
7666
7667                                  <p>Draws an ellipse
7668</p>
7669
7670
7671
7672
7673
7674
7675
7676
7677
7678
7679                                  <div class="topcoat-list__container">
7680                                      <h3 class="topcoat-list__header">Parameters</h3>
7681                                      <ol class="topcoat-list">
7682                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
7683                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7684                                              <span class="dr-description">x coordinate of the centre</span></li>
7685                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
7686                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7687                                              <span class="dr-description">y coordinate of the centre</span></li>
7688                                          <li class="topcoat-list__item"><span class="dr-param">rx</span>
7689                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7690                                              <span class="dr-description">horizontal radius</span></li>
7691                                          <li class="topcoat-list__item"><span class="dr-param">ry</span>
7692                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
7693                                              <span class="dr-description">vertical radius</span></li>
7694
7695                                      </ol>
7696                                  </div>
7697
7698
7699
7700
7701
7702
7703
7704
7705
7706
7707
7708
7709
7710                                  <p class="dr-returns">
7711                                      <strong class="dr-title">Returns:</strong>
7712
7713                                      <em class="dr-type-object">object</em>
7714
7715                                      <span class="dr-description">the <code>ellipse</code> element</span>
7716                                  </p>
7717
7718
7719
7720
7721
7722
7723
7724
7725                                  <h3>Usage</h3>
7726
7727
7728
7729
7730
7731
7732
7733
7734
7735
7736
7737                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.ellipse(50, 50, 40, 20);</code></pre></section>
7738
7739
7740
7741
7742
7743                              </div>
7744                          </section>
7745                      </article>
7746
7747                      <article id="Paper.path">
7748                          <header>
7749                              <h3 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 211 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L211">&#x27ad;</a></h3>
7750                          </header>
7751                          <section>
7752                              <div class="extra" id="Paper.path-extra"></div>
7753                              <div class="dr-method">
7754
7755
7756
7757
7758                                  <p>Creates a <code>&lt;path&gt;</code> element using the given string as the path&#39;s definition
7759</p>
7760
7761
7762
7763
7764
7765
7766
7767
7768
7769
7770                                  <div class="topcoat-list__container">
7771                                      <h3 class="topcoat-list__header">Parameters</h3>
7772                                      <ol class="topcoat-list">
7773                                          <li class="topcoat-list__item"><span class="dr-param">pathString</span>
7774                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
7775                                              <span class="dr-description">path string in SVG format</span></li>
7776
7777                                      </ol>
7778                                  </div>
7779
7780
7781
7782
7783
7784
7785
7786
7787                                  <p>Path string consists of one-letter commands, followed by comma seprarated arguments in numerical form. Example:
7788</p>
7789
7790
7791
7792
7793
7794
7795
7796
7797
7798
7799
7800
7801
7802                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">"M10,20L30,40"</code></pre></section>
7803
7804
7805
7806
7807
7808
7809                                  <p>This example features two commands: <code>M</code>, with arguments <code>(10, 20)</code> and <code>L</code> with arguments <code>(30, 40)</code>. Uppercase letter commands express coordinates in absolute terms, while lowercase commands express them in relative terms from the most recently declared coordinates.
7810</p><p></p>
7811
7812
7813
7814
7815
7816
7817
7818
7819
7820
7821
7822                                  <p>Here is short list of commands available, for more details see <a href="http://www.w3.org/TR/SVG/paths.html#PathData" title="Details of a path's data attribute's format are described in the SVG specification.">SVG path string format</a> or <a href="https://developer.mozilla.org/en/SVG/Tutorial/Paths">article about path strings at MDN</a>.</p>
7823
7824
7825
7826
7827
7828
7829
7830
7831
7832
7833
7834                                  <table><thead><tr><th>Command</th><th>Name</th><th>Parameters</th></tr></thead><tbody>
7835
7836
7837
7838
7839
7840
7841
7842
7843
7844
7845
7846                                  <tr><td>M</td><td>moveto</td><td>(x y)+</td></tr>
7847
7848
7849
7850
7851
7852
7853
7854
7855
7856
7857
7858                                  <tr><td>Z</td><td>closepath</td><td>(none)</td></tr>
7859
7860
7861
7862
7863
7864
7865
7866
7867
7868
7869
7870                                  <tr><td>L</td><td>lineto</td><td>(x y)+</td></tr>
7871
7872
7873
7874
7875
7876
7877
7878
7879
7880
7881
7882                                  <tr><td>H</td><td>horizontal lineto</td><td>x+</td></tr>
7883
7884
7885
7886
7887
7888
7889
7890
7891
7892
7893
7894                                  <tr><td>V</td><td>vertical lineto</td><td>y+</td></tr>
7895
7896
7897
7898
7899
7900
7901
7902
7903
7904
7905
7906                                  <tr><td>C</td><td>curveto</td><td>(x1 y1 x2 y2 x y)+</td></tr>
7907
7908
7909
7910
7911
7912
7913
7914
7915
7916
7917
7918                                  <tr><td>S</td><td>smooth curveto</td><td>(x2 y2 x y)+</td></tr>
7919
7920
7921
7922
7923
7924
7925
7926
7927
7928
7929
7930                                  <tr><td>Q</td><td>quadratic Bézier curveto</td><td>(x1 y1 x y)+</td></tr>
7931
7932
7933
7934
7935
7936
7937
7938
7939
7940
7941
7942                                  <tr><td>T</td><td>smooth quadratic Bézier curveto</td><td>(x y)+</td></tr>
7943
7944
7945
7946
7947
7948
7949
7950
7951
7952
7953
7954                                  <tr><td>A</td><td>elliptical arc</td><td>(rx ry x-axis-rotation large-arc-flag sweep-flag x y)+</td></tr>
7955
7956
7957
7958
7959
7960
7961
7962
7963
7964
7965
7966                                  <tr><td>R</td><td><a href="http://en.wikipedia.org/wiki/Catmull–Rom_spline#Catmull.E2.80.93Rom_spline">Catmull-Rom curveto</a>*</td><td>x1 y1 (x y)+</td></tr></tbody></table>
7967
7968
7969
7970
7971
7972
7973
7974
7975
7976                                  <p><li><em>Catmull-Rom curveto</em> is a not standard SVG command and added to make life easier.</li>
7977Note: there is a special case when a path consists of only three commands: <code>M10,10R…z</code>. In this case the path connects back to its starting point.
7978</p>
7979
7980
7981
7982
7983
7984
7985
7986
7987
7988
7989
7990
7991                                  <h3>Usage</h3>
7992
7993
7994
7995
7996
7997
7998
7999
8000
8001
8002
8003                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.path("M10 10L90 90");
8004// draw a diagonal line:
8005// move to 10,10, line to 90,90</code></pre></section>
8006
8007
8008
8009
8010
8011                              </div>
8012                          </section>
8013                      </article>
8014
8015                      <article id="Paper.g">
8016                          <header>
8017                              <h3 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 239 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L239">&#x27ad;</a></h3>
8018                          </header>
8019                          <section>
8020                              <div class="extra" id="Paper.g-extra"></div>
8021                              <div class="dr-method">
8022
8023
8024
8025
8026                                  <p>Creates a group element
8027</p>
8028
8029
8030
8031
8032
8033
8034
8035
8036
8037
8038                                  <div class="topcoat-list__container">
8039                                      <h3 class="topcoat-list__header">Parameters</h3>
8040                                      <ol class="topcoat-list">
8041                                          <li class="topcoat-list__item"><span class="dr-param">varargs</span>
8042                                              <span class="dr-type"><em class="dr-type-…">…</em> </span>
8043                                              <span class="dr-description">elements to nest within the group</span></li>
8044
8045                                      </ol>
8046                                  </div>
8047
8048
8049
8050
8051
8052
8053
8054
8055
8056
8057
8058
8059
8060                                  <p class="dr-returns">
8061                                      <strong class="dr-title">Returns:</strong>
8062
8063                                      <em class="dr-type-object">object</em>
8064
8065                                      <span class="dr-description">the <code>g</code> element</span>
8066                                  </p>
8067
8068
8069
8070
8071
8072
8073
8074
8075                                  <h3>Usage</h3>
8076
8077
8078
8079
8080
8081
8082
8083
8084
8085
8086
8087                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c1 = paper.circle(),
8088    c2 = paper.rect(),
8089    g = paper.g(c2, c1); // note that the order of elements is different</code></pre></section>
8090
8091
8092
8093
8094
8095
8096                                  <p>or
8097</p>
8098
8099
8100
8101
8102
8103
8104
8105
8106
8107
8108
8109
8110
8111                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c1 = paper.circle(),
8112    c2 = paper.rect(),
8113    g = paper.g();
8114g.add(c2, c1);</code></pre></section>
8115
8116
8117
8118
8119
8120                              </div>
8121                          </section>
8122                      </article>
8123
8124                      <article id="Paper.group">
8125                          <header>
8126                              <h3 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 245 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L245">&#x27ad;</a></h3>
8127                          </header>
8128                          <section>
8129                              <div class="extra" id="Paper.group-extra"></div>
8130                              <div class="dr-method">
8131
8132
8133
8134
8135                                  <p>See <a href="#Paper.g" class="dr-link">Paper.g</a>
8136</p>
8137
8138
8139
8140
8141
8142
8143
8144
8145                              </div>
8146                          </section>
8147                      </article>
8148
8149                      <article id="Paper.svg">
8150                          <header>
8151                              <h3 class="dr-method">Paper.svg(x, y, width, height, vbx, vby, vbw, vbh)<a href="#Paper.svg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 272 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L272">&#x27ad;</a></h3>
8152                          </header>
8153                          <section>
8154                              <div class="extra" id="Paper.svg-extra"></div>
8155                              <div class="dr-method">
8156
8157
8158
8159
8160                                  <p>Creates a nested SVG element.
8161</p>
8162
8163
8164
8165
8166
8167
8168
8169
8170
8171
8172                                  <div class="topcoat-list__container">
8173                                      <h3 class="topcoat-list__header">Parameters</h3>
8174                                      <ol class="topcoat-list">
8175                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
8176                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8177                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> X of the element</span></li>
8178                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
8179                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8180                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> Y of the element</span></li>
8181                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
8182                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8183                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> width of the element</span></li>
8184                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
8185                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8186                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> height of the element</span></li>
8187                                          <li class="topcoat-list__item"><span class="dr-param">vbx</span>
8188                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8189                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox X</span></li>
8190                                          <li class="topcoat-list__item"><span class="dr-param">vby</span>
8191                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8192                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox Y</span></li>
8193                                          <li class="topcoat-list__item"><span class="dr-param">vbw</span>
8194                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8195                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox width</span></li>
8196                                          <li class="topcoat-list__item"><span class="dr-param">vbh</span>
8197                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8198                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox height</span></li>
8199
8200                                      </ol>
8201                                  </div>
8202
8203
8204
8205
8206
8207
8208
8209
8210
8211
8212
8213
8214
8215                                  <p class="dr-returns">
8216                                      <strong class="dr-title">Returns:</strong>
8217
8218                                      <em class="dr-type-object">object</em>
8219
8220                                      <span class="dr-description">the <code>svg</code> element</span>
8221                                  </p>
8222
8223
8224
8225
8226                              </div>
8227                          </section>
8228                      </article>
8229
8230                      <article id="Paper.mask">
8231                          <header>
8232                              <h3 class="dr-method">Paper.mask()<a href="#Paper.mask" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 304 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L304">&#x27ad;</a></h3>
8233                          </header>
8234                          <section>
8235                              <div class="extra" id="Paper.mask-extra"></div>
8236                              <div class="dr-method">
8237
8238
8239
8240
8241                                  <p>Equivalent in behaviour to <a href="#Paper.g" class="dr-link">Paper.g</a>, except it’s a mask.
8242</p>
8243
8244
8245
8246
8247
8248
8249
8250
8251
8252
8253
8254
8255
8256
8257                                  <p class="dr-returns">
8258                                      <strong class="dr-title">Returns:</strong>
8259
8260                                      <em class="dr-type-object">object</em>
8261
8262                                      <span class="dr-description">the <code>mask</code> element</span>
8263                                  </p>
8264
8265
8266
8267
8268                              </div>
8269                          </section>
8270                      </article>
8271
8272                      <article id="Paper.ptrn">
8273                          <header>
8274                              <h3 class="dr-method">Paper.ptrn(x, y, width, height, vbx, vby, vbw, vbh)<a href="#Paper.ptrn" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 331 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L331">&#x27ad;</a></h3>
8275                          </header>
8276                          <section>
8277                              <div class="extra" id="Paper.ptrn-extra"></div>
8278                              <div class="dr-method">
8279
8280
8281
8282
8283                                  <p>Equivalent in behaviour to <a href="#Paper.g" class="dr-link">Paper.g</a>, except it’s a pattern.
8284</p>
8285
8286
8287
8288
8289
8290
8291
8292
8293
8294
8295                                  <div class="topcoat-list__container">
8296                                      <h3 class="topcoat-list__header">Parameters</h3>
8297                                      <ol class="topcoat-list">
8298                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
8299                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8300                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> X of the element</span></li>
8301                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
8302                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8303                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> Y of the element</span></li>
8304                                          <li class="topcoat-list__item"><span class="dr-param">width</span>
8305                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8306                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> width of the element</span></li>
8307                                          <li class="topcoat-list__item"><span class="dr-param">height</span>
8308                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8309                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> height of the element</span></li>
8310                                          <li class="topcoat-list__item"><span class="dr-param">vbx</span>
8311                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8312                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox X</span></li>
8313                                          <li class="topcoat-list__item"><span class="dr-param">vby</span>
8314                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8315                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox Y</span></li>
8316                                          <li class="topcoat-list__item"><span class="dr-param">vbw</span>
8317                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8318                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox width</span></li>
8319                                          <li class="topcoat-list__item"><span class="dr-param">vbh</span>
8320                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8321                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox height</span></li>
8322
8323                                      </ol>
8324                                  </div>
8325
8326
8327
8328
8329
8330
8331
8332
8333
8334
8335
8336
8337
8338                                  <p class="dr-returns">
8339                                      <strong class="dr-title">Returns:</strong>
8340
8341                                      <em class="dr-type-object">object</em>
8342
8343                                      <span class="dr-description">the <code>pattern</code> element</span>
8344                                  </p>
8345
8346
8347
8348
8349                              </div>
8350                          </section>
8351                      </article>
8352
8353                      <article id="Paper.use">
8354                          <header>
8355                              <h3 class="dr-method">Paper.use(…)<a href="#Paper.use" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 368 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L368">&#x27ad;</a></h3>
8356                          </header>
8357                          <section>
8358                              <div class="extra" id="Paper.use-extra"></div>
8359                              <div class="dr-method">
8360
8361
8362
8363
8364                                  <p>Creates a &lt;use&gt; element.
8365</p>
8366
8367
8368
8369
8370
8371
8372
8373
8374
8375
8376                                  <div class="topcoat-list__container">
8377                                      <h3 class="topcoat-list__header">Parameters</h3>
8378                                      <ol class="topcoat-list">
8379                                          <li class="topcoat-list__item"><span class="dr-param">id</span>
8380                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
8381                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> id of element to link</span></li>
8382
8383                                      </ol>
8384                                  </div>
8385
8386
8387
8388
8389
8390
8391
8392
8393                                  <p>or
8394</p>
8395
8396
8397
8398
8399
8400
8401
8402
8403
8404
8405                                  <div class="topcoat-list__container">
8406                                      <h3 class="topcoat-list__header">Parameters</h3>
8407                                      <ol class="topcoat-list">
8408                                          <li class="topcoat-list__item"><span class="dr-param">id</span>
8409                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
8410                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> element to link</span></li>
8411
8412                                      </ol>
8413                                  </div>
8414
8415
8416
8417
8418
8419
8420
8421
8422
8423
8424
8425
8426
8427                                  <p class="dr-returns">
8428                                      <strong class="dr-title">Returns:</strong>
8429
8430                                      <em class="dr-type-object">object</em>
8431
8432                                      <span class="dr-description">the <code>use</code> element</span>
8433                                  </p>
8434
8435
8436
8437
8438                              </div>
8439                          </section>
8440                      </article>
8441
8442                      <article id="Paper.symbol">
8443                          <header>
8444                              <h3 class="dr-method">Paper.symbol(vbx, vby, vbw, vbh)<a href="#Paper.symbol" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 396 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L396">&#x27ad;</a></h3>
8445                          </header>
8446                          <section>
8447                              <div class="extra" id="Paper.symbol-extra"></div>
8448                              <div class="dr-method">
8449
8450
8451
8452
8453                                  <p>Creates a &lt;symbol&gt; element.
8454</p>
8455
8456
8457
8458
8459
8460
8461
8462
8463
8464
8465                                  <div class="topcoat-list__container">
8466                                      <h3 class="topcoat-list__header">Parameters</h3>
8467                                      <ol class="topcoat-list">
8468                                          <li class="topcoat-list__item"><span class="dr-param">vbx</span>
8469                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8470                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox X</span></li>
8471                                          <li class="topcoat-list__item"><span class="dr-param">vby</span>
8472                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8473                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox Y</span></li>
8474                                          <li class="topcoat-list__item"><span class="dr-param">vbw</span>
8475                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8476                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox width</span></li>
8477                                          <li class="topcoat-list__item"><span class="dr-param">vbh</span>
8478                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8479                                              <span class="dr-description"><a href="#optional" class="dr-link">optional</a> viewbox height</span></li>
8480
8481                                      </ol>
8482                                  </div>
8483
8484
8485
8486
8487
8488
8489
8490
8491
8492
8493
8494
8495
8496                                  <p class="dr-returns">
8497                                      <strong class="dr-title">Returns:</strong>
8498
8499                                      <em class="dr-type-object">object</em>
8500
8501                                      <span class="dr-description">the <code>symbol</code> element</span>
8502                                  </p>
8503
8504
8505
8506
8507                              </div>
8508                          </section>
8509                      </article>
8510
8511                      <article id="Paper.text">
8512                          <header>
8513                              <h3 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 424 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L424">&#x27ad;</a></h3>
8514                          </header>
8515                          <section>
8516                              <div class="extra" id="Paper.text-extra"></div>
8517                              <div class="dr-method">
8518
8519
8520
8521
8522                                  <p>Draws a text string
8523</p>
8524
8525
8526
8527
8528
8529
8530
8531
8532
8533
8534                                  <div class="topcoat-list__container">
8535                                      <h3 class="topcoat-list__header">Parameters</h3>
8536                                      <ol class="topcoat-list">
8537                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
8538                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8539                                              <span class="dr-description">x coordinate position</span></li>
8540                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
8541                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8542                                              <span class="dr-description">y coordinate position</span></li>
8543                                          <li class="topcoat-list__item"><span class="dr-param">text</span>
8544                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-array">array</em> </span>
8545                                              <span class="dr-description">The text string to draw or array of strings to nest within separate <code>&lt;tspan&gt;</code> elements</span></li>
8546
8547                                      </ol>
8548                                  </div>
8549
8550
8551
8552
8553
8554
8555
8556
8557
8558
8559
8560
8561
8562                                  <p class="dr-returns">
8563                                      <strong class="dr-title">Returns:</strong>
8564
8565                                      <em class="dr-type-object">object</em>
8566
8567                                      <span class="dr-description">the <code>text</code> element</span>
8568                                  </p>
8569
8570
8571
8572
8573
8574
8575
8576
8577                                  <h3>Usage</h3>
8578
8579
8580
8581
8582
8583
8584
8585
8586
8587
8588
8589                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var t1 = paper.text(50, 50, "Snap");
8590var t2 = paper.text(50, 50, ["S","n","a","p"]);
8591// Text path usage
8592t1.attr({textpath: "M10,10L100,100"});
8593// or
8594var pth = paper.path("M10,10L100,100");
8595t1.attr({textpath: pth});</code></pre></section>
8596
8597
8598
8599
8600
8601                              </div>
8602                          </section>
8603                      </article>
8604
8605                      <article id="Paper.line">
8606                          <header>
8607                              <h3 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 452 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L452">&#x27ad;</a></h3>
8608                          </header>
8609                          <section>
8610                              <div class="extra" id="Paper.line-extra"></div>
8611                              <div class="dr-method">
8612
8613
8614
8615
8616                                  <p>Draws a line
8617</p>
8618
8619
8620
8621
8622
8623
8624
8625
8626
8627
8628                                  <div class="topcoat-list__container">
8629                                      <h3 class="topcoat-list__header">Parameters</h3>
8630                                      <ol class="topcoat-list">
8631                                          <li class="topcoat-list__item"><span class="dr-param">x1</span>
8632                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8633                                              <span class="dr-description">x coordinate position of the start</span></li>
8634                                          <li class="topcoat-list__item"><span class="dr-param">y1</span>
8635                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8636                                              <span class="dr-description">y coordinate position of the start</span></li>
8637                                          <li class="topcoat-list__item"><span class="dr-param">x2</span>
8638                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8639                                              <span class="dr-description">x coordinate position of the end</span></li>
8640                                          <li class="topcoat-list__item"><span class="dr-param">y2</span>
8641                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
8642                                              <span class="dr-description">y coordinate position of the end</span></li>
8643
8644                                      </ol>
8645                                  </div>
8646
8647
8648
8649
8650
8651
8652
8653
8654
8655
8656
8657
8658
8659                                  <p class="dr-returns">
8660                                      <strong class="dr-title">Returns:</strong>
8661
8662                                      <em class="dr-type-object">object</em>
8663
8664                                      <span class="dr-description">the <code>line</code> element</span>
8665                                  </p>
8666
8667
8668
8669
8670
8671
8672
8673
8674                                  <h3>Usage</h3>
8675
8676
8677
8678
8679
8680
8681
8682
8683
8684
8685
8686                                  <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>
8687
8688
8689
8690
8691
8692                              </div>
8693                          </section>
8694                      </article>
8695
8696                      <article id="Paper.polyline">
8697                          <header>
8698                              <h3 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 481 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L481">&#x27ad;</a></h3>
8699                          </header>
8700                          <section>
8701                              <div class="extra" id="Paper.polyline-extra"></div>
8702                              <div class="dr-method">
8703
8704
8705
8706
8707                                  <p>Draws a polyline
8708</p>
8709
8710
8711
8712
8713
8714
8715
8716
8717
8718
8719                                  <div class="topcoat-list__container">
8720                                      <h3 class="topcoat-list__header">Parameters</h3>
8721                                      <ol class="topcoat-list">
8722                                          <li class="topcoat-list__item"><span class="dr-param">points</span>
8723                                              <span class="dr-type"><em class="dr-type-array">array</em> </span>
8724                                              <span class="dr-description">array of points</span></li>
8725
8726                                      </ol>
8727                                  </div>
8728
8729
8730
8731
8732
8733
8734
8735
8736                                  <p>or
8737</p>
8738
8739
8740
8741
8742
8743
8744
8745
8746
8747
8748                                  <div class="topcoat-list__container">
8749                                      <h3 class="topcoat-list__header">Parameters</h3>
8750                                      <ol class="topcoat-list">
8751                                          <li class="topcoat-list__item"><span class="dr-param">varargs</span>
8752                                              <span class="dr-type"><em class="dr-type-…">…</em> </span>
8753                                              <span class="dr-description">points</span></li>
8754
8755                                      </ol>
8756                                  </div>
8757
8758
8759
8760
8761
8762
8763
8764
8765
8766
8767
8768
8769
8770                                  <p class="dr-returns">
8771                                      <strong class="dr-title">Returns:</strong>
8772
8773                                      <em class="dr-type-object">object</em>
8774
8775                                      <span class="dr-description">the <code>polyline</code> element</span>
8776                                  </p>
8777
8778
8779
8780
8781
8782
8783
8784
8785                                  <h3>Usage</h3>
8786
8787
8788
8789
8790
8791
8792
8793
8794
8795
8796
8797                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var p1 = paper.polyline([10, 10, 100, 100]);
8798var p2 = paper.polyline(10, 10, 100, 100);</code></pre></section>
8799
8800
8801
8802
8803
8804                              </div>
8805                          </section>
8806                      </article>
8807
8808                      <article id="Paper.polygon">
8809                          <header>
8810                              <h3 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 499 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L499">&#x27ad;</a></h3>
8811                          </header>
8812                          <section>
8813                              <div class="extra" id="Paper.polygon-extra"></div>
8814                              <div class="dr-method">
8815
8816
8817
8818
8819                                  <p>Draws a polygon. See <a href="#Paper.polyline" class="dr-link">Paper.polyline</a>
8820</p>
8821
8822
8823
8824
8825
8826
8827
8828
8829                              </div>
8830                          </section>
8831                      </article>
8832
8833                      <article id="Paper.gradient">
8834                          <header>
8835                              <h3 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 659 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L659">&#x27ad;</a></h3>
8836                          </header>
8837                          <section>
8838                              <div class="extra" id="Paper.gradient-extra"></div>
8839                              <div class="dr-method">
8840
8841
8842
8843
8844                                  <p>Creates a gradient element
8845</p>
8846
8847
8848
8849
8850
8851
8852
8853
8854
8855
8856                                  <div class="topcoat-list__container">
8857                                      <h3 class="topcoat-list__header">Parameters</h3>
8858                                      <ol class="topcoat-list">
8859                                          <li class="topcoat-list__item"><span class="dr-param">gradient</span>
8860                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
8861                                              <span class="dr-description">gradient descriptor</span></li>
8862
8863                                      </ol>
8864                                  </div>
8865
8866
8867
8868
8869
8870
8871
8872
8873
8874
8875
8876                                  <h3>Gradient Descriptor</h3>
8877
8878
8879
8880
8881
8882
8883
8884                                  <p>The gradient descriptor is an expression formatted as
8885follows: <code>&lt;type&gt;(&lt;coords&gt;)&lt;colors&gt;</code>.  The <code>&lt;type&gt;</code> can be
8886either linear or radial.  The uppercase <code>L</code> or <code>R</code> letters
8887indicate absolute coordinates offset from the SVG surface.
8888Lowercase <code>l</code> or <code>r</code> letters indicate coordinates
8889calculated relative to the element to which the gradient is
8890applied.  Coordinates specify a linear gradient vector as
8891<code>x1</code>, <code>y1</code>, <code>x2</code>, <code>y2</code>, or a radial gradient as <code>cx</code>, <code>cy</code>,
8892<code>r</code> and optional <code>fx</code>, <code>fy</code> specifying a focal point away
8893from the center of the circle. Specify <code>&lt;colors&gt;</code> as a list
8894of dash-separated CSS color values.  Each color may be
8895followed by a custom offset value, separated with a colon
8896character.
8897</p>
8898
8899
8900
8901
8902
8903
8904
8905
8906
8907
8908
8909
8910                                  <h3>Examples</h3>
8911
8912
8913
8914
8915
8916
8917
8918                                  <p>Linear gradient, relative from top-left corner to bottom-right
8919corner, from black through red to white:
8920</p>
8921
8922
8923
8924
8925
8926
8927
8928
8929
8930
8931
8932
8933
8934                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff");</code></pre></section>
8935
8936
8937
8938
8939
8940
8941                                  <p>Linear gradient, absolute from (0, 0) to (100, 100), from black
8942through red at 25% to white:
8943</p>
8944
8945
8946
8947
8948
8949
8950
8951
8952
8953
8954
8955
8956
8957                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var g = paper.gradient("L(0, 0, 100, 100)#000-#f00:25-#fff");</code></pre></section>
8958
8959
8960
8961
8962
8963
8964                                  <p>Radial gradient, relative from the center of the element with radius
8965half the width, from black to white:
8966</p>
8967
8968
8969
8970
8971
8972
8973
8974
8975
8976
8977
8978
8979
8980                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var g = paper.gradient("r(0.5, 0.5, 0.5)#000-#fff");</code></pre></section>
8981
8982
8983
8984
8985
8986
8987                                  <p>To apply the gradient:
8988</p>
8989
8990
8991
8992
8993
8994
8995
8996
8997
8998
8999
9000
9001
9002                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">paper.circle(50, 50, 40).attr({
9003    fill: g
9004});</code></pre></section>
9005
9006
9007
9008
9009
9010
9011
9012
9013
9014
9015
9016                                  <p class="dr-returns">
9017                                      <strong class="dr-title">Returns:</strong>
9018
9019                                      <em class="dr-type-object">object</em>
9020
9021                                      <span class="dr-description">the <code>gradient</code> element</span>
9022                                  </p>
9023
9024
9025
9026
9027                              </div>
9028                          </section>
9029                      </article>
9030
9031                      <article id="Paper.toString">
9032                          <header>
9033                              <h3 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 675 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L675">&#x27ad;</a></h3>
9034                          </header>
9035                          <section>
9036                              <div class="extra" id="Paper.toString-extra"></div>
9037                              <div class="dr-method">
9038
9039
9040
9041
9042                                  <p>Returns SVG code for the <a href="#Paper" class="dr-link">Paper</a>
9043</p>
9044
9045
9046
9047
9048
9049
9050
9051
9052
9053
9054
9055
9056
9057
9058                                  <p class="dr-returns">
9059                                      <strong class="dr-title">Returns:</strong>
9060
9061                                      <em class="dr-type-string">string</em>
9062
9063                                      <span class="dr-description">SVG code for the <a href="#Paper" class="dr-link">Paper</a></span>
9064                                  </p>
9065
9066
9067
9068
9069                              </div>
9070                          </section>
9071                      </article>
9072
9073                      <article id="Paper.toDataURL">
9074                          <header>
9075                              <h3 class="dr-method">Paper.toDataURL()<a href="#Paper.toDataURL" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 695 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L695">&#x27ad;</a></h3>
9076                          </header>
9077                          <section>
9078                              <div class="extra" id="Paper.toDataURL-extra"></div>
9079                              <div class="dr-method">
9080
9081
9082
9083
9084                                  <p>Returns SVG code for the <a href="#Paper" class="dr-link">Paper</a> as Data URI string.
9085</p>
9086
9087
9088
9089
9090
9091
9092
9093
9094
9095
9096
9097
9098
9099
9100                                  <p class="dr-returns">
9101                                      <strong class="dr-title">Returns:</strong>
9102
9103                                      <em class="dr-type-string">string</em>
9104
9105                                      <span class="dr-description">Data URI string</span>
9106                                  </p>
9107
9108
9109
9110
9111                              </div>
9112                          </section>
9113                      </article>
9114
9115                      <article id="Paper.clear">
9116                          <header>
9117                              <h3 class="dr-method">Paper.clear()<a href="#Paper.clear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 706 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L706">&#x27ad;</a></h3>
9118                          </header>
9119                          <section>
9120                              <div class="extra" id="Paper.clear-extra"></div>
9121                              <div class="dr-method">
9122
9123
9124
9125
9126                                  <p>Removes all child nodes of the paper, except &lt;defs&gt;.
9127</p>
9128
9129
9130
9131
9132
9133
9134
9135
9136                              </div>
9137                          </section>
9138                      </article>
9139
9140                      <article id="Element.addClass">
9141                          <header>
9142                              <h3 class="dr-method">Element.addClass(value)<a href="#Element.addClass" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 29 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L29">&#x27ad;</a></h3>
9143                          </header>
9144                          <section>
9145                              <div class="extra" id="Element.addClass-extra"></div>
9146                              <div class="dr-method">
9147
9148
9149
9150
9151                                  <p>Adds given class name or list of class names to the element.
9152</p>
9153
9154
9155
9156
9157
9158
9159
9160
9161
9162
9163                                  <div class="topcoat-list__container">
9164                                      <h3 class="topcoat-list__header">Parameters</h3>
9165                                      <ol class="topcoat-list">
9166                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
9167                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
9168                                              <span class="dr-description">class name or space separated list of class names</span></li>
9169
9170                                      </ol>
9171                                  </div>
9172
9173
9174
9175
9176
9177
9178
9179
9180
9181
9182
9183
9184
9185                                  <p class="dr-returns">
9186                                      <strong class="dr-title">Returns:</strong>
9187
9188                                      <em class="dr-type-Element">Element</em>
9189
9190                                      <span class="dr-description">original element.</span>
9191                                  </p>
9192
9193
9194
9195
9196                              </div>
9197                          </section>
9198                      </article>
9199
9200                      <article id="Element.removeClass">
9201                          <header>
9202                              <h3 class="dr-method">Element.removeClass(value)<a href="#Element.removeClass" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 64 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L64">&#x27ad;</a></h3>
9203                          </header>
9204                          <section>
9205                              <div class="extra" id="Element.removeClass-extra"></div>
9206                              <div class="dr-method">
9207
9208
9209
9210
9211                                  <p>Removes given class name or list of class names from the element.
9212</p>
9213
9214
9215
9216
9217
9218
9219
9220
9221
9222
9223                                  <div class="topcoat-list__container">
9224                                      <h3 class="topcoat-list__header">Parameters</h3>
9225                                      <ol class="topcoat-list">
9226                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
9227                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
9228                                              <span class="dr-description">class name or space separated list of class names</span></li>
9229
9230                                      </ol>
9231                                  </div>
9232
9233
9234
9235
9236
9237
9238
9239
9240
9241
9242
9243
9244
9245                                  <p class="dr-returns">
9246                                      <strong class="dr-title">Returns:</strong>
9247
9248                                      <em class="dr-type-Element">Element</em>
9249
9250                                      <span class="dr-description">original element.</span>
9251                                  </p>
9252
9253
9254
9255
9256                              </div>
9257                          </section>
9258                      </article>
9259
9260                      <article id="Element.hasClass">
9261                          <header>
9262                              <h3 class="dr-method">Element.hasClass(value)<a href="#Element.hasClass" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 98 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L98">&#x27ad;</a></h3>
9263                          </header>
9264                          <section>
9265                              <div class="extra" id="Element.hasClass-extra"></div>
9266                              <div class="dr-method">
9267
9268
9269
9270
9271                                  <p>Checks if the element has a given class name in the list of class names applied to it.
9272</p>
9273
9274
9275
9276
9277
9278
9279
9280
9281
9282
9283                                  <div class="topcoat-list__container">
9284                                      <h3 class="topcoat-list__header">Parameters</h3>
9285                                      <ol class="topcoat-list">
9286                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
9287                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
9288                                              <span class="dr-description">class name</span></li>
9289
9290                                      </ol>
9291                                  </div>
9292
9293
9294
9295
9296
9297
9298
9299
9300
9301
9302
9303
9304
9305                                  <p class="dr-returns">
9306                                      <strong class="dr-title">Returns:</strong>
9307
9308                                      <em class="dr-type-boolean">boolean</em>
9309
9310                                      <span class="dr-description"><code>true</code> if the element has given class</span>
9311                                  </p>
9312
9313
9314
9315
9316                              </div>
9317                          </section>
9318                      </article>
9319
9320                      <article id="Element.toggleClass">
9321                          <header>
9322                              <h3 class="dr-method">Element.toggleClass(value, flag)<a href="#Element.toggleClass" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 115 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L115">&#x27ad;</a></h3>
9323                          </header>
9324                          <section>
9325                              <div class="extra" id="Element.toggleClass-extra"></div>
9326                              <div class="dr-method">
9327
9328
9329
9330
9331                                  <p>Add or remove one or more classes from the element, depending on either
9332the class’s presence or the value of the <code>flag</code> argument.
9333</p>
9334
9335
9336
9337
9338
9339
9340
9341
9342
9343
9344                                  <div class="topcoat-list__container">
9345                                      <h3 class="topcoat-list__header">Parameters</h3>
9346                                      <ol class="topcoat-list">
9347                                          <li class="topcoat-list__item"><span class="dr-param">value</span>
9348                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
9349                                              <span class="dr-description">class name or space separated list of class names</span></li>
9350                                          <li class="topcoat-list__item"><span class="dr-param">flag</span>
9351                                              <span class="dr-type"><em class="dr-type-boolean">boolean</em> </span>
9352                                              <span class="dr-description">value to determine whether the class should be added or removed</span></li>
9353
9354                                      </ol>
9355                                  </div>
9356
9357
9358
9359
9360
9361
9362
9363
9364
9365
9366
9367
9368
9369                                  <p class="dr-returns">
9370                                      <strong class="dr-title">Returns:</strong>
9371
9372                                      <em class="dr-type-Element">Element</em>
9373
9374                                      <span class="dr-description">original element.</span>
9375                                  </p>
9376
9377
9378
9379
9380                              </div>
9381                          </section>
9382                      </article>
9383
9384                      <article id="mina">
9385                          <header>
9386                              <h3 class="dr-method">mina(a, A, b, B, get, set, [easing])<a href="#mina" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 168 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L168">&#x27ad;</a></h3>
9387                          </header>
9388                          <section>
9389                              <div class="extra" id="mina-extra"></div>
9390                              <div class="dr-method">
9391
9392
9393
9394
9395                                  <p>Generic animation of numbers
9396</p>
9397
9398
9399
9400
9401
9402
9403
9404
9405
9406
9407                                  <div class="topcoat-list__container">
9408                                      <h3 class="topcoat-list__header">Parameters</h3>
9409                                      <ol class="topcoat-list">
9410                                          <li class="topcoat-list__item"><span class="dr-param">a</span>
9411                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9412                                              <span class="dr-description">start <em>slave</em> number</span></li>
9413                                          <li class="topcoat-list__item"><span class="dr-param">A</span>
9414                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9415                                              <span class="dr-description">end <em>slave</em> number</span></li>
9416                                          <li class="topcoat-list__item"><span class="dr-param">b</span>
9417                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9418                                              <span class="dr-description">start <em>master</em> number (start time in general case)</span></li>
9419                                          <li class="topcoat-list__item"><span class="dr-param">B</span>
9420                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9421                                              <span class="dr-description">end <em>master</em> number (end time in gereal case)</span></li>
9422                                          <li class="topcoat-list__item"><span class="dr-param">get</span>
9423                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
9424                                              <span class="dr-description">getter of <em>master</em> number (see <a href="#mina.time" class="dr-link">mina.time</a>)</span></li>
9425                                          <li class="topcoat-list__item"><span class="dr-param">set</span>
9426                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
9427                                              <span class="dr-description">setter of <em>slave</em> number</span></li>
9428                                          <li class="topcoat-list__item"><span class="dr-param">easing</span>
9429                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
9430                                              <span class="dr-description">easing function, default is <a href="#mina.linear" class="dr-link">mina.linear</a></span></li>
9431
9432                                      </ol>
9433                                  </div>
9434
9435
9436
9437
9438
9439
9440
9441
9442
9443
9444
9445
9446
9447                                  <p class="dr-returns">
9448                                      <strong class="dr-title">Returns:</strong>
9449
9450                                      <em class="dr-type-object">object</em>
9451
9452                                      <span class="dr-description">animation descriptor</span>
9453                                  </p>
9454
9455
9456
9457
9458
9459
9460
9461
9462
9463
9464
9465                                  <ol class="dr-json">
9466
9467
9468                                      <li>{<ol class="dr-json">
9469
9470
9471
9472                                      <li>
9473                                          <span class="dr-json-key">id</span>
9474                                          <span class="dr-type"><em class="dr-type-string">string</em> </span>
9475                                          <span class="dr-json-description">animation id,</span>
9476                                      </li>
9477
9478
9479
9480                                      <li>
9481                                          <span class="dr-json-key">start</span>
9482                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
9483                                          <span class="dr-json-description">start <em>slave</em> number,</span>
9484                                      </li>
9485
9486
9487
9488                                      <li>
9489                                          <span class="dr-json-key">end</span>
9490                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
9491                                          <span class="dr-json-description">end <em>slave</em> number,</span>
9492                                      </li>
9493
9494
9495
9496                                      <li>
9497                                          <span class="dr-json-key">b</span>
9498                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
9499                                          <span class="dr-json-description">start <em>master</em> number,</span>
9500                                      </li>
9501
9502
9503
9504                                      <li>
9505                                          <span class="dr-json-key">s</span>
9506                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
9507                                          <span class="dr-json-description">animation status (0..1),</span>
9508                                      </li>
9509
9510
9511
9512                                      <li>
9513                                          <span class="dr-json-key">dur</span>
9514                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
9515                                          <span class="dr-json-description">animation duration,</span>
9516                                      </li>
9517
9518
9519
9520                                      <li>
9521                                          <span class="dr-json-key">spd</span>
9522                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
9523                                          <span class="dr-json-description">animation speed,</span>
9524                                      </li>
9525
9526
9527
9528                                      <li>
9529                                          <span class="dr-json-key">get</span>
9530                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9531                                          <span class="dr-json-description">getter of <em>master</em> number (see <a href="#mina.time" class="dr-link">mina.time</a>),</span>
9532                                      </li>
9533
9534
9535
9536                                      <li>
9537                                          <span class="dr-json-key">set</span>
9538                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9539                                          <span class="dr-json-description">setter of <em>slave</em> number,</span>
9540                                      </li>
9541
9542
9543
9544                                      <li>
9545                                          <span class="dr-json-key">easing</span>
9546                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9547                                          <span class="dr-json-description">easing function, default is <a href="#mina.linear" class="dr-link">mina.linear</a>,</span>
9548                                      </li>
9549
9550
9551
9552                                      <li>
9553                                          <span class="dr-json-key">status</span>
9554                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9555                                          <span class="dr-json-description">status getter/setter,</span>
9556                                      </li>
9557
9558
9559
9560                                      <li>
9561                                          <span class="dr-json-key">speed</span>
9562                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9563                                          <span class="dr-json-description">speed getter/setter,</span>
9564                                      </li>
9565
9566
9567
9568                                      <li>
9569                                          <span class="dr-json-key">duration</span>
9570                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9571                                          <span class="dr-json-description">duration getter/setter,</span>
9572                                      </li>
9573
9574
9575
9576                                      <li>
9577                                          <span class="dr-json-key">stop</span>
9578                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9579                                          <span class="dr-json-description">animation stopper</span>
9580                                      </li>
9581
9582
9583
9584                                      <li>
9585                                          <span class="dr-json-key">pause</span>
9586                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9587                                          <span class="dr-json-description">pauses the animation</span>
9588                                      </li>
9589
9590
9591
9592                                      <li>
9593                                          <span class="dr-json-key">resume</span>
9594                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9595                                          <span class="dr-json-description">resumes the animation</span>
9596                                      </li>
9597
9598
9599
9600                                      <li>
9601                                          <span class="dr-json-key">update</span>
9602                                          <span class="dr-type"><em class="dr-type-function">function</em> </span>
9603                                          <span class="dr-json-description">calles setter with the right value of the animation</span>
9604                                      </li>
9605
9606
9607
9608                                      </ol></li><li>}</li>
9609
9610
9611                                  </ol>
9612
9613
9614                              </div>
9615                          </section>
9616                      </article>
9617
9618                      <article id="mina.time">
9619                          <header>
9620                              <h3 class="dr-method">mina.time()<a href="#mina.time" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 208 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L208">&#x27ad;</a></h3>
9621                          </header>
9622                          <section>
9623                              <div class="extra" id="mina.time-extra"></div>
9624                              <div class="dr-method">
9625
9626
9627
9628
9629                                  <p>Returns the current time. Equivalent to:
9630</p>
9631
9632
9633
9634
9635
9636
9637
9638
9639
9640
9641
9642
9643
9644                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">function () {
9645    return (new Date).getTime();
9646}</code></pre></section>
9647
9648
9649
9650
9651
9652                              </div>
9653                          </section>
9654                      </article>
9655
9656                      <article id="mina.getById">
9657                          <header>
9658                              <h3 class="dr-method">mina.getById(id)<a href="#mina.getById" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 217 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L217">&#x27ad;</a></h3>
9659                          </header>
9660                          <section>
9661                              <div class="extra" id="mina.getById-extra"></div>
9662                              <div class="dr-method">
9663
9664
9665
9666
9667                                  <p>Returns an animation by its id
9668</p>
9669
9670
9671
9672
9673
9674
9675
9676
9677
9678
9679                                  <div class="topcoat-list__container">
9680                                      <h3 class="topcoat-list__header">Parameters</h3>
9681                                      <ol class="topcoat-list">
9682                                          <li class="topcoat-list__item"><span class="dr-param">id</span>
9683                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
9684                                              <span class="dr-description">animation&#39;s id</span></li>
9685
9686                                      </ol>
9687                                  </div>
9688
9689
9690
9691
9692
9693
9694
9695
9696
9697
9698
9699
9700
9701                                  <p class="dr-returns">
9702                                      <strong class="dr-title">Returns:</strong>
9703
9704                                      <em class="dr-type-object">object</em>
9705
9706                                      <span class="dr-description">See <a href="#mina" class="dr-link">mina</a></span>
9707                                  </p>
9708
9709
9710
9711
9712                              </div>
9713                          </section>
9714                      </article>
9715
9716                      <article id="mina.linear">
9717                          <header>
9718                              <h3 class="dr-method">mina.linear(n)<a href="#mina.linear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 229 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L229">&#x27ad;</a></h3>
9719                          </header>
9720                          <section>
9721                              <div class="extra" id="mina.linear-extra"></div>
9722                              <div class="dr-method">
9723
9724
9725
9726
9727                                  <p>Default linear easing
9728</p>
9729
9730
9731
9732
9733
9734
9735
9736
9737
9738
9739                                  <div class="topcoat-list__container">
9740                                      <h3 class="topcoat-list__header">Parameters</h3>
9741                                      <ol class="topcoat-list">
9742                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
9743                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9744                                              <span class="dr-description">input 0..1</span></li>
9745
9746                                      </ol>
9747                                  </div>
9748
9749
9750
9751
9752
9753
9754
9755
9756
9757
9758
9759
9760
9761                                  <p class="dr-returns">
9762                                      <strong class="dr-title">Returns:</strong>
9763
9764                                      <em class="dr-type-number">number</em>
9765
9766                                      <span class="dr-description">output 0..1</span>
9767                                  </p>
9768
9769
9770
9771
9772                              </div>
9773                          </section>
9774                      </article>
9775
9776                      <article id="mina.easeout">
9777                          <header>
9778                              <h3 class="dr-method">mina.easeout(n)<a href="#mina.easeout" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 240 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L240">&#x27ad;</a></h3>
9779                          </header>
9780                          <section>
9781                              <div class="extra" id="mina.easeout-extra"></div>
9782                              <div class="dr-method">
9783
9784
9785
9786
9787                                  <p>Easeout easing
9788</p>
9789
9790
9791
9792
9793
9794
9795
9796
9797
9798
9799                                  <div class="topcoat-list__container">
9800                                      <h3 class="topcoat-list__header">Parameters</h3>
9801                                      <ol class="topcoat-list">
9802                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
9803                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9804                                              <span class="dr-description">input 0..1</span></li>
9805
9806                                      </ol>
9807                                  </div>
9808
9809
9810
9811
9812
9813
9814
9815
9816
9817
9818
9819
9820
9821                                  <p class="dr-returns">
9822                                      <strong class="dr-title">Returns:</strong>
9823
9824                                      <em class="dr-type-number">number</em>
9825
9826                                      <span class="dr-description">output 0..1</span>
9827                                  </p>
9828
9829
9830
9831
9832                              </div>
9833                          </section>
9834                      </article>
9835
9836                      <article id="mina.easein">
9837                          <header>
9838                              <h3 class="dr-method">mina.easein(n)<a href="#mina.easein" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 251 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L251">&#x27ad;</a></h3>
9839                          </header>
9840                          <section>
9841                              <div class="extra" id="mina.easein-extra"></div>
9842                              <div class="dr-method">
9843
9844
9845
9846
9847                                  <p>Easein easing
9848</p>
9849
9850
9851
9852
9853
9854
9855
9856
9857
9858
9859                                  <div class="topcoat-list__container">
9860                                      <h3 class="topcoat-list__header">Parameters</h3>
9861                                      <ol class="topcoat-list">
9862                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
9863                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9864                                              <span class="dr-description">input 0..1</span></li>
9865
9866                                      </ol>
9867                                  </div>
9868
9869
9870
9871
9872
9873
9874
9875
9876
9877
9878
9879
9880
9881                                  <p class="dr-returns">
9882                                      <strong class="dr-title">Returns:</strong>
9883
9884                                      <em class="dr-type-number">number</em>
9885
9886                                      <span class="dr-description">output 0..1</span>
9887                                  </p>
9888
9889
9890
9891
9892                              </div>
9893                          </section>
9894                      </article>
9895
9896                      <article id="mina.easeinout">
9897                          <header>
9898                              <h3 class="dr-method">mina.easeinout(n)<a href="#mina.easeinout" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 262 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L262">&#x27ad;</a></h3>
9899                          </header>
9900                          <section>
9901                              <div class="extra" id="mina.easeinout-extra"></div>
9902                              <div class="dr-method">
9903
9904
9905
9906
9907                                  <p>Easeinout easing
9908</p>
9909
9910
9911
9912
9913
9914
9915
9916
9917
9918
9919                                  <div class="topcoat-list__container">
9920                                      <h3 class="topcoat-list__header">Parameters</h3>
9921                                      <ol class="topcoat-list">
9922                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
9923                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9924                                              <span class="dr-description">input 0..1</span></li>
9925
9926                                      </ol>
9927                                  </div>
9928
9929
9930
9931
9932
9933
9934
9935
9936
9937
9938
9939
9940
9941                                  <p class="dr-returns">
9942                                      <strong class="dr-title">Returns:</strong>
9943
9944                                      <em class="dr-type-number">number</em>
9945
9946                                      <span class="dr-description">output 0..1</span>
9947                                  </p>
9948
9949
9950
9951
9952                              </div>
9953                          </section>
9954                      </article>
9955
9956                      <article id="mina.backin">
9957                          <header>
9958                              <h3 class="dr-method">mina.backin(n)<a href="#mina.backin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 286 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L286">&#x27ad;</a></h3>
9959                          </header>
9960                          <section>
9961                              <div class="extra" id="mina.backin-extra"></div>
9962                              <div class="dr-method">
9963
9964
9965
9966
9967                                  <p>Backin easing
9968</p>
9969
9970
9971
9972
9973
9974
9975
9976
9977
9978
9979                                  <div class="topcoat-list__container">
9980                                      <h3 class="topcoat-list__header">Parameters</h3>
9981                                      <ol class="topcoat-list">
9982                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
9983                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
9984                                              <span class="dr-description">input 0..1</span></li>
9985
9986                                      </ol>
9987                                  </div>
9988
9989
9990
9991
9992
9993
9994
9995
9996
9997
9998
9999
10000
10001                                  <p class="dr-returns">
10002                                      <strong class="dr-title">Returns:</strong>
10003
10004                                      <em class="dr-type-number">number</em>
10005
10006                                      <span class="dr-description">output 0..1</span>
10007                                  </p>
10008
10009
10010
10011
10012                              </div>
10013                          </section>
10014                      </article>
10015
10016                      <article id="mina.backout">
10017                          <header>
10018                              <h3 class="dr-method">mina.backout(n)<a href="#mina.backout" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 301 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L301">&#x27ad;</a></h3>
10019                          </header>
10020                          <section>
10021                              <div class="extra" id="mina.backout-extra"></div>
10022                              <div class="dr-method">
10023
10024
10025
10026
10027                                  <p>Backout easing
10028</p>
10029
10030
10031
10032
10033
10034
10035
10036
10037
10038
10039                                  <div class="topcoat-list__container">
10040                                      <h3 class="topcoat-list__header">Parameters</h3>
10041                                      <ol class="topcoat-list">
10042                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
10043                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10044                                              <span class="dr-description">input 0..1</span></li>
10045
10046                                      </ol>
10047                                  </div>
10048
10049
10050
10051
10052
10053
10054
10055
10056
10057
10058
10059
10060
10061                                  <p class="dr-returns">
10062                                      <strong class="dr-title">Returns:</strong>
10063
10064                                      <em class="dr-type-number">number</em>
10065
10066                                      <span class="dr-description">output 0..1</span>
10067                                  </p>
10068
10069
10070
10071
10072                              </div>
10073                          </section>
10074                      </article>
10075
10076                      <article id="mina.elastic">
10077                          <header>
10078                              <h3 class="dr-method">mina.elastic(n)<a href="#mina.elastic" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 317 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L317">&#x27ad;</a></h3>
10079                          </header>
10080                          <section>
10081                              <div class="extra" id="mina.elastic-extra"></div>
10082                              <div class="dr-method">
10083
10084
10085
10086
10087                                  <p>Elastic easing
10088</p>
10089
10090
10091
10092
10093
10094
10095
10096
10097
10098
10099                                  <div class="topcoat-list__container">
10100                                      <h3 class="topcoat-list__header">Parameters</h3>
10101                                      <ol class="topcoat-list">
10102                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
10103                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10104                                              <span class="dr-description">input 0..1</span></li>
10105
10106                                      </ol>
10107                                  </div>
10108
10109
10110
10111
10112
10113
10114
10115
10116
10117
10118
10119
10120
10121                                  <p class="dr-returns">
10122                                      <strong class="dr-title">Returns:</strong>
10123
10124                                      <em class="dr-type-number">number</em>
10125
10126                                      <span class="dr-description">output 0..1</span>
10127                                  </p>
10128
10129
10130
10131
10132                              </div>
10133                          </section>
10134                      </article>
10135
10136                      <article id="mina.bounce">
10137                          <header>
10138                              <h3 class="dr-method">mina.bounce(n)<a href="#mina.bounce" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 332 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L332">&#x27ad;</a></h3>
10139                          </header>
10140                          <section>
10141                              <div class="extra" id="mina.bounce-extra"></div>
10142                              <div class="dr-method">
10143
10144
10145
10146
10147                                  <p>Bounce easing
10148</p>
10149
10150
10151
10152
10153
10154
10155
10156
10157
10158
10159                                  <div class="topcoat-list__container">
10160                                      <h3 class="topcoat-list__header">Parameters</h3>
10161                                      <ol class="topcoat-list">
10162                                          <li class="topcoat-list__item"><span class="dr-param">n</span>
10163                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10164                                              <span class="dr-description">input 0..1</span></li>
10165
10166                                      </ol>
10167                                  </div>
10168
10169
10170
10171
10172
10173
10174
10175
10176
10177
10178
10179
10180
10181                                  <p class="dr-returns">
10182                                      <strong class="dr-title">Returns:</strong>
10183
10184                                      <em class="dr-type-number">number</em>
10185
10186                                      <span class="dr-description">output 0..1</span>
10187                                  </p>
10188
10189
10190
10191
10192                              </div>
10193                          </section>
10194                      </article>
10195
10196                      <article id="Paper.filter">
10197                          <header>
10198                              <h3 class="dr-method">Paper.filter(filstr)<a href="#Paper.filter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 36 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L36">&#x27ad;</a></h3>
10199                          </header>
10200                          <section>
10201                              <div class="extra" id="Paper.filter-extra"></div>
10202                              <div class="dr-method">
10203
10204
10205
10206
10207                                  <p>Creates a <code>&lt;filter&gt;</code> element
10208</p>
10209
10210
10211
10212
10213
10214
10215
10216
10217
10218
10219                                  <div class="topcoat-list__container">
10220                                      <h3 class="topcoat-list__header">Parameters</h3>
10221                                      <ol class="topcoat-list">
10222                                          <li class="topcoat-list__item"><span class="dr-param">filstr</span>
10223                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
10224                                              <span class="dr-description">SVG fragment of filter provided as a string</span></li>
10225
10226                                      </ol>
10227                                  </div>
10228
10229
10230
10231
10232
10233
10234
10235
10236
10237
10238
10239
10240
10241                                  <p class="dr-returns">
10242                                      <strong class="dr-title">Returns:</strong>
10243
10244                                      <em class="dr-type-object">object</em>
10245
10246                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
10247                                  </p>
10248
10249
10250
10251
10252
10253                                  <p>Note: It is recommended to use filters embedded into the page inside an empty SVG element.
10254</p>
10255
10256
10257
10258
10259
10260
10261
10262
10263
10264
10265
10266
10267                                  <h3>Usage</h3>
10268
10269
10270
10271
10272
10273
10274
10275
10276
10277
10278
10279                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var f = paper.filter('<feGaussianBlur stdDeviation="2"/>'),
10280    c = paper.circle(10, 10, 10).attr({
10281        filter: f
10282    });</code></pre></section>
10283
10284
10285
10286
10287
10288                              </div>
10289                          </section>
10290                      </article>
10291
10292                      <article id="Snap.filter.blur">
10293                          <header>
10294                              <h3 class="dr-method">Snap.filter.blur(x, [y])<a href="#Snap.filter.blur" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 95 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L95">&#x27ad;</a></h3>
10295                          </header>
10296                          <section>
10297                              <div class="extra" id="Snap.filter.blur-extra"></div>
10298                              <div class="dr-method">
10299
10300
10301
10302
10303                                  <p>Returns an SVG markup string for the blur filter
10304</p>
10305
10306
10307
10308
10309
10310
10311
10312
10313
10314
10315                                  <div class="topcoat-list__container">
10316                                      <h3 class="topcoat-list__header">Parameters</h3>
10317                                      <ol class="topcoat-list">
10318                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
10319                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10320                                              <span class="dr-description">amount of horizontal blur, in pixels</span></li>
10321                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
10322                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10323                                              <span class="dr-description">amount of vertical blur, in pixels</span></li>
10324
10325                                      </ol>
10326                                  </div>
10327
10328
10329
10330
10331
10332
10333
10334
10335
10336
10337
10338
10339
10340                                  <p class="dr-returns">
10341                                      <strong class="dr-title">Returns:</strong>
10342
10343                                      <em class="dr-type-string">string</em>
10344
10345                                      <span class="dr-description">filter representation</span>
10346                                  </p>
10347
10348
10349
10350
10351
10352
10353
10354
10355                                  <h3>Usage</h3>
10356
10357
10358
10359
10360
10361
10362
10363
10364
10365
10366
10367                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var f = paper.filter(Snap.filter.blur(5, 10)),
10368    c = paper.circle(10, 10, 10).attr({
10369        filter: f
10370    });</code></pre></section>
10371
10372
10373
10374
10375
10376                              </div>
10377                          </section>
10378                      </article>
10379
10380                      <article id="Snap.filter.shadow">
10381                          <header>
10382                              <h3 class="dr-method">Snap.filter.shadow(…)<a href="#Snap.filter.shadow" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 134 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L134">&#x27ad;</a></h3>
10383                          </header>
10384                          <section>
10385                              <div class="extra" id="Snap.filter.shadow-extra"></div>
10386                              <div class="dr-method">
10387
10388
10389
10390
10391                                  <p>Returns an SVG markup string for the shadow filter
10392</p>
10393
10394
10395
10396
10397
10398
10399
10400
10401
10402
10403                                  <div class="topcoat-list__container">
10404                                      <h3 class="topcoat-list__header">Parameters</h3>
10405                                      <ol class="topcoat-list">
10406                                          <li class="topcoat-list__item"><span class="dr-param">dx</span>
10407                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10408                                              <span class="dr-description">horizontal shift of the shadow, in pixels</span></li>
10409                                          <li class="topcoat-list__item"><span class="dr-param">dy</span>
10410                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10411                                              <span class="dr-description">vertical shift of the shadow, in pixels</span></li>
10412                                          <li class="topcoat-list__item"><span class="dr-param">blur</span>
10413                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10414                                              <span class="dr-description">amount of blur</span></li>
10415                                          <li class="topcoat-list__item"><span class="dr-param">color</span>
10416                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
10417                                              <span class="dr-description">color of the shadow</span></li>
10418                                          <li class="topcoat-list__item"><span class="dr-param">opacity</span>
10419                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10420                                              <span class="dr-description"><code>0..1</code> opacity of the shadow</span></li>
10421
10422                                      </ol>
10423                                  </div>
10424
10425
10426
10427
10428
10429
10430
10431
10432                                  <p>or
10433</p>
10434
10435
10436
10437
10438
10439
10440
10441
10442
10443
10444                                  <div class="topcoat-list__container">
10445                                      <h3 class="topcoat-list__header">Parameters</h3>
10446                                      <ol class="topcoat-list">
10447                                          <li class="topcoat-list__item"><span class="dr-param">dx</span>
10448                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10449                                              <span class="dr-description">horizontal shift of the shadow, in pixels</span></li>
10450                                          <li class="topcoat-list__item"><span class="dr-param">dy</span>
10451                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10452                                              <span class="dr-description">vertical shift of the shadow, in pixels</span></li>
10453                                          <li class="topcoat-list__item"><span class="dr-param">color</span>
10454                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
10455                                              <span class="dr-description">color of the shadow</span></li>
10456                                          <li class="topcoat-list__item"><span class="dr-param">opacity</span>
10457                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10458                                              <span class="dr-description"><code>0..1</code> opacity of the shadow</span></li>
10459
10460                                      </ol>
10461                                  </div>
10462
10463
10464
10465
10466
10467
10468
10469
10470                                  <p>which makes blur default to <code>4</code>. Or
10471</p>
10472
10473
10474
10475
10476
10477
10478
10479
10480
10481
10482                                  <div class="topcoat-list__container">
10483                                      <h3 class="topcoat-list__header">Parameters</h3>
10484                                      <ol class="topcoat-list">
10485                                          <li class="topcoat-list__item"><span class="dr-param">dx</span>
10486                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10487                                              <span class="dr-description">horizontal shift of the shadow, in pixels</span></li>
10488                                          <li class="topcoat-list__item"><span class="dr-param">dy</span>
10489                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10490                                              <span class="dr-description">vertical shift of the shadow, in pixels</span></li>
10491                                          <li class="topcoat-list__item"><span class="dr-param">opacity</span>
10492                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10493                                              <span class="dr-description"><code>0..1</code> opacity of the shadow</span></li>
10494
10495                                      </ol>
10496                                  </div>
10497
10498
10499
10500
10501
10502
10503
10504
10505
10506
10507
10508
10509
10510                                  <p class="dr-returns">
10511                                      <strong class="dr-title">Returns:</strong>
10512
10513                                      <em class="dr-type-string">string</em>
10514
10515                                      <span class="dr-description">filter representation</span>
10516                                  </p>
10517
10518
10519
10520
10521
10522
10523
10524
10525                                  <h3>Usage</h3>
10526
10527
10528
10529
10530
10531
10532
10533
10534
10535
10536
10537                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var f = paper.filter(Snap.filter.shadow(0, 2, 3)),
10538    c = paper.circle(10, 10, 10).attr({
10539        filter: f
10540    });</code></pre></section>
10541
10542
10543
10544
10545
10546                              </div>
10547                          </section>
10548                      </article>
10549
10550                      <article id="Snap.filter.grayscale">
10551                          <header>
10552                              <h3 class="dr-method">Snap.filter.grayscale(amount)<a href="#Snap.filter.grayscale" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 179 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L179">&#x27ad;</a></h3>
10553                          </header>
10554                          <section>
10555                              <div class="extra" id="Snap.filter.grayscale-extra"></div>
10556                              <div class="dr-method">
10557
10558
10559
10560
10561                                  <p>Returns an SVG markup string for the grayscale filter
10562</p>
10563
10564
10565
10566
10567
10568
10569
10570
10571
10572
10573                                  <div class="topcoat-list__container">
10574                                      <h3 class="topcoat-list__header">Parameters</h3>
10575                                      <ol class="topcoat-list">
10576                                          <li class="topcoat-list__item"><span class="dr-param">amount</span>
10577                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10578                                              <span class="dr-description">amount of filter (<code>0..1</code>)</span></li>
10579
10580                                      </ol>
10581                                  </div>
10582
10583
10584
10585
10586
10587
10588
10589
10590
10591
10592
10593
10594
10595                                  <p class="dr-returns">
10596                                      <strong class="dr-title">Returns:</strong>
10597
10598                                      <em class="dr-type-string">string</em>
10599
10600                                      <span class="dr-description">filter representation</span>
10601                                  </p>
10602
10603
10604
10605
10606                              </div>
10607                          </section>
10608                      </article>
10609
10610                      <article id="Snap.filter.sepia">
10611                          <header>
10612                              <h3 class="dr-method">Snap.filter.sepia(amount)<a href="#Snap.filter.sepia" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 206 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L206">&#x27ad;</a></h3>
10613                          </header>
10614                          <section>
10615                              <div class="extra" id="Snap.filter.sepia-extra"></div>
10616                              <div class="dr-method">
10617
10618
10619
10620
10621                                  <p>Returns an SVG markup string for the sepia filter
10622</p>
10623
10624
10625
10626
10627
10628
10629
10630
10631
10632
10633                                  <div class="topcoat-list__container">
10634                                      <h3 class="topcoat-list__header">Parameters</h3>
10635                                      <ol class="topcoat-list">
10636                                          <li class="topcoat-list__item"><span class="dr-param">amount</span>
10637                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10638                                              <span class="dr-description">amount of filter (<code>0..1</code>)</span></li>
10639
10640                                      </ol>
10641                                  </div>
10642
10643
10644
10645
10646
10647
10648
10649
10650
10651
10652
10653
10654
10655                                  <p class="dr-returns">
10656                                      <strong class="dr-title">Returns:</strong>
10657
10658                                      <em class="dr-type-string">string</em>
10659
10660                                      <span class="dr-description">filter representation</span>
10661                                  </p>
10662
10663
10664
10665
10666                              </div>
10667                          </section>
10668                      </article>
10669
10670                      <article id="Snap.filter.saturate">
10671                          <header>
10672                              <h3 class="dr-method">Snap.filter.saturate(amount)<a href="#Snap.filter.saturate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 234 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L234">&#x27ad;</a></h3>
10673                          </header>
10674                          <section>
10675                              <div class="extra" id="Snap.filter.saturate-extra"></div>
10676                              <div class="dr-method">
10677
10678
10679
10680
10681                                  <p>Returns an SVG markup string for the saturate filter
10682</p>
10683
10684
10685
10686
10687
10688
10689
10690
10691
10692
10693                                  <div class="topcoat-list__container">
10694                                      <h3 class="topcoat-list__header">Parameters</h3>
10695                                      <ol class="topcoat-list">
10696                                          <li class="topcoat-list__item"><span class="dr-param">amount</span>
10697                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10698                                              <span class="dr-description">amount of filter (<code>0..1</code>)</span></li>
10699
10700                                      </ol>
10701                                  </div>
10702
10703
10704
10705
10706
10707
10708
10709
10710
10711
10712
10713
10714
10715                                  <p class="dr-returns">
10716                                      <strong class="dr-title">Returns:</strong>
10717
10718                                      <em class="dr-type-string">string</em>
10719
10720                                      <span class="dr-description">filter representation</span>
10721                                  </p>
10722
10723
10724
10725
10726                              </div>
10727                          </section>
10728                      </article>
10729
10730                      <article id="Snap.filter.hueRotate">
10731                          <header>
10732                              <h3 class="dr-method">Snap.filter.hueRotate(angle)<a href="#Snap.filter.hueRotate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 254 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L254">&#x27ad;</a></h3>
10733                          </header>
10734                          <section>
10735                              <div class="extra" id="Snap.filter.hueRotate-extra"></div>
10736                              <div class="dr-method">
10737
10738
10739
10740
10741                                  <p>Returns an SVG markup string for the hue-rotate filter
10742</p>
10743
10744
10745
10746
10747
10748
10749
10750
10751
10752
10753                                  <div class="topcoat-list__container">
10754                                      <h3 class="topcoat-list__header">Parameters</h3>
10755                                      <ol class="topcoat-list">
10756                                          <li class="topcoat-list__item"><span class="dr-param">angle</span>
10757                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10758                                              <span class="dr-description">angle of rotation</span></li>
10759
10760                                      </ol>
10761                                  </div>
10762
10763
10764
10765
10766
10767
10768
10769
10770
10771
10772
10773
10774
10775                                  <p class="dr-returns">
10776                                      <strong class="dr-title">Returns:</strong>
10777
10778                                      <em class="dr-type-string">string</em>
10779
10780                                      <span class="dr-description">filter representation</span>
10781                                  </p>
10782
10783
10784
10785
10786                              </div>
10787                          </section>
10788                      </article>
10789
10790                      <article id="Snap.filter.invert">
10791                          <header>
10792                              <h3 class="dr-method">Snap.filter.invert(amount)<a href="#Snap.filter.invert" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 272 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L272">&#x27ad;</a></h3>
10793                          </header>
10794                          <section>
10795                              <div class="extra" id="Snap.filter.invert-extra"></div>
10796                              <div class="dr-method">
10797
10798
10799
10800
10801                                  <p>Returns an SVG markup string for the invert filter
10802</p>
10803
10804
10805
10806
10807
10808
10809
10810
10811
10812
10813                                  <div class="topcoat-list__container">
10814                                      <h3 class="topcoat-list__header">Parameters</h3>
10815                                      <ol class="topcoat-list">
10816                                          <li class="topcoat-list__item"><span class="dr-param">amount</span>
10817                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10818                                              <span class="dr-description">amount of filter (<code>0..1</code>)</span></li>
10819
10820                                      </ol>
10821                                  </div>
10822
10823
10824
10825
10826
10827
10828
10829
10830
10831
10832
10833
10834
10835                                  <p class="dr-returns">
10836                                      <strong class="dr-title">Returns:</strong>
10837
10838                                      <em class="dr-type-string">string</em>
10839
10840                                      <span class="dr-description">filter representation</span>
10841                                  </p>
10842
10843
10844
10845
10846                              </div>
10847                          </section>
10848                      </article>
10849
10850                      <article id="Snap.filter.brightness">
10851                          <header>
10852                              <h3 class="dr-method">Snap.filter.brightness(amount)<a href="#Snap.filter.brightness" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 294 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L294">&#x27ad;</a></h3>
10853                          </header>
10854                          <section>
10855                              <div class="extra" id="Snap.filter.brightness-extra"></div>
10856                              <div class="dr-method">
10857
10858
10859
10860
10861                                  <p>Returns an SVG markup string for the brightness filter
10862</p>
10863
10864
10865
10866
10867
10868
10869
10870
10871
10872
10873                                  <div class="topcoat-list__container">
10874                                      <h3 class="topcoat-list__header">Parameters</h3>
10875                                      <ol class="topcoat-list">
10876                                          <li class="topcoat-list__item"><span class="dr-param">amount</span>
10877                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10878                                              <span class="dr-description">amount of filter (<code>0..1</code>)</span></li>
10879
10880                                      </ol>
10881                                  </div>
10882
10883
10884
10885
10886
10887
10888
10889
10890
10891
10892
10893
10894
10895                                  <p class="dr-returns">
10896                                      <strong class="dr-title">Returns:</strong>
10897
10898                                      <em class="dr-type-string">string</em>
10899
10900                                      <span class="dr-description">filter representation</span>
10901                                  </p>
10902
10903
10904
10905
10906                              </div>
10907                          </section>
10908                      </article>
10909
10910                      <article id="Snap.filter.contrast">
10911                          <header>
10912                              <h3 class="dr-method">Snap.filter.contrast(amount)<a href="#Snap.filter.contrast" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 314 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L314">&#x27ad;</a></h3>
10913                          </header>
10914                          <section>
10915                              <div class="extra" id="Snap.filter.contrast-extra"></div>
10916                              <div class="dr-method">
10917
10918
10919
10920
10921                                  <p>Returns an SVG markup string for the contrast filter
10922</p>
10923
10924
10925
10926
10927
10928
10929
10930
10931
10932
10933                                  <div class="topcoat-list__container">
10934                                      <h3 class="topcoat-list__header">Parameters</h3>
10935                                      <ol class="topcoat-list">
10936                                          <li class="topcoat-list__item"><span class="dr-param">amount</span>
10937                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
10938                                              <span class="dr-description">amount of filter (<code>0..1</code>)</span></li>
10939
10940                                      </ol>
10941                                  </div>
10942
10943
10944
10945
10946
10947
10948
10949
10950
10951
10952
10953
10954
10955                                  <p class="dr-returns">
10956                                      <strong class="dr-title">Returns:</strong>
10957
10958                                      <em class="dr-type-string">string</em>
10959
10960                                      <span class="dr-description">filter representation</span>
10961                                  </p>
10962
10963
10964
10965
10966                              </div>
10967                          </section>
10968                      </article>
10969
10970                      <article id="Element.click">
10971                          <header>
10972                              <h3 class="dr-method">Element.click(handler)<a href="#Element.click" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 143 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L143">&#x27ad;</a></h3>
10973                          </header>
10974                          <section>
10975                              <div class="extra" id="Element.click-extra"></div>
10976                              <div class="dr-method">
10977
10978
10979
10980
10981                                  <p>Adds a click event handler to the element
10982</p>
10983
10984
10985
10986
10987
10988
10989
10990
10991
10992
10993                                  <div class="topcoat-list__container">
10994                                      <h3 class="topcoat-list__header">Parameters</h3>
10995                                      <ol class="topcoat-list">
10996                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
10997                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
10998                                              <span class="dr-description">handler for the event</span></li>
10999
11000                                      </ol>
11001                                  </div>
11002
11003
11004
11005
11006
11007
11008
11009
11010
11011
11012
11013
11014
11015                                  <p class="dr-returns">
11016                                      <strong class="dr-title">Returns:</strong>
11017
11018                                      <em class="dr-type-object">object</em>
11019
11020                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11021                                  </p>
11022
11023
11024
11025
11026                              </div>
11027                          </section>
11028                      </article>
11029
11030                      <article id="Element.unclick">
11031                          <header>
11032                              <h3 class="dr-method">Element.unclick(handler)<a href="#Element.unclick" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 151 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L151">&#x27ad;</a></h3>
11033                          </header>
11034                          <section>
11035                              <div class="extra" id="Element.unclick-extra"></div>
11036                              <div class="dr-method">
11037
11038
11039
11040
11041                                  <p>Removes a click event handler from the element
11042</p>
11043
11044
11045
11046
11047
11048
11049
11050
11051
11052
11053                                  <div class="topcoat-list__container">
11054                                      <h3 class="topcoat-list__header">Parameters</h3>
11055                                      <ol class="topcoat-list">
11056                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11057                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11058                                              <span class="dr-description">handler for the event</span></li>
11059
11060                                      </ol>
11061                                  </div>
11062
11063
11064
11065
11066
11067
11068
11069
11070
11071
11072
11073
11074
11075                                  <p class="dr-returns">
11076                                      <strong class="dr-title">Returns:</strong>
11077
11078                                      <em class="dr-type-object">object</em>
11079
11080                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11081                                  </p>
11082
11083
11084
11085
11086                              </div>
11087                          </section>
11088                      </article>
11089
11090                      <article id="Element.dblclick">
11091                          <header>
11092                              <h3 class="dr-method">Element.dblclick(handler)<a href="#Element.dblclick" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 160 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L160">&#x27ad;</a></h3>
11093                          </header>
11094                          <section>
11095                              <div class="extra" id="Element.dblclick-extra"></div>
11096                              <div class="dr-method">
11097
11098
11099
11100
11101                                  <p>Adds a double click event handler to the element
11102</p>
11103
11104
11105
11106
11107
11108
11109
11110
11111
11112
11113                                  <div class="topcoat-list__container">
11114                                      <h3 class="topcoat-list__header">Parameters</h3>
11115                                      <ol class="topcoat-list">
11116                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11117                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11118                                              <span class="dr-description">handler for the event</span></li>
11119
11120                                      </ol>
11121                                  </div>
11122
11123
11124
11125
11126
11127
11128
11129
11130
11131
11132
11133
11134
11135                                  <p class="dr-returns">
11136                                      <strong class="dr-title">Returns:</strong>
11137
11138                                      <em class="dr-type-object">object</em>
11139
11140                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11141                                  </p>
11142
11143
11144
11145
11146                              </div>
11147                          </section>
11148                      </article>
11149
11150                      <article id="Element.undblclick">
11151                          <header>
11152                              <h3 class="dr-method">Element.undblclick(handler)<a href="#Element.undblclick" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 168 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L168">&#x27ad;</a></h3>
11153                          </header>
11154                          <section>
11155                              <div class="extra" id="Element.undblclick-extra"></div>
11156                              <div class="dr-method">
11157
11158
11159
11160
11161                                  <p>Removes a double click event handler from the element
11162</p>
11163
11164
11165
11166
11167
11168
11169
11170
11171
11172
11173                                  <div class="topcoat-list__container">
11174                                      <h3 class="topcoat-list__header">Parameters</h3>
11175                                      <ol class="topcoat-list">
11176                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11177                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11178                                              <span class="dr-description">handler for the event</span></li>
11179
11180                                      </ol>
11181                                  </div>
11182
11183
11184
11185
11186
11187
11188
11189
11190
11191
11192
11193
11194
11195                                  <p class="dr-returns">
11196                                      <strong class="dr-title">Returns:</strong>
11197
11198                                      <em class="dr-type-object">object</em>
11199
11200                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11201                                  </p>
11202
11203
11204
11205
11206                              </div>
11207                          </section>
11208                      </article>
11209
11210                      <article id="Element.mousedown">
11211                          <header>
11212                              <h3 class="dr-method">Element.mousedown(handler)<a href="#Element.mousedown" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 177 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L177">&#x27ad;</a></h3>
11213                          </header>
11214                          <section>
11215                              <div class="extra" id="Element.mousedown-extra"></div>
11216                              <div class="dr-method">
11217
11218
11219
11220
11221                                  <p>Adds a mousedown event handler to the element
11222</p>
11223
11224
11225
11226
11227
11228
11229
11230
11231
11232
11233                                  <div class="topcoat-list__container">
11234                                      <h3 class="topcoat-list__header">Parameters</h3>
11235                                      <ol class="topcoat-list">
11236                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11237                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11238                                              <span class="dr-description">handler for the event</span></li>
11239
11240                                      </ol>
11241                                  </div>
11242
11243
11244
11245
11246
11247
11248
11249
11250
11251
11252
11253
11254
11255                                  <p class="dr-returns">
11256                                      <strong class="dr-title">Returns:</strong>
11257
11258                                      <em class="dr-type-object">object</em>
11259
11260                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11261                                  </p>
11262
11263
11264
11265
11266                              </div>
11267                          </section>
11268                      </article>
11269
11270                      <article id="Element.unmousedown">
11271                          <header>
11272                              <h3 class="dr-method">Element.unmousedown(handler)<a href="#Element.unmousedown" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 185 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L185">&#x27ad;</a></h3>
11273                          </header>
11274                          <section>
11275                              <div class="extra" id="Element.unmousedown-extra"></div>
11276                              <div class="dr-method">
11277
11278
11279
11280
11281                                  <p>Removes a mousedown event handler from the element
11282</p>
11283
11284
11285
11286
11287
11288
11289
11290
11291
11292
11293                                  <div class="topcoat-list__container">
11294                                      <h3 class="topcoat-list__header">Parameters</h3>
11295                                      <ol class="topcoat-list">
11296                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11297                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11298                                              <span class="dr-description">handler for the event</span></li>
11299
11300                                      </ol>
11301                                  </div>
11302
11303
11304
11305
11306
11307
11308
11309
11310
11311
11312
11313
11314
11315                                  <p class="dr-returns">
11316                                      <strong class="dr-title">Returns:</strong>
11317
11318                                      <em class="dr-type-object">object</em>
11319
11320                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11321                                  </p>
11322
11323
11324
11325
11326                              </div>
11327                          </section>
11328                      </article>
11329
11330                      <article id="Element.mousemove">
11331                          <header>
11332                              <h3 class="dr-method">Element.mousemove(handler)<a href="#Element.mousemove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 194 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L194">&#x27ad;</a></h3>
11333                          </header>
11334                          <section>
11335                              <div class="extra" id="Element.mousemove-extra"></div>
11336                              <div class="dr-method">
11337
11338
11339
11340
11341                                  <p>Adds a mousemove event handler to the element
11342</p>
11343
11344
11345
11346
11347
11348
11349
11350
11351
11352
11353                                  <div class="topcoat-list__container">
11354                                      <h3 class="topcoat-list__header">Parameters</h3>
11355                                      <ol class="topcoat-list">
11356                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11357                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11358                                              <span class="dr-description">handler for the event</span></li>
11359
11360                                      </ol>
11361                                  </div>
11362
11363
11364
11365
11366
11367
11368
11369
11370
11371
11372
11373
11374
11375                                  <p class="dr-returns">
11376                                      <strong class="dr-title">Returns:</strong>
11377
11378                                      <em class="dr-type-object">object</em>
11379
11380                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11381                                  </p>
11382
11383
11384
11385
11386                              </div>
11387                          </section>
11388                      </article>
11389
11390                      <article id="Element.unmousemove">
11391                          <header>
11392                              <h3 class="dr-method">Element.unmousemove(handler)<a href="#Element.unmousemove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 202 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L202">&#x27ad;</a></h3>
11393                          </header>
11394                          <section>
11395                              <div class="extra" id="Element.unmousemove-extra"></div>
11396                              <div class="dr-method">
11397
11398
11399
11400
11401                                  <p>Removes a mousemove event handler from the element
11402</p>
11403
11404
11405
11406
11407
11408
11409
11410
11411
11412
11413                                  <div class="topcoat-list__container">
11414                                      <h3 class="topcoat-list__header">Parameters</h3>
11415                                      <ol class="topcoat-list">
11416                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11417                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11418                                              <span class="dr-description">handler for the event</span></li>
11419
11420                                      </ol>
11421                                  </div>
11422
11423
11424
11425
11426
11427
11428
11429
11430
11431
11432
11433
11434
11435                                  <p class="dr-returns">
11436                                      <strong class="dr-title">Returns:</strong>
11437
11438                                      <em class="dr-type-object">object</em>
11439
11440                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11441                                  </p>
11442
11443
11444
11445
11446                              </div>
11447                          </section>
11448                      </article>
11449
11450                      <article id="Element.mouseout">
11451                          <header>
11452                              <h3 class="dr-method">Element.mouseout(handler)<a href="#Element.mouseout" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 211 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L211">&#x27ad;</a></h3>
11453                          </header>
11454                          <section>
11455                              <div class="extra" id="Element.mouseout-extra"></div>
11456                              <div class="dr-method">
11457
11458
11459
11460
11461                                  <p>Adds a mouseout event handler to the element
11462</p>
11463
11464
11465
11466
11467
11468
11469
11470
11471
11472
11473                                  <div class="topcoat-list__container">
11474                                      <h3 class="topcoat-list__header">Parameters</h3>
11475                                      <ol class="topcoat-list">
11476                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11477                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11478                                              <span class="dr-description">handler for the event</span></li>
11479
11480                                      </ol>
11481                                  </div>
11482
11483
11484
11485
11486
11487
11488
11489
11490
11491
11492
11493
11494
11495                                  <p class="dr-returns">
11496                                      <strong class="dr-title">Returns:</strong>
11497
11498                                      <em class="dr-type-object">object</em>
11499
11500                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11501                                  </p>
11502
11503
11504
11505
11506                              </div>
11507                          </section>
11508                      </article>
11509
11510                      <article id="Element.unmouseout">
11511                          <header>
11512                              <h3 class="dr-method">Element.unmouseout(handler)<a href="#Element.unmouseout" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 219 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L219">&#x27ad;</a></h3>
11513                          </header>
11514                          <section>
11515                              <div class="extra" id="Element.unmouseout-extra"></div>
11516                              <div class="dr-method">
11517
11518
11519
11520
11521                                  <p>Removes a mouseout event handler from the element
11522</p>
11523
11524
11525
11526
11527
11528
11529
11530
11531
11532
11533                                  <div class="topcoat-list__container">
11534                                      <h3 class="topcoat-list__header">Parameters</h3>
11535                                      <ol class="topcoat-list">
11536                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11537                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11538                                              <span class="dr-description">handler for the event</span></li>
11539
11540                                      </ol>
11541                                  </div>
11542
11543
11544
11545
11546
11547
11548
11549
11550
11551
11552
11553
11554
11555                                  <p class="dr-returns">
11556                                      <strong class="dr-title">Returns:</strong>
11557
11558                                      <em class="dr-type-object">object</em>
11559
11560                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11561                                  </p>
11562
11563
11564
11565
11566                              </div>
11567                          </section>
11568                      </article>
11569
11570                      <article id="Element.mouseover">
11571                          <header>
11572                              <h3 class="dr-method">Element.mouseover(handler)<a href="#Element.mouseover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 228 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L228">&#x27ad;</a></h3>
11573                          </header>
11574                          <section>
11575                              <div class="extra" id="Element.mouseover-extra"></div>
11576                              <div class="dr-method">
11577
11578
11579
11580
11581                                  <p>Adds a mouseover event handler to the element
11582</p>
11583
11584
11585
11586
11587
11588
11589
11590
11591
11592
11593                                  <div class="topcoat-list__container">
11594                                      <h3 class="topcoat-list__header">Parameters</h3>
11595                                      <ol class="topcoat-list">
11596                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11597                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11598                                              <span class="dr-description">handler for the event</span></li>
11599
11600                                      </ol>
11601                                  </div>
11602
11603
11604
11605
11606
11607
11608
11609
11610
11611
11612
11613
11614
11615                                  <p class="dr-returns">
11616                                      <strong class="dr-title">Returns:</strong>
11617
11618                                      <em class="dr-type-object">object</em>
11619
11620                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11621                                  </p>
11622
11623
11624
11625
11626                              </div>
11627                          </section>
11628                      </article>
11629
11630                      <article id="Element.unmouseover">
11631                          <header>
11632                              <h3 class="dr-method">Element.unmouseover(handler)<a href="#Element.unmouseover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 236 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L236">&#x27ad;</a></h3>
11633                          </header>
11634                          <section>
11635                              <div class="extra" id="Element.unmouseover-extra"></div>
11636                              <div class="dr-method">
11637
11638
11639
11640
11641                                  <p>Removes a mouseover event handler from the element
11642</p>
11643
11644
11645
11646
11647
11648
11649
11650
11651
11652
11653                                  <div class="topcoat-list__container">
11654                                      <h3 class="topcoat-list__header">Parameters</h3>
11655                                      <ol class="topcoat-list">
11656                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11657                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11658                                              <span class="dr-description">handler for the event</span></li>
11659
11660                                      </ol>
11661                                  </div>
11662
11663
11664
11665
11666
11667
11668
11669
11670
11671
11672
11673
11674
11675                                  <p class="dr-returns">
11676                                      <strong class="dr-title">Returns:</strong>
11677
11678                                      <em class="dr-type-object">object</em>
11679
11680                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11681                                  </p>
11682
11683
11684
11685
11686                              </div>
11687                          </section>
11688                      </article>
11689
11690                      <article id="Element.mouseup">
11691                          <header>
11692                              <h3 class="dr-method">Element.mouseup(handler)<a href="#Element.mouseup" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 245 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L245">&#x27ad;</a></h3>
11693                          </header>
11694                          <section>
11695                              <div class="extra" id="Element.mouseup-extra"></div>
11696                              <div class="dr-method">
11697
11698
11699
11700
11701                                  <p>Adds a mouseup event handler to the element
11702</p>
11703
11704
11705
11706
11707
11708
11709
11710
11711
11712
11713                                  <div class="topcoat-list__container">
11714                                      <h3 class="topcoat-list__header">Parameters</h3>
11715                                      <ol class="topcoat-list">
11716                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11717                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11718                                              <span class="dr-description">handler for the event</span></li>
11719
11720                                      </ol>
11721                                  </div>
11722
11723
11724
11725
11726
11727
11728
11729
11730
11731
11732
11733
11734
11735                                  <p class="dr-returns">
11736                                      <strong class="dr-title">Returns:</strong>
11737
11738                                      <em class="dr-type-object">object</em>
11739
11740                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11741                                  </p>
11742
11743
11744
11745
11746                              </div>
11747                          </section>
11748                      </article>
11749
11750                      <article id="Element.unmouseup">
11751                          <header>
11752                              <h3 class="dr-method">Element.unmouseup(handler)<a href="#Element.unmouseup" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 253 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L253">&#x27ad;</a></h3>
11753                          </header>
11754                          <section>
11755                              <div class="extra" id="Element.unmouseup-extra"></div>
11756                              <div class="dr-method">
11757
11758
11759
11760
11761                                  <p>Removes a mouseup event handler from the element
11762</p>
11763
11764
11765
11766
11767
11768
11769
11770
11771
11772
11773                                  <div class="topcoat-list__container">
11774                                      <h3 class="topcoat-list__header">Parameters</h3>
11775                                      <ol class="topcoat-list">
11776                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11777                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11778                                              <span class="dr-description">handler for the event</span></li>
11779
11780                                      </ol>
11781                                  </div>
11782
11783
11784
11785
11786
11787
11788
11789
11790
11791
11792
11793
11794
11795                                  <p class="dr-returns">
11796                                      <strong class="dr-title">Returns:</strong>
11797
11798                                      <em class="dr-type-object">object</em>
11799
11800                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11801                                  </p>
11802
11803
11804
11805
11806                              </div>
11807                          </section>
11808                      </article>
11809
11810                      <article id="Element.touchstart">
11811                          <header>
11812                              <h3 class="dr-method">Element.touchstart(handler)<a href="#Element.touchstart" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 262 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L262">&#x27ad;</a></h3>
11813                          </header>
11814                          <section>
11815                              <div class="extra" id="Element.touchstart-extra"></div>
11816                              <div class="dr-method">
11817
11818
11819
11820
11821                                  <p>Adds a touchstart event handler to the element
11822</p>
11823
11824
11825
11826
11827
11828
11829
11830
11831
11832
11833                                  <div class="topcoat-list__container">
11834                                      <h3 class="topcoat-list__header">Parameters</h3>
11835                                      <ol class="topcoat-list">
11836                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11837                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11838                                              <span class="dr-description">handler for the event</span></li>
11839
11840                                      </ol>
11841                                  </div>
11842
11843
11844
11845
11846
11847
11848
11849
11850
11851
11852
11853
11854
11855                                  <p class="dr-returns">
11856                                      <strong class="dr-title">Returns:</strong>
11857
11858                                      <em class="dr-type-object">object</em>
11859
11860                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11861                                  </p>
11862
11863
11864
11865
11866                              </div>
11867                          </section>
11868                      </article>
11869
11870                      <article id="Element.untouchstart">
11871                          <header>
11872                              <h3 class="dr-method">Element.untouchstart(handler)<a href="#Element.untouchstart" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 270 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L270">&#x27ad;</a></h3>
11873                          </header>
11874                          <section>
11875                              <div class="extra" id="Element.untouchstart-extra"></div>
11876                              <div class="dr-method">
11877
11878
11879
11880
11881                                  <p>Removes a touchstart event handler from the element
11882</p>
11883
11884
11885
11886
11887
11888
11889
11890
11891
11892
11893                                  <div class="topcoat-list__container">
11894                                      <h3 class="topcoat-list__header">Parameters</h3>
11895                                      <ol class="topcoat-list">
11896                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11897                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11898                                              <span class="dr-description">handler for the event</span></li>
11899
11900                                      </ol>
11901                                  </div>
11902
11903
11904
11905
11906
11907
11908
11909
11910
11911
11912
11913
11914
11915                                  <p class="dr-returns">
11916                                      <strong class="dr-title">Returns:</strong>
11917
11918                                      <em class="dr-type-object">object</em>
11919
11920                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11921                                  </p>
11922
11923
11924
11925
11926                              </div>
11927                          </section>
11928                      </article>
11929
11930                      <article id="Element.touchmove">
11931                          <header>
11932                              <h3 class="dr-method">Element.touchmove(handler)<a href="#Element.touchmove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 279 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L279">&#x27ad;</a></h3>
11933                          </header>
11934                          <section>
11935                              <div class="extra" id="Element.touchmove-extra"></div>
11936                              <div class="dr-method">
11937
11938
11939
11940
11941                                  <p>Adds a touchmove event handler to the element
11942</p>
11943
11944
11945
11946
11947
11948
11949
11950
11951
11952
11953                                  <div class="topcoat-list__container">
11954                                      <h3 class="topcoat-list__header">Parameters</h3>
11955                                      <ol class="topcoat-list">
11956                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
11957                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
11958                                              <span class="dr-description">handler for the event</span></li>
11959
11960                                      </ol>
11961                                  </div>
11962
11963
11964
11965
11966
11967
11968
11969
11970
11971
11972
11973
11974
11975                                  <p class="dr-returns">
11976                                      <strong class="dr-title">Returns:</strong>
11977
11978                                      <em class="dr-type-object">object</em>
11979
11980                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
11981                                  </p>
11982
11983
11984
11985
11986                              </div>
11987                          </section>
11988                      </article>
11989
11990                      <article id="Element.untouchmove">
11991                          <header>
11992                              <h3 class="dr-method">Element.untouchmove(handler)<a href="#Element.untouchmove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 287 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L287">&#x27ad;</a></h3>
11993                          </header>
11994                          <section>
11995                              <div class="extra" id="Element.untouchmove-extra"></div>
11996                              <div class="dr-method">
11997
11998
11999
12000
12001                                  <p>Removes a touchmove event handler from the element
12002</p>
12003
12004
12005
12006
12007
12008
12009
12010
12011
12012
12013                                  <div class="topcoat-list__container">
12014                                      <h3 class="topcoat-list__header">Parameters</h3>
12015                                      <ol class="topcoat-list">
12016                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
12017                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12018                                              <span class="dr-description">handler for the event</span></li>
12019
12020                                      </ol>
12021                                  </div>
12022
12023
12024
12025
12026
12027
12028
12029
12030
12031
12032
12033
12034
12035                                  <p class="dr-returns">
12036                                      <strong class="dr-title">Returns:</strong>
12037
12038                                      <em class="dr-type-object">object</em>
12039
12040                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12041                                  </p>
12042
12043
12044
12045
12046                              </div>
12047                          </section>
12048                      </article>
12049
12050                      <article id="Element.touchend">
12051                          <header>
12052                              <h3 class="dr-method">Element.touchend(handler)<a href="#Element.touchend" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 296 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L296">&#x27ad;</a></h3>
12053                          </header>
12054                          <section>
12055                              <div class="extra" id="Element.touchend-extra"></div>
12056                              <div class="dr-method">
12057
12058
12059
12060
12061                                  <p>Adds a touchend event handler to the element
12062</p>
12063
12064
12065
12066
12067
12068
12069
12070
12071
12072
12073                                  <div class="topcoat-list__container">
12074                                      <h3 class="topcoat-list__header">Parameters</h3>
12075                                      <ol class="topcoat-list">
12076                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
12077                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12078                                              <span class="dr-description">handler for the event</span></li>
12079
12080                                      </ol>
12081                                  </div>
12082
12083
12084
12085
12086
12087
12088
12089
12090
12091
12092
12093
12094
12095                                  <p class="dr-returns">
12096                                      <strong class="dr-title">Returns:</strong>
12097
12098                                      <em class="dr-type-object">object</em>
12099
12100                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12101                                  </p>
12102
12103
12104
12105
12106                              </div>
12107                          </section>
12108                      </article>
12109
12110                      <article id="Element.untouchend">
12111                          <header>
12112                              <h3 class="dr-method">Element.untouchend(handler)<a href="#Element.untouchend" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 304 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L304">&#x27ad;</a></h3>
12113                          </header>
12114                          <section>
12115                              <div class="extra" id="Element.untouchend-extra"></div>
12116                              <div class="dr-method">
12117
12118
12119
12120
12121                                  <p>Removes a touchend event handler from the element
12122</p>
12123
12124
12125
12126
12127
12128
12129
12130
12131
12132
12133                                  <div class="topcoat-list__container">
12134                                      <h3 class="topcoat-list__header">Parameters</h3>
12135                                      <ol class="topcoat-list">
12136                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
12137                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12138                                              <span class="dr-description">handler for the event</span></li>
12139
12140                                      </ol>
12141                                  </div>
12142
12143
12144
12145
12146
12147
12148
12149
12150
12151
12152
12153
12154
12155                                  <p class="dr-returns">
12156                                      <strong class="dr-title">Returns:</strong>
12157
12158                                      <em class="dr-type-object">object</em>
12159
12160                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12161                                  </p>
12162
12163
12164
12165
12166                              </div>
12167                          </section>
12168                      </article>
12169
12170                      <article id="Element.touchcancel">
12171                          <header>
12172                              <h3 class="dr-method">Element.touchcancel(handler)<a href="#Element.touchcancel" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 313 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L313">&#x27ad;</a></h3>
12173                          </header>
12174                          <section>
12175                              <div class="extra" id="Element.touchcancel-extra"></div>
12176                              <div class="dr-method">
12177
12178
12179
12180
12181                                  <p>Adds a touchcancel event handler to the element
12182</p>
12183
12184
12185
12186
12187
12188
12189
12190
12191
12192
12193                                  <div class="topcoat-list__container">
12194                                      <h3 class="topcoat-list__header">Parameters</h3>
12195                                      <ol class="topcoat-list">
12196                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
12197                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12198                                              <span class="dr-description">handler for the event</span></li>
12199
12200                                      </ol>
12201                                  </div>
12202
12203
12204
12205
12206
12207
12208
12209
12210
12211
12212
12213
12214
12215                                  <p class="dr-returns">
12216                                      <strong class="dr-title">Returns:</strong>
12217
12218                                      <em class="dr-type-object">object</em>
12219
12220                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12221                                  </p>
12222
12223
12224
12225
12226                              </div>
12227                          </section>
12228                      </article>
12229
12230                      <article id="Element.untouchcancel">
12231                          <header>
12232                              <h3 class="dr-method">Element.untouchcancel(handler)<a href="#Element.untouchcancel" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 321 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L321">&#x27ad;</a></h3>
12233                          </header>
12234                          <section>
12235                              <div class="extra" id="Element.untouchcancel-extra"></div>
12236                              <div class="dr-method">
12237
12238
12239
12240
12241                                  <p>Removes a touchcancel event handler from the element
12242</p>
12243
12244
12245
12246
12247
12248
12249
12250
12251
12252
12253                                  <div class="topcoat-list__container">
12254                                      <h3 class="topcoat-list__header">Parameters</h3>
12255                                      <ol class="topcoat-list">
12256                                          <li class="topcoat-list__item"><span class="dr-param">handler</span>
12257                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12258                                              <span class="dr-description">handler for the event</span></li>
12259
12260                                      </ol>
12261                                  </div>
12262
12263
12264
12265
12266
12267
12268
12269
12270
12271
12272
12273
12274
12275                                  <p class="dr-returns">
12276                                      <strong class="dr-title">Returns:</strong>
12277
12278                                      <em class="dr-type-object">object</em>
12279
12280                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12281                                  </p>
12282
12283
12284
12285
12286                              </div>
12287                          </section>
12288                      </article>
12289
12290                      <article id="Element.hover">
12291                          <header>
12292                              <h3 class="dr-method">Element.hover(f_in, f_out, [icontext], [ocontext])<a href="#Element.hover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 366 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L366">&#x27ad;</a></h3>
12293                          </header>
12294                          <section>
12295                              <div class="extra" id="Element.hover-extra"></div>
12296                              <div class="dr-method">
12297
12298
12299
12300
12301                                  <p>Adds hover event handlers to the element
12302</p>
12303
12304
12305
12306
12307
12308
12309
12310
12311
12312
12313                                  <div class="topcoat-list__container">
12314                                      <h3 class="topcoat-list__header">Parameters</h3>
12315                                      <ol class="topcoat-list">
12316                                          <li class="topcoat-list__item"><span class="dr-param">f_in</span>
12317                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12318                                              <span class="dr-description">handler for hover in</span></li>
12319                                          <li class="topcoat-list__item"><span class="dr-param">f_out</span>
12320                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12321                                              <span class="dr-description">handler for hover out</span></li>
12322                                          <li class="topcoat-list__item"><span class="dr-param">icontext</span>
12323                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
12324                                              <span class="dr-description">context for hover in handler</span></li>
12325                                          <li class="topcoat-list__item"><span class="dr-param">ocontext</span>
12326                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
12327                                              <span class="dr-description">context for hover out handler</span></li>
12328
12329                                      </ol>
12330                                  </div>
12331
12332
12333
12334
12335
12336
12337
12338
12339
12340
12341
12342
12343
12344                                  <p class="dr-returns">
12345                                      <strong class="dr-title">Returns:</strong>
12346
12347                                      <em class="dr-type-object">object</em>
12348
12349                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12350                                  </p>
12351
12352
12353
12354
12355                              </div>
12356                          </section>
12357                      </article>
12358
12359                      <article id="Element.unhover">
12360                          <header>
12361                              <h3 class="dr-method">Element.unhover(f_in, f_out)<a href="#Element.unhover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 378 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L378">&#x27ad;</a></h3>
12362                          </header>
12363                          <section>
12364                              <div class="extra" id="Element.unhover-extra"></div>
12365                              <div class="dr-method">
12366
12367
12368
12369
12370                                  <p>Removes hover event handlers from the element
12371</p>
12372
12373
12374
12375
12376
12377
12378
12379
12380
12381
12382                                  <div class="topcoat-list__container">
12383                                      <h3 class="topcoat-list__header">Parameters</h3>
12384                                      <ol class="topcoat-list">
12385                                          <li class="topcoat-list__item"><span class="dr-param">f_in</span>
12386                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12387                                              <span class="dr-description">handler for hover in</span></li>
12388                                          <li class="topcoat-list__item"><span class="dr-param">f_out</span>
12389                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12390                                              <span class="dr-description">handler for hover out</span></li>
12391
12392                                      </ol>
12393                                  </div>
12394
12395
12396
12397
12398
12399
12400
12401
12402
12403
12404
12405
12406
12407                                  <p class="dr-returns">
12408                                      <strong class="dr-title">Returns:</strong>
12409
12410                                      <em class="dr-type-object">object</em>
12411
12412                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12413                                  </p>
12414
12415
12416
12417
12418                              </div>
12419                          </section>
12420                      </article>
12421
12422                      <article id="Element.drag">
12423                          <header>
12424                              <h3 class="dr-method">Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])<a href="#Element.drag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 416 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L416">&#x27ad;</a></h3>
12425                          </header>
12426                          <section>
12427                              <div class="extra" id="Element.drag-extra"></div>
12428                              <div class="dr-method">
12429
12430
12431
12432
12433                                  <p>Adds event handlers for an element&#39;s drag gesture
12434</p>
12435
12436
12437
12438
12439
12440
12441
12442
12443
12444
12445                                  <div class="topcoat-list__container">
12446                                      <h3 class="topcoat-list__header">Parameters</h3>
12447                                      <ol class="topcoat-list">
12448                                          <li class="topcoat-list__item"><span class="dr-param">onmove</span>
12449                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12450                                              <span class="dr-description">handler for moving</span></li>
12451                                          <li class="topcoat-list__item"><span class="dr-param">onstart</span>
12452                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12453                                              <span class="dr-description">handler for drag start</span></li>
12454                                          <li class="topcoat-list__item"><span class="dr-param">onend</span>
12455                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
12456                                              <span class="dr-description">handler for drag end</span></li>
12457                                          <li class="topcoat-list__item"><span class="dr-param">mcontext</span>
12458                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
12459                                              <span class="dr-description">context for moving handler</span></li>
12460                                          <li class="topcoat-list__item"><span class="dr-param">scontext</span>
12461                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
12462                                              <span class="dr-description">context for drag start handler</span></li>
12463                                          <li class="topcoat-list__item"><span class="dr-param">econtext</span>
12464                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
12465                                              <span class="dr-description">context for drag end handler</span></li>
12466
12467                                      </ol>
12468                                  </div>
12469
12470
12471
12472
12473
12474
12475
12476
12477                                  <p>Additionaly following <code>drag</code> events are triggered: <code>drag.start.&lt;id&gt;</code> on start,
12478<code>drag.end.&lt;id&gt;</code> on end and <code>drag.move.&lt;id&gt;</code> on every move. When element is dragged over another element
12479<code>drag.over.&lt;id&gt;</code> fires as well.
12480</p><p>Start event and start handler are called in specified context or in context of the element with following parameters:
12481</p>
12482
12483
12484
12485
12486
12487
12488
12489
12490
12491
12492
12493
12494
12495
12496
12497                                  <ol class="dr-json">
12498
12499
12500                                      <li>
12501                                          <span class="dr-json-key">x</span>
12502                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12503                                          <span class="dr-json-description">x position of the mouse</span>
12504                                      </li>
12505
12506
12507
12508                                      <li>
12509                                          <span class="dr-json-key">y</span>
12510                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12511                                          <span class="dr-json-description">y position of the mouse</span>
12512                                      </li>
12513
12514
12515
12516                                      <li>
12517                                          <span class="dr-json-key">event</span>
12518                                          <span class="dr-type"><em class="dr-type-object">object</em> </span>
12519                                          <span class="dr-json-description">DOM event object</span>
12520                                      </li>
12521
12522
12523                                  </ol>
12524
12525
12526
12527                                  <p>Move event and move handler are called in specified context or in context of the element with following parameters:
12528</p>
12529
12530
12531
12532
12533
12534
12535
12536
12537
12538
12539
12540
12541
12542
12543
12544                                  <ol class="dr-json">
12545
12546
12547                                      <li>
12548                                          <span class="dr-json-key">dx</span>
12549                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12550                                          <span class="dr-json-description">shift by x from the start point</span>
12551                                      </li>
12552
12553
12554
12555                                      <li>
12556                                          <span class="dr-json-key">dy</span>
12557                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12558                                          <span class="dr-json-description">shift by y from the start point</span>
12559                                      </li>
12560
12561
12562
12563                                      <li>
12564                                          <span class="dr-json-key">x</span>
12565                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12566                                          <span class="dr-json-description">x position of the mouse</span>
12567                                      </li>
12568
12569
12570
12571                                      <li>
12572                                          <span class="dr-json-key">y</span>
12573                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12574                                          <span class="dr-json-description">y position of the mouse</span>
12575                                      </li>
12576
12577
12578
12579                                      <li>
12580                                          <span class="dr-json-key">event</span>
12581                                          <span class="dr-type"><em class="dr-type-object">object</em> </span>
12582                                          <span class="dr-json-description">DOM event object</span>
12583                                      </li>
12584
12585
12586                                  </ol>
12587
12588
12589
12590                                  <p>End event and end handler are called in specified context or in context of the element with following parameters:
12591</p>
12592
12593
12594
12595
12596
12597
12598
12599
12600
12601
12602
12603
12604
12605
12606
12607                                  <ol class="dr-json">
12608
12609
12610                                      <li>
12611                                          <span class="dr-json-key">event</span>
12612                                          <span class="dr-type"><em class="dr-type-object">object</em> </span>
12613                                          <span class="dr-json-description">DOM event object</span>
12614                                      </li>
12615
12616
12617                                  </ol>
12618
12619
12620
12621
12622
12623
12624
12625
12626                                  <p class="dr-returns">
12627                                      <strong class="dr-title">Returns:</strong>
12628
12629                                      <em class="dr-type-object">object</em>
12630
12631                                      <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span>
12632                                  </p>
12633
12634
12635
12636
12637                              </div>
12638                          </section>
12639                      </article>
12640
12641                      <article id="Element.undrag">
12642                          <header>
12643                              <h3 class="dr-method">Element.undrag()<a href="#Element.undrag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 465 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L465">&#x27ad;</a></h3>
12644                          </header>
12645                          <section>
12646                              <div class="extra" id="Element.undrag-extra"></div>
12647                              <div class="dr-method">
12648
12649
12650
12651
12652                                  <p>Removes all drag event handlers from the given element
12653</p>
12654
12655
12656
12657
12658
12659
12660
12661
12662                              </div>
12663                          </section>
12664                      </article>
12665
12666                      <article id="Snap.path.getTotalLength">
12667                          <header>
12668                              <h3 class="dr-method">Snap.path.getTotalLength(path)<a href="#Snap.path.getTotalLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1127 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1127">&#x27ad;</a></h3>
12669                          </header>
12670                          <section>
12671                              <div class="extra" id="Snap.path.getTotalLength-extra"></div>
12672                              <div class="dr-method">
12673
12674
12675
12676
12677                                  <p>Returns the length of the given path in pixels
12678</p>
12679
12680
12681
12682
12683
12684
12685
12686
12687
12688
12689                                  <div class="topcoat-list__container">
12690                                      <h3 class="topcoat-list__header">Parameters</h3>
12691                                      <ol class="topcoat-list">
12692                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
12693                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
12694                                              <span class="dr-description">SVG path string</span></li>
12695
12696                                      </ol>
12697                                  </div>
12698
12699
12700
12701
12702
12703
12704
12705
12706
12707
12708
12709
12710
12711                                  <p class="dr-returns">
12712                                      <strong class="dr-title">Returns:</strong>
12713
12714                                      <em class="dr-type-number">number</em>
12715
12716                                      <span class="dr-description">length</span>
12717                                  </p>
12718
12719
12720
12721
12722                              </div>
12723                          </section>
12724                      </article>
12725
12726                      <article id="Snap.path.getPointAtLength">
12727                          <header>
12728                              <h3 class="dr-method">Snap.path.getPointAtLength(path, length)<a href="#Snap.path.getPointAtLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1144 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1144">&#x27ad;</a></h3>
12729                          </header>
12730                          <section>
12731                              <div class="extra" id="Snap.path.getPointAtLength-extra"></div>
12732                              <div class="dr-method">
12733
12734
12735
12736
12737                                  <p>Returns the coordinates of the point located at the given length along the given path
12738</p>
12739
12740
12741
12742
12743
12744
12745
12746
12747
12748
12749                                  <div class="topcoat-list__container">
12750                                      <h3 class="topcoat-list__header">Parameters</h3>
12751                                      <ol class="topcoat-list">
12752                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
12753                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
12754                                              <span class="dr-description">SVG path string</span></li>
12755                                          <li class="topcoat-list__item"><span class="dr-param">length</span>
12756                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
12757                                              <span class="dr-description">length, in pixels, from the start of the path, excluding non-rendering jumps</span></li>
12758
12759                                      </ol>
12760                                  </div>
12761
12762
12763
12764
12765
12766
12767
12768
12769
12770
12771
12772
12773
12774                                  <p class="dr-returns">
12775                                      <strong class="dr-title">Returns:</strong>
12776
12777                                      <em class="dr-type-object">object</em>
12778
12779                                      <span class="dr-description">representation of the point:</span>
12780                                  </p>
12781
12782
12783
12784
12785
12786
12787
12788
12789
12790
12791
12792                                  <ol class="dr-json">
12793
12794
12795                                      <li>{<ol class="dr-json">
12796
12797
12798
12799                                      <li>
12800                                          <span class="dr-json-key">x:</span>
12801                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12802                                          <span class="dr-json-description">x coordinate,</span>
12803                                      </li>
12804
12805
12806
12807                                      <li>
12808                                          <span class="dr-json-key">y:</span>
12809                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12810                                          <span class="dr-json-description">y coordinate,</span>
12811                                      </li>
12812
12813
12814
12815                                      <li>
12816                                          <span class="dr-json-key">alpha:</span>
12817                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
12818                                          <span class="dr-json-description">angle of derivative</span>
12819                                      </li>
12820
12821
12822
12823                                      </ol></li><li>}</li>
12824
12825
12826                                  </ol>
12827
12828
12829                              </div>
12830                          </section>
12831                      </article>
12832
12833                      <article id="Snap.path.getSubpath">
12834                          <header>
12835                              <h3 class="dr-method">Snap.path.getSubpath(path, from, to)<a href="#Snap.path.getSubpath" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1157 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1157">&#x27ad;</a></h3>
12836                          </header>
12837                          <section>
12838                              <div class="extra" id="Snap.path.getSubpath-extra"></div>
12839                              <div class="dr-method">
12840
12841
12842
12843
12844                                  <p>Returns the subpath of a given path between given start and end lengths
12845</p>
12846
12847
12848
12849
12850
12851
12852
12853
12854
12855
12856                                  <div class="topcoat-list__container">
12857                                      <h3 class="topcoat-list__header">Parameters</h3>
12858                                      <ol class="topcoat-list">
12859                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
12860                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
12861                                              <span class="dr-description">SVG path string</span></li>
12862                                          <li class="topcoat-list__item"><span class="dr-param">from</span>
12863                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
12864                                              <span class="dr-description">length, in pixels, from the start of the path to the start of the segment</span></li>
12865                                          <li class="topcoat-list__item"><span class="dr-param">to</span>
12866                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
12867                                              <span class="dr-description">length, in pixels, from the start of the path to the end of the segment</span></li>
12868
12869                                      </ol>
12870                                  </div>
12871
12872
12873
12874
12875
12876
12877
12878
12879
12880
12881
12882
12883
12884                                  <p class="dr-returns">
12885                                      <strong class="dr-title">Returns:</strong>
12886
12887                                      <em class="dr-type-string">string</em>
12888
12889                                      <span class="dr-description">path string definition for the segment</span>
12890                                  </p>
12891
12892
12893
12894
12895                              </div>
12896                          </section>
12897                      </article>
12898
12899                      <article id="Element.getTotalLength">
12900                          <header>
12901                              <h3 class="dr-method">Element.getTotalLength()<a href="#Element.getTotalLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1171 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1171">&#x27ad;</a></h3>
12902                          </header>
12903                          <section>
12904                              <div class="extra" id="Element.getTotalLength-extra"></div>
12905                              <div class="dr-method">
12906
12907
12908
12909
12910                                  <p>Returns the length of the path in pixels (only works for <code>path</code> elements)
12911</p>
12912
12913
12914
12915
12916
12917
12918
12919
12920
12921
12922
12923
12924
12925
12926                                  <p class="dr-returns">
12927                                      <strong class="dr-title">Returns:</strong>
12928
12929                                      <em class="dr-type-number">number</em>
12930
12931                                      <span class="dr-description">length</span>
12932                                  </p>
12933
12934
12935
12936
12937                              </div>
12938                          </section>
12939                      </article>
12940
12941                      <article id="Element.getPointAtLength">
12942                          <header>
12943                              <h3 class="dr-method">Element.getPointAtLength(length)<a href="#Element.getPointAtLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1192 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1192">&#x27ad;</a></h3>
12944                          </header>
12945                          <section>
12946                              <div class="extra" id="Element.getPointAtLength-extra"></div>
12947                              <div class="dr-method">
12948
12949
12950
12951
12952                                  <p>Returns coordinates of the point located at the given length on the given path (only works for <code>path</code> elements)
12953</p>
12954
12955
12956
12957
12958
12959
12960
12961
12962
12963
12964                                  <div class="topcoat-list__container">
12965                                      <h3 class="topcoat-list__header">Parameters</h3>
12966                                      <ol class="topcoat-list">
12967                                          <li class="topcoat-list__item"><span class="dr-param">length</span>
12968                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
12969                                              <span class="dr-description">length, in pixels, from the start of the path, excluding non-rendering jumps</span></li>
12970
12971                                      </ol>
12972                                  </div>
12973
12974
12975
12976
12977
12978
12979
12980
12981
12982
12983
12984
12985
12986                                  <p class="dr-returns">
12987                                      <strong class="dr-title">Returns:</strong>
12988
12989                                      <em class="dr-type-object">object</em>
12990
12991                                      <span class="dr-description">representation of the point:</span>
12992                                  </p>
12993
12994
12995
12996
12997
12998
12999
13000
13001
13002
13003
13004                                  <ol class="dr-json">
13005
13006
13007                                      <li>{<ol class="dr-json">
13008
13009
13010
13011                                      <li>
13012                                          <span class="dr-json-key">x:</span>
13013                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13014                                          <span class="dr-json-description">x coordinate,</span>
13015                                      </li>
13016
13017
13018
13019                                      <li>
13020                                          <span class="dr-json-key">y:</span>
13021                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13022                                          <span class="dr-json-description">y coordinate,</span>
13023                                      </li>
13024
13025
13026
13027                                      <li>
13028                                          <span class="dr-json-key">alpha:</span>
13029                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13030                                          <span class="dr-json-description">angle of derivative</span>
13031                                      </li>
13032
13033
13034
13035                                      </ol></li><li>}</li>
13036
13037
13038                                  </ol>
13039
13040
13041                              </div>
13042                          </section>
13043                      </article>
13044
13045                      <article id="Element.getSubpath">
13046                          <header>
13047                              <h3 class="dr-method">Element.getSubpath(from, to)<a href="#Element.getSubpath" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1207 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1207">&#x27ad;</a></h3>
13048                          </header>
13049                          <section>
13050                              <div class="extra" id="Element.getSubpath-extra"></div>
13051                              <div class="dr-method">
13052
13053
13054
13055
13056                                  <p>Returns subpath of a given element from given start and end lengths (only works for <code>path</code> elements)
13057</p>
13058
13059
13060
13061
13062
13063
13064
13065
13066
13067
13068                                  <div class="topcoat-list__container">
13069                                      <h3 class="topcoat-list__header">Parameters</h3>
13070                                      <ol class="topcoat-list">
13071                                          <li class="topcoat-list__item"><span class="dr-param">from</span>
13072                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13073                                              <span class="dr-description">length, in pixels, from the start of the path to the start of the segment</span></li>
13074                                          <li class="topcoat-list__item"><span class="dr-param">to</span>
13075                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13076                                              <span class="dr-description">length, in pixels, from the start of the path to the end of the segment</span></li>
13077
13078                                      </ol>
13079                                  </div>
13080
13081
13082
13083
13084
13085
13086
13087
13088
13089
13090
13091
13092
13093                                  <p class="dr-returns">
13094                                      <strong class="dr-title">Returns:</strong>
13095
13096                                      <em class="dr-type-string">string</em>
13097
13098                                      <span class="dr-description">path string definition for the segment</span>
13099                                  </p>
13100
13101
13102
13103
13104                              </div>
13105                          </section>
13106                      </article>
13107
13108                      <article id="Snap.path.findDotsAtSegment">
13109                          <header>
13110                              <h3 class="dr-method">Snap.path.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)<a href="#Snap.path.findDotsAtSegment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1250 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1250">&#x27ad;</a></h3>
13111                          </header>
13112                          <section>
13113                              <div class="extra" id="Snap.path.findDotsAtSegment-extra"></div>
13114                              <div class="dr-method">
13115
13116
13117
13118
13119                                  <p>Utility method
13120Finds dot coordinates on the given cubic beziér curve at the given t
13121</p>
13122
13123
13124
13125
13126
13127
13128
13129
13130
13131
13132                                  <div class="topcoat-list__container">
13133                                      <h3 class="topcoat-list__header">Parameters</h3>
13134                                      <ol class="topcoat-list">
13135                                          <li class="topcoat-list__item"><span class="dr-param">p1x</span>
13136                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13137                                              <span class="dr-description">x of the first point of the curve</span></li>
13138                                          <li class="topcoat-list__item"><span class="dr-param">p1y</span>
13139                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13140                                              <span class="dr-description">y of the first point of the curve</span></li>
13141                                          <li class="topcoat-list__item"><span class="dr-param">c1x</span>
13142                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13143                                              <span class="dr-description">x of the first anchor of the curve</span></li>
13144                                          <li class="topcoat-list__item"><span class="dr-param">c1y</span>
13145                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13146                                              <span class="dr-description">y of the first anchor of the curve</span></li>
13147                                          <li class="topcoat-list__item"><span class="dr-param">c2x</span>
13148                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13149                                              <span class="dr-description">x of the second anchor of the curve</span></li>
13150                                          <li class="topcoat-list__item"><span class="dr-param">c2y</span>
13151                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13152                                              <span class="dr-description">y of the second anchor of the curve</span></li>
13153                                          <li class="topcoat-list__item"><span class="dr-param">p2x</span>
13154                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13155                                              <span class="dr-description">x of the second point of the curve</span></li>
13156                                          <li class="topcoat-list__item"><span class="dr-param">p2y</span>
13157                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13158                                              <span class="dr-description">y of the second point of the curve</span></li>
13159                                          <li class="topcoat-list__item"><span class="dr-param">t</span>
13160                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13161                                              <span class="dr-description">position on the curve (0..1)</span></li>
13162
13163                                      </ol>
13164                                  </div>
13165
13166
13167
13168
13169
13170
13171
13172
13173
13174
13175
13176
13177
13178                                  <p class="dr-returns">
13179                                      <strong class="dr-title">Returns:</strong>
13180
13181                                      <em class="dr-type-object">object</em>
13182
13183                                      <span class="dr-description">point information in format:</span>
13184                                  </p>
13185
13186
13187
13188
13189
13190
13191
13192
13193
13194
13195
13196                                  <ol class="dr-json">
13197
13198
13199                                      <li>{<ol class="dr-json">
13200
13201
13202
13203                                      <li>
13204                                          <span class="dr-json-key">x:</span>
13205                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13206                                          <span class="dr-json-description">x coordinate of the point,</span>
13207                                      </li>
13208
13209
13210
13211                                      <li>
13212                                          <span class="dr-json-key">y:</span>
13213                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13214                                          <span class="dr-json-description">y coordinate of the point,</span>
13215                                      </li>
13216
13217
13218
13219                                      <li>    m: {<ol class="dr-json">
13220
13221
13222
13223                                      <li>
13224                                          <span class="dr-json-key">x:</span>
13225                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13226                                          <span class="dr-json-description">x coordinate of the left anchor,</span>
13227                                      </li>
13228
13229
13230
13231                                      <li>
13232                                          <span class="dr-json-key">y:</span>
13233                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13234                                          <span class="dr-json-description">y coordinate of the left anchor</span>
13235                                      </li>
13236
13237
13238
13239                                      </ol></li><li>    },</li>
13240
13241
13242
13243                                      <li>    n: {<ol class="dr-json">
13244
13245
13246
13247                                      <li>
13248                                          <span class="dr-json-key">x:</span>
13249                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13250                                          <span class="dr-json-description">x coordinate of the right anchor,</span>
13251                                      </li>
13252
13253
13254
13255                                      <li>
13256                                          <span class="dr-json-key">y:</span>
13257                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13258                                          <span class="dr-json-description">y coordinate of the right anchor</span>
13259                                      </li>
13260
13261
13262
13263                                      </ol></li><li>    },</li>
13264
13265
13266
13267                                      <li>    start: {<ol class="dr-json">
13268
13269
13270
13271                                      <li>
13272                                          <span class="dr-json-key">x:</span>
13273                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13274                                          <span class="dr-json-description">x coordinate of the start of the curve,</span>
13275                                      </li>
13276
13277
13278
13279                                      <li>
13280                                          <span class="dr-json-key">y:</span>
13281                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13282                                          <span class="dr-json-description">y coordinate of the start of the curve</span>
13283                                      </li>
13284
13285
13286
13287                                      </ol></li><li>    },</li>
13288
13289
13290
13291                                      <li>    end: {<ol class="dr-json">
13292
13293
13294
13295                                      <li>
13296                                          <span class="dr-json-key">x:</span>
13297                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13298                                          <span class="dr-json-description">x coordinate of the end of the curve,</span>
13299                                      </li>
13300
13301
13302
13303                                      <li>
13304                                          <span class="dr-json-key">y:</span>
13305                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13306                                          <span class="dr-json-description">y coordinate of the end of the curve</span>
13307                                      </li>
13308
13309
13310
13311                                      </ol></li><li>    },</li>
13312
13313
13314
13315                                      <li>
13316                                          <span class="dr-json-key">alpha:</span>
13317                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13318                                          <span class="dr-json-description">angle of the curve derivative at the point</span>
13319                                      </li>
13320
13321
13322
13323                                      </ol></li><li>}</li>
13324
13325
13326                                  </ol>
13327
13328
13329                              </div>
13330                          </section>
13331                      </article>
13332
13333                      <article id="Snap.path.bezierBBox">
13334                          <header>
13335                              <h3 class="dr-method">Snap.path.bezierBBox(…)<a href="#Snap.path.bezierBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1278 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1278">&#x27ad;</a></h3>
13336                          </header>
13337                          <section>
13338                              <div class="extra" id="Snap.path.bezierBBox-extra"></div>
13339                              <div class="dr-method">
13340
13341
13342
13343
13344                                  <p>Utility method
13345Returns the bounding box of a given cubic beziér curve
13346</p>
13347
13348
13349
13350
13351
13352
13353
13354
13355
13356
13357                                  <div class="topcoat-list__container">
13358                                      <h3 class="topcoat-list__header">Parameters</h3>
13359                                      <ol class="topcoat-list">
13360                                          <li class="topcoat-list__item"><span class="dr-param">p1x</span>
13361                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13362                                              <span class="dr-description">x of the first point of the curve</span></li>
13363                                          <li class="topcoat-list__item"><span class="dr-param">p1y</span>
13364                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13365                                              <span class="dr-description">y of the first point of the curve</span></li>
13366                                          <li class="topcoat-list__item"><span class="dr-param">c1x</span>
13367                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13368                                              <span class="dr-description">x of the first anchor of the curve</span></li>
13369                                          <li class="topcoat-list__item"><span class="dr-param">c1y</span>
13370                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13371                                              <span class="dr-description">y of the first anchor of the curve</span></li>
13372                                          <li class="topcoat-list__item"><span class="dr-param">c2x</span>
13373                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13374                                              <span class="dr-description">x of the second anchor of the curve</span></li>
13375                                          <li class="topcoat-list__item"><span class="dr-param">c2y</span>
13376                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13377                                              <span class="dr-description">y of the second anchor of the curve</span></li>
13378                                          <li class="topcoat-list__item"><span class="dr-param">p2x</span>
13379                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13380                                              <span class="dr-description">x of the second point of the curve</span></li>
13381                                          <li class="topcoat-list__item"><span class="dr-param">p2y</span>
13382                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13383                                              <span class="dr-description">y of the second point of the curve</span></li>
13384
13385                                      </ol>
13386                                  </div>
13387
13388
13389
13390
13391
13392
13393
13394
13395                                  <p>or
13396</p>
13397
13398
13399
13400
13401
13402
13403
13404
13405
13406
13407                                  <div class="topcoat-list__container">
13408                                      <h3 class="topcoat-list__header">Parameters</h3>
13409                                      <ol class="topcoat-list">
13410                                          <li class="topcoat-list__item"><span class="dr-param">bez</span>
13411                                              <span class="dr-type"><em class="dr-type-array">array</em> </span>
13412                                              <span class="dr-description">array of six points for beziér curve</span></li>
13413
13414                                      </ol>
13415                                  </div>
13416
13417
13418
13419
13420
13421
13422
13423
13424
13425
13426
13427
13428
13429                                  <p class="dr-returns">
13430                                      <strong class="dr-title">Returns:</strong>
13431
13432                                      <em class="dr-type-object">object</em>
13433
13434                                      <span class="dr-description">bounding box</span>
13435                                  </p>
13436
13437
13438
13439
13440
13441
13442
13443
13444
13445
13446
13447                                  <ol class="dr-json">
13448
13449
13450                                      <li>{<ol class="dr-json">
13451
13452
13453
13454                                      <li>
13455                                          <span class="dr-json-key">x:</span>
13456                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13457                                          <span class="dr-json-description">x coordinate of the left top point of the box,</span>
13458                                      </li>
13459
13460
13461
13462                                      <li>
13463                                          <span class="dr-json-key">y:</span>
13464                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13465                                          <span class="dr-json-description">y coordinate of the left top point of the box,</span>
13466                                      </li>
13467
13468
13469
13470                                      <li>
13471                                          <span class="dr-json-key">x2:</span>
13472                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13473                                          <span class="dr-json-description">x coordinate of the right bottom point of the box,</span>
13474                                      </li>
13475
13476
13477
13478                                      <li>
13479                                          <span class="dr-json-key">y2:</span>
13480                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13481                                          <span class="dr-json-description">y coordinate of the right bottom point of the box,</span>
13482                                      </li>
13483
13484
13485
13486                                      <li>
13487                                          <span class="dr-json-key">width:</span>
13488                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13489                                          <span class="dr-json-description">width of the box,</span>
13490                                      </li>
13491
13492
13493
13494                                      <li>
13495                                          <span class="dr-json-key">height:</span>
13496                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13497                                          <span class="dr-json-description">height of the box</span>
13498                                      </li>
13499
13500
13501
13502                                      </ol></li><li>}</li>
13503
13504
13505                                  </ol>
13506
13507
13508                              </div>
13509                          </section>
13510                      </article>
13511
13512                      <article id="Snap.path.isPointInsideBBox">
13513                          <header>
13514                              <h3 class="dr-method">Snap.path.isPointInsideBBox(bbox, x, y)<a href="#Snap.path.isPointInsideBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1291 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1291">&#x27ad;</a></h3>
13515                          </header>
13516                          <section>
13517                              <div class="extra" id="Snap.path.isPointInsideBBox-extra"></div>
13518                              <div class="dr-method">
13519
13520
13521
13522
13523                                  <p>Utility method
13524Returns <code>true</code> if given point is inside bounding box
13525</p>
13526
13527
13528
13529
13530
13531
13532
13533
13534
13535
13536                                  <div class="topcoat-list__container">
13537                                      <h3 class="topcoat-list__header">Parameters</h3>
13538                                      <ol class="topcoat-list">
13539                                          <li class="topcoat-list__item"><span class="dr-param">bbox</span>
13540                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13541                                              <span class="dr-description">bounding box</span></li>
13542                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
13543                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13544                                              <span class="dr-description">x coordinate of the point</span></li>
13545                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
13546                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13547                                              <span class="dr-description">y coordinate of the point</span></li>
13548
13549                                      </ol>
13550                                  </div>
13551
13552
13553
13554
13555
13556
13557
13558
13559
13560
13561
13562
13563
13564                                  <p class="dr-returns">
13565                                      <strong class="dr-title">Returns:</strong>
13566
13567                                      <em class="dr-type-boolean">boolean</em>
13568
13569                                      <span class="dr-description"><code>true</code> if point is inside</span>
13570                                  </p>
13571
13572
13573
13574
13575                              </div>
13576                          </section>
13577                      </article>
13578
13579                      <article id="Snap.path.isBBoxIntersect">
13580                          <header>
13581                              <h3 class="dr-method">Snap.path.isBBoxIntersect(bbox1, bbox2)<a href="#Snap.path.isBBoxIntersect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1348 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1348">&#x27ad;</a></h3>
13582                          </header>
13583                          <section>
13584                              <div class="extra" id="Snap.path.isBBoxIntersect-extra"></div>
13585                              <div class="dr-method">
13586
13587
13588
13589
13590                                  <p>Utility method
13591Returns <code>true</code> if two bounding boxes intersect
13592</p>
13593
13594
13595
13596
13597
13598
13599
13600
13601
13602
13603                                  <div class="topcoat-list__container">
13604                                      <h3 class="topcoat-list__header">Parameters</h3>
13605                                      <ol class="topcoat-list">
13606                                          <li class="topcoat-list__item"><span class="dr-param">bbox1</span>
13607                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13608                                              <span class="dr-description">first bounding box</span></li>
13609                                          <li class="topcoat-list__item"><span class="dr-param">bbox2</span>
13610                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13611                                              <span class="dr-description">second bounding box</span></li>
13612
13613                                      </ol>
13614                                  </div>
13615
13616
13617
13618
13619
13620
13621
13622
13623
13624
13625
13626
13627
13628                                  <p class="dr-returns">
13629                                      <strong class="dr-title">Returns:</strong>
13630
13631                                      <em class="dr-type-boolean">boolean</em>
13632
13633                                      <span class="dr-description"><code>true</code> if bounding boxes intersect</span>
13634                                  </p>
13635
13636
13637
13638
13639                              </div>
13640                          </section>
13641                      </article>
13642
13643                      <article id="Snap.path.intersection">
13644                          <header>
13645                              <h3 class="dr-method">Snap.path.intersection(path1, path2)<a href="#Snap.path.intersection" 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/Snap.svg/blob/master/src/svg.js#L1372">&#x27ad;</a></h3>
13646                          </header>
13647                          <section>
13648                              <div class="extra" id="Snap.path.intersection-extra"></div>
13649                              <div class="dr-method">
13650
13651
13652
13653
13654                                  <p>Utility method
13655Finds intersections of two paths
13656</p>
13657
13658
13659
13660
13661
13662
13663
13664
13665
13666
13667                                  <div class="topcoat-list__container">
13668                                      <h3 class="topcoat-list__header">Parameters</h3>
13669                                      <ol class="topcoat-list">
13670                                          <li class="topcoat-list__item"><span class="dr-param">path1</span>
13671                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13672                                              <span class="dr-description">path string</span></li>
13673                                          <li class="topcoat-list__item"><span class="dr-param">path2</span>
13674                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13675                                              <span class="dr-description">path string</span></li>
13676
13677                                      </ol>
13678                                  </div>
13679
13680
13681
13682
13683
13684
13685
13686
13687
13688
13689
13690
13691
13692                                  <p class="dr-returns">
13693                                      <strong class="dr-title">Returns:</strong>
13694
13695                                      <em class="dr-type-array">array</em>
13696
13697                                      <span class="dr-description">dots of intersection</span>
13698                                  </p>
13699
13700
13701
13702
13703
13704
13705
13706
13707
13708
13709
13710                                  <ol class="dr-json">
13711
13712
13713                                      <li>[</li>
13714
13715
13716
13717                                      <li>    {<ol class="dr-json">
13718
13719
13720
13721                                      <li>
13722                                          <span class="dr-json-key">x:</span>
13723                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13724                                          <span class="dr-json-description">x coordinate of the point,</span>
13725                                      </li>
13726
13727
13728
13729                                      <li>
13730                                          <span class="dr-json-key">y:</span>
13731                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13732                                          <span class="dr-json-description">y coordinate of the point,</span>
13733                                      </li>
13734
13735
13736
13737                                      <li>
13738                                          <span class="dr-json-key">t1:</span>
13739                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13740                                          <span class="dr-json-description">t value for segment of path1,</span>
13741                                      </li>
13742
13743
13744
13745                                      <li>
13746                                          <span class="dr-json-key">t2:</span>
13747                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13748                                          <span class="dr-json-description">t value for segment of path2,</span>
13749                                      </li>
13750
13751
13752
13753                                      <li>
13754                                          <span class="dr-json-key">segment1:</span>
13755                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13756                                          <span class="dr-json-description">order number for segment of path1,</span>
13757                                      </li>
13758
13759
13760
13761                                      <li>
13762                                          <span class="dr-json-key">segment2:</span>
13763                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13764                                          <span class="dr-json-description">order number for segment of path2,</span>
13765                                      </li>
13766
13767
13768
13769                                      <li>
13770                                          <span class="dr-json-key">bez1:</span>
13771                                          <span class="dr-type"><em class="dr-type-array">array</em> </span>
13772                                          <span class="dr-json-description">eight coordinates representing beziér curve for the segment of path1,</span>
13773                                      </li>
13774
13775
13776
13777                                      <li>
13778                                          <span class="dr-json-key">bez2:</span>
13779                                          <span class="dr-type"><em class="dr-type-array">array</em> </span>
13780                                          <span class="dr-json-description">eight coordinates representing beziér curve for the segment of path2</span>
13781                                      </li>
13782
13783
13784
13785                                      </ol></li><li>    }</li>
13786
13787
13788
13789                                      <li>]</li>
13790
13791
13792                                  </ol>
13793
13794
13795                              </div>
13796                          </section>
13797                      </article>
13798
13799                      <article id="Snap.path.isPointInside">
13800                          <header>
13801                              <h3 class="dr-method">Snap.path.isPointInside(path, x, y)<a href="#Snap.path.isPointInside" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1388 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1388">&#x27ad;</a></h3>
13802                          </header>
13803                          <section>
13804                              <div class="extra" id="Snap.path.isPointInside-extra"></div>
13805                              <div class="dr-method">
13806
13807
13808
13809
13810                                  <p>Utility method
13811Returns <code>true</code> if given point is inside a given closed path.
13812</p><p>Note: fill mode doesn’t affect the result of this method.
13813</p>
13814
13815
13816
13817
13818
13819
13820
13821
13822
13823
13824                                  <div class="topcoat-list__container">
13825                                      <h3 class="topcoat-list__header">Parameters</h3>
13826                                      <ol class="topcoat-list">
13827                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
13828                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13829                                              <span class="dr-description">path string</span></li>
13830                                          <li class="topcoat-list__item"><span class="dr-param">x</span>
13831                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13832                                              <span class="dr-description">x of the point</span></li>
13833                                          <li class="topcoat-list__item"><span class="dr-param">y</span>
13834                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
13835                                              <span class="dr-description">y of the point</span></li>
13836
13837                                      </ol>
13838                                  </div>
13839
13840
13841
13842
13843
13844
13845
13846
13847
13848
13849
13850
13851
13852                                  <p class="dr-returns">
13853                                      <strong class="dr-title">Returns:</strong>
13854
13855                                      <em class="dr-type-boolean">boolean</em>
13856
13857                                      <span class="dr-description"><code>true</code> if point is inside the path</span>
13858                                  </p>
13859
13860
13861
13862
13863                              </div>
13864                          </section>
13865                      </article>
13866
13867                      <article id="Snap.path.getBBox">
13868                          <header>
13869                              <h3 class="dr-method">Snap.path.getBBox(path)<a href="#Snap.path.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1407 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1407">&#x27ad;</a></h3>
13870                          </header>
13871                          <section>
13872                              <div class="extra" id="Snap.path.getBBox-extra"></div>
13873                              <div class="dr-method">
13874
13875
13876
13877
13878                                  <p>Utility method
13879Returns the bounding box of a given path
13880</p>
13881
13882
13883
13884
13885
13886
13887
13888
13889
13890
13891                                  <div class="topcoat-list__container">
13892                                      <h3 class="topcoat-list__header">Parameters</h3>
13893                                      <ol class="topcoat-list">
13894                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
13895                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
13896                                              <span class="dr-description">path string</span></li>
13897
13898                                      </ol>
13899                                  </div>
13900
13901
13902
13903
13904
13905
13906
13907
13908
13909
13910
13911
13912
13913                                  <p class="dr-returns">
13914                                      <strong class="dr-title">Returns:</strong>
13915
13916                                      <em class="dr-type-object">object</em>
13917
13918                                      <span class="dr-description">bounding box</span>
13919                                  </p>
13920
13921
13922
13923
13924
13925
13926
13927
13928
13929
13930
13931                                  <ol class="dr-json">
13932
13933
13934                                      <li>{<ol class="dr-json">
13935
13936
13937
13938                                      <li>
13939                                          <span class="dr-json-key">x:</span>
13940                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13941                                          <span class="dr-json-description">x coordinate of the left top point of the box,</span>
13942                                      </li>
13943
13944
13945
13946                                      <li>
13947                                          <span class="dr-json-key">y:</span>
13948                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13949                                          <span class="dr-json-description">y coordinate of the left top point of the box,</span>
13950                                      </li>
13951
13952
13953
13954                                      <li>
13955                                          <span class="dr-json-key">x2:</span>
13956                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13957                                          <span class="dr-json-description">x coordinate of the right bottom point of the box,</span>
13958                                      </li>
13959
13960
13961
13962                                      <li>
13963                                          <span class="dr-json-key">y2:</span>
13964                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13965                                          <span class="dr-json-description">y coordinate of the right bottom point of the box,</span>
13966                                      </li>
13967
13968
13969
13970                                      <li>
13971                                          <span class="dr-json-key">width:</span>
13972                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13973                                          <span class="dr-json-description">width of the box,</span>
13974                                      </li>
13975
13976
13977
13978                                      <li>
13979                                          <span class="dr-json-key">height:</span>
13980                                          <span class="dr-type"><em class="dr-type-number">number</em> </span>
13981                                          <span class="dr-json-description">height of the box</span>
13982                                      </li>
13983
13984
13985
13986                                      </ol></li><li>}</li>
13987
13988
13989                                  </ol>
13990
13991
13992                              </div>
13993                          </section>
13994                      </article>
13995
13996                      <article id="Snap.path.toRelative">
13997                          <header>
13998                              <h3 class="dr-method">Snap.path.toRelative(path)<a href="#Snap.path.toRelative" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1419 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1419">&#x27ad;</a></h3>
13999                          </header>
14000                          <section>
14001                              <div class="extra" id="Snap.path.toRelative-extra"></div>
14002                              <div class="dr-method">
14003
14004
14005
14006
14007                                  <p>Utility method
14008Converts path coordinates into relative values
14009</p>
14010
14011
14012
14013
14014
14015
14016
14017
14018
14019
14020                                  <div class="topcoat-list__container">
14021                                      <h3 class="topcoat-list__header">Parameters</h3>
14022                                      <ol class="topcoat-list">
14023                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
14024                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14025                                              <span class="dr-description">path string</span></li>
14026
14027                                      </ol>
14028                                  </div>
14029
14030
14031
14032
14033
14034
14035
14036
14037
14038
14039
14040
14041
14042                                  <p class="dr-returns">
14043                                      <strong class="dr-title">Returns:</strong>
14044
14045                                      <em class="dr-type-array">array</em>
14046
14047                                      <span class="dr-description">path string</span>
14048                                  </p>
14049
14050
14051
14052
14053                              </div>
14054                          </section>
14055                      </article>
14056
14057                      <article id="Snap.path.toAbsolute">
14058                          <header>
14059                              <h3 class="dr-method">Snap.path.toAbsolute(path)<a href="#Snap.path.toAbsolute" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1430 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1430">&#x27ad;</a></h3>
14060                          </header>
14061                          <section>
14062                              <div class="extra" id="Snap.path.toAbsolute-extra"></div>
14063                              <div class="dr-method">
14064
14065
14066
14067
14068                                  <p>Utility method
14069Converts path coordinates into absolute values
14070</p>
14071
14072
14073
14074
14075
14076
14077
14078
14079
14080
14081                                  <div class="topcoat-list__container">
14082                                      <h3 class="topcoat-list__header">Parameters</h3>
14083                                      <ol class="topcoat-list">
14084                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
14085                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14086                                              <span class="dr-description">path string</span></li>
14087
14088                                      </ol>
14089                                  </div>
14090
14091
14092
14093
14094
14095
14096
14097
14098
14099
14100
14101
14102
14103                                  <p class="dr-returns">
14104                                      <strong class="dr-title">Returns:</strong>
14105
14106                                      <em class="dr-type-array">array</em>
14107
14108                                      <span class="dr-description">path string</span>
14109                                  </p>
14110
14111
14112
14113
14114                              </div>
14115                          </section>
14116                      </article>
14117
14118                      <article id="Snap.path.toCubic">
14119                          <header>
14120                              <h3 class="dr-method">Snap.path.toCubic(pathString)<a href="#Snap.path.toCubic" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1441 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1441">&#x27ad;</a></h3>
14121                          </header>
14122                          <section>
14123                              <div class="extra" id="Snap.path.toCubic-extra"></div>
14124                              <div class="dr-method">
14125
14126
14127
14128
14129                                  <p>Utility method
14130Converts path to a new path where all segments are cubic beziér curves
14131</p>
14132
14133
14134
14135
14136
14137
14138
14139
14140
14141
14142                                  <div class="topcoat-list__container">
14143                                      <h3 class="topcoat-list__header">Parameters</h3>
14144                                      <ol class="topcoat-list">
14145                                          <li class="topcoat-list__item"><span class="dr-param">pathString</span>
14146                                              <span class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-array">array</em> </span>
14147                                              <span class="dr-description">path string or array of segments</span></li>
14148
14149                                      </ol>
14150                                  </div>
14151
14152
14153
14154
14155
14156
14157
14158
14159
14160
14161
14162
14163
14164                                  <p class="dr-returns">
14165                                      <strong class="dr-title">Returns:</strong>
14166
14167                                      <em class="dr-type-array">array</em>
14168
14169                                      <span class="dr-description">array of segments</span>
14170                                  </p>
14171
14172
14173
14174
14175                              </div>
14176                          </section>
14177                      </article>
14178
14179                      <article id="Snap.path.map">
14180                          <header>
14181                              <h3 class="dr-method">Snap.path.map(path, matrix)<a href="#Snap.path.map" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1451 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1451">&#x27ad;</a></h3>
14182                          </header>
14183                          <section>
14184                              <div class="extra" id="Snap.path.map-extra"></div>
14185                              <div class="dr-method">
14186
14187
14188
14189
14190                                  <p>Transform the path string with the given matrix
14191</p>
14192
14193
14194
14195
14196
14197
14198
14199
14200
14201
14202                                  <div class="topcoat-list__container">
14203                                      <h3 class="topcoat-list__header">Parameters</h3>
14204                                      <ol class="topcoat-list">
14205                                          <li class="topcoat-list__item"><span class="dr-param">path</span>
14206                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14207                                              <span class="dr-description">path string</span></li>
14208                                          <li class="topcoat-list__item"><span class="dr-param">matrix</span>
14209                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
14210                                              <span class="dr-description">see <a href="#Matrix" class="dr-link">Matrix</a></span></li>
14211
14212                                      </ol>
14213                                  </div>
14214
14215
14216
14217
14218
14219
14220
14221
14222
14223
14224
14225
14226
14227                                  <p class="dr-returns">
14228                                      <strong class="dr-title">Returns:</strong>
14229
14230                                      <em class="dr-type-string">string</em>
14231
14232                                      <span class="dr-description">transformed path string</span>
14233                                  </p>
14234
14235
14236
14237
14238                              </div>
14239                          </section>
14240                      </article>
14241
14242                      <article id="Set.push">
14243                          <header>
14244                              <h3 class="dr-method">Set.push()<a href="#Set.push" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 41 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L41">&#x27ad;</a></h3>
14245                          </header>
14246                          <section>
14247                              <div class="extra" id="Set.push-extra"></div>
14248                              <div class="dr-method">
14249
14250
14251
14252
14253                                  <p>Adds each argument to the current set
14254</p>
14255
14256
14257
14258
14259
14260
14261
14262
14263
14264
14265
14266
14267
14268
14269                                  <p class="dr-returns">
14270                                      <strong class="dr-title">Returns:</strong>
14271
14272                                      <em class="dr-type-object">object</em>
14273
14274                                      <span class="dr-description">original element</span>
14275                                  </p>
14276
14277
14278
14279
14280                              </div>
14281                          </section>
14282                      </article>
14283
14284                      <article id="Set.pop">
14285                          <header>
14286                              <h3 class="dr-method">Set.pop()<a href="#Set.pop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 61 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L61">&#x27ad;</a></h3>
14287                          </header>
14288                          <section>
14289                              <div class="extra" id="Set.pop-extra"></div>
14290                              <div class="dr-method">
14291
14292
14293
14294
14295                                  <p>Removes last element and returns it
14296</p>
14297
14298
14299
14300
14301
14302
14303
14304
14305
14306
14307
14308
14309
14310
14311                                  <p class="dr-returns">
14312                                      <strong class="dr-title">Returns:</strong>
14313
14314                                      <em class="dr-type-object">object</em>
14315
14316                                      <span class="dr-description">element</span>
14317                                  </p>
14318
14319
14320
14321
14322                              </div>
14323                          </section>
14324                      </article>
14325
14326                      <article id="Set.forEach">
14327                          <header>
14328                              <h3 class="dr-method">Set.forEach(callback, thisArg)<a href="#Set.forEach" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 77 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L77">&#x27ad;</a></h3>
14329                          </header>
14330                          <section>
14331                              <div class="extra" id="Set.forEach-extra"></div>
14332                              <div class="dr-method">
14333
14334
14335
14336
14337                                  <p>Executes given function for each element in the set
14338</p><p>If the function returns <code>false</code>, the loop stops running.
14339</p>
14340
14341
14342
14343
14344
14345
14346
14347
14348
14349
14350                                  <div class="topcoat-list__container">
14351                                      <h3 class="topcoat-list__header">Parameters</h3>
14352                                      <ol class="topcoat-list">
14353                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
14354                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
14355                                              <span class="dr-description">function to run</span></li>
14356                                          <li class="topcoat-list__item"><span class="dr-param">thisArg</span>
14357                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
14358                                              <span class="dr-description">context object for the callback</span></li>
14359
14360                                      </ol>
14361                                  </div>
14362
14363
14364
14365
14366
14367
14368
14369
14370
14371
14372
14373
14374
14375                                  <p class="dr-returns">
14376                                      <strong class="dr-title">Returns:</strong>
14377
14378                                      <em class="dr-type-object">object</em>
14379
14380                                      <span class="dr-description">Set object</span>
14381                                  </p>
14382
14383
14384
14385
14386                              </div>
14387                          </section>
14388                      </article>
14389
14390                      <article id="Set.animate">
14391                          <header>
14392                              <h3 class="dr-method">Set.animate(…)<a href="#Set.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 106 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L106">&#x27ad;</a></h3>
14393                          </header>
14394                          <section>
14395                              <div class="extra" id="Set.animate-extra"></div>
14396                              <div class="dr-method">
14397
14398
14399
14400
14401                                  <p>Animates each element in set in sync.
14402</p><p></p>
14403
14404
14405
14406
14407
14408
14409
14410
14411
14412
14413                                  <div class="topcoat-list__container">
14414                                      <h3 class="topcoat-list__header">Parameters</h3>
14415                                      <ol class="topcoat-list">
14416                                          <li class="topcoat-list__item"><span class="dr-param">attrs</span>
14417                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
14418                                              <span class="dr-description">key-value pairs of destination attributes</span></li>
14419                                          <li class="topcoat-list__item"><span class="dr-param">duration</span>
14420                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
14421                                              <span class="dr-description">duration of the animation in milliseconds</span></li>
14422                                          <li class="topcoat-list__item"><span class="dr-param">easing</span>
14423                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
14424                                              <span class="dr-description">easing function from <a href="#mina" class="dr-link">mina</a> or custom</span></li>
14425                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
14426                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
14427                                              <span class="dr-description">callback function that executes when the animation ends</span></li>
14428
14429                                      </ol>
14430                                  </div>
14431
14432
14433
14434
14435
14436
14437
14438
14439                                  <p>or
14440</p>
14441
14442
14443
14444
14445
14446
14447
14448
14449
14450
14451                                  <div class="topcoat-list__container">
14452                                      <h3 class="topcoat-list__header">Parameters</h3>
14453                                      <ol class="topcoat-list">
14454                                          <li class="topcoat-list__item"><span class="dr-param">animation</span>
14455                                              <span class="dr-type"><em class="dr-type-array">array</em> </span>
14456                                              <span class="dr-description">array of animation parameter for each element in set in format <code>[attrs, duration, easing, callback]</code></span></li>
14457
14458                                      </ol>
14459                                  </div>
14460
14461
14462
14463
14464
14465
14466
14467
14468
14469
14470
14471                                  <h3>Usage</h3>
14472
14473
14474
14475
14476
14477
14478
14479
14480
14481
14482
14483                                  <section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">// animate all elements in set to radius 10
14484set.animate({r: 10}, 500, mina.easein);
14485// or
14486// animate first element to radius 10, but second to radius 20 and in different time
14487set.animate([{r: 10}, 500, mina.easein], [{r: 20}, 1500, mina.easein]);</code></pre></section>
14488
14489
14490
14491
14492
14493
14494
14495
14496
14497
14498
14499                                  <p class="dr-returns">
14500                                      <strong class="dr-title">Returns:</strong>
14501
14502                                      <em class="dr-type-Element">Element</em>
14503
14504                                      <span class="dr-description">the current element</span>
14505                                  </p>
14506
14507
14508
14509
14510                              </div>
14511                          </section>
14512                      </article>
14513
14514                      <article id="Set.bind">
14515                          <header>
14516                              <h3 class="dr-method">Set.bind(…)<a href="#Set.bind" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 170 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L170">&#x27ad;</a></h3>
14517                          </header>
14518                          <section>
14519                              <div class="extra" id="Set.bind-extra"></div>
14520                              <div class="dr-method">
14521
14522
14523
14524
14525                                  <p>Specifies how to handle a specific attribute when applied
14526to a set.
14527</p><p></p>
14528
14529
14530
14531
14532
14533
14534
14535
14536
14537
14538                                  <div class="topcoat-list__container">
14539                                      <h3 class="topcoat-list__header">Parameters</h3>
14540                                      <ol class="topcoat-list">
14541                                          <li class="topcoat-list__item"><span class="dr-param">attr</span>
14542                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14543                                              <span class="dr-description">attribute name</span></li>
14544                                          <li class="topcoat-list__item"><span class="dr-param">callback</span>
14545                                              <span class="dr-type"><em class="dr-type-function">function</em> </span>
14546                                              <span class="dr-description">function to run</span></li>
14547
14548                                      </ol>
14549                                  </div>
14550
14551
14552
14553
14554
14555
14556
14557
14558                                  <p>or
14559</p>
14560
14561
14562
14563
14564
14565
14566
14567
14568
14569
14570                                  <div class="topcoat-list__container">
14571                                      <h3 class="topcoat-list__header">Parameters</h3>
14572                                      <ol class="topcoat-list">
14573                                          <li class="topcoat-list__item"><span class="dr-param">attr</span>
14574                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14575                                              <span class="dr-description">attribute name</span></li>
14576                                          <li class="topcoat-list__item"><span class="dr-param">element</span>
14577                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
14578                                              <span class="dr-description">specific element in the set to apply the attribute to</span></li>
14579
14580                                      </ol>
14581                                  </div>
14582
14583
14584
14585
14586
14587
14588
14589
14590                                  <p>or
14591</p>
14592
14593
14594
14595
14596
14597
14598
14599
14600
14601
14602                                  <div class="topcoat-list__container">
14603                                      <h3 class="topcoat-list__header">Parameters</h3>
14604                                      <ol class="topcoat-list">
14605                                          <li class="topcoat-list__item"><span class="dr-param">attr</span>
14606                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14607                                              <span class="dr-description">attribute name</span></li>
14608                                          <li class="topcoat-list__item"><span class="dr-param">element</span>
14609                                              <span class="dr-type"><em class="dr-type-Element">Element</em> </span>
14610                                              <span class="dr-description">specific element in the set to apply the attribute to</span></li>
14611                                          <li class="topcoat-list__item"><span class="dr-param">eattr</span>
14612                                              <span class="dr-type"><em class="dr-type-string">string</em> </span>
14613                                              <span class="dr-description">attribute on the element to bind the attribute to</span></li>
14614
14615                                      </ol>
14616                                  </div>
14617
14618
14619
14620
14621
14622
14623
14624
14625
14626
14627
14628
14629
14630                                  <p class="dr-returns">
14631                                      <strong class="dr-title">Returns:</strong>
14632
14633                                      <em class="dr-type-object">object</em>
14634
14635                                      <span class="dr-description">Set object</span>
14636                                  </p>
14637
14638
14639
14640
14641                              </div>
14642                          </section>
14643                      </article>
14644
14645                      <article id="Set.clear">
14646                          <header>
14647                              <h3 class="dr-method">Set.clear()<a href="#Set.clear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 203 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L203">&#x27ad;</a></h3>
14648                          </header>
14649                          <section>
14650                              <div class="extra" id="Set.clear-extra"></div>
14651                              <div class="dr-method">
14652
14653
14654
14655
14656                                  <p>Removes all elements from the set
14657</p>
14658
14659
14660
14661
14662
14663
14664
14665
14666                              </div>
14667                          </section>
14668                      </article>
14669
14670                      <article id="Set.splice">
14671                          <header>
14672                              <h3 class="dr-method">Set.splice(index, count, [insertion…])<a href="#Set.splice" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 219 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L219">&#x27ad;</a></h3>
14673                          </header>
14674                          <section>
14675                              <div class="extra" id="Set.splice-extra"></div>
14676                              <div class="dr-method">
14677
14678
14679
14680
14681                                  <p>Removes range of elements from the set
14682</p>
14683
14684
14685
14686
14687
14688
14689
14690
14691
14692
14693                                  <div class="topcoat-list__container">
14694                                      <h3 class="topcoat-list__header">Parameters</h3>
14695                                      <ol class="topcoat-list">
14696                                          <li class="topcoat-list__item"><span class="dr-param">index</span>
14697                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
14698                                              <span class="dr-description">position of the deletion</span></li>
14699                                          <li class="topcoat-list__item"><span class="dr-param">count</span>
14700                                              <span class="dr-type"><em class="dr-type-number">number</em> </span>
14701                                              <span class="dr-description">number of element to remove</span></li>
14702                                          <li class="topcoat-list__item"><span class="dr-param">insertion…</span>
14703                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
14704                                              <span class="dr-description">elements to insert</span></li>
14705
14706                                      </ol>
14707                                  </div>
14708
14709
14710
14711
14712
14713
14714
14715
14716
14717
14718
14719
14720
14721                                  <p class="dr-returns">
14722                                      <strong class="dr-title">Returns:</strong>
14723
14724                                      <em class="dr-type-object">object</em>
14725
14726                                      <span class="dr-description">set elements that were deleted</span>
14727                                  </p>
14728
14729
14730
14731
14732                              </div>
14733                          </section>
14734                      </article>
14735
14736                      <article id="Set.exclude">
14737                          <header>
14738                              <h3 class="dr-method">Set.exclude(element)<a href="#Set.exclude" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 254 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L254">&#x27ad;</a></h3>
14739                          </header>
14740                          <section>
14741                              <div class="extra" id="Set.exclude-extra"></div>
14742                              <div class="dr-method">
14743
14744
14745
14746
14747                                  <p>Removes given element from the set
14748</p>
14749
14750
14751
14752
14753
14754
14755
14756
14757
14758
14759                                  <div class="topcoat-list__container">
14760                                      <h3 class="topcoat-list__header">Parameters</h3>
14761                                      <ol class="topcoat-list">
14762                                          <li class="topcoat-list__item"><span class="dr-param">element</span>
14763                                              <span class="dr-type"><em class="dr-type-object">object</em> </span>
14764                                              <span class="dr-description">element to remove</span></li>
14765
14766                                      </ol>
14767                                  </div>
14768
14769
14770
14771
14772
14773
14774
14775
14776
14777
14778
14779
14780
14781                                  <p class="dr-returns">
14782                                      <strong class="dr-title">Returns:</strong>
14783
14784                                      <em class="dr-type-boolean">boolean</em>
14785
14786                                      <span class="dr-description"><code>true</code> if object was found and removed from the set</span>
14787                                  </p>
14788
14789
14790
14791
14792                              </div>
14793                          </section>
14794                      </article>
14795
14796                  </div>
14797        <footer></footer>
14798      </div>
14799    </div>
14800    <!-- <script src="//use.edgefonts.net/source-sans-pro:n3,n4,n6;source-code-pro:n3.js"></script> -->
14801    <script src="/assets/docs/js/prism.js"></script>
14802<script>!function(e){if(e){for(var t=function(e,t){var n=t.toUpperCase().split(""),r=n.shift(),a=RegExp("^["+r.toLowerCase()+r+"][a-z]*"+n.join("[a-z]*")+"[a-z]*$")
14803return!!(e+"").match(a)},n=function(e,n){e+="",n+=""
14804var r,a=0
14805if(e==n)return 1
14806if(!e||!n)return 0
14807if(t(e,n))return.9
14808a=0,r=e.toLowerCase()
14809for(var i,o=0,l=n.length;l>o;o++)i=r.indexOf(n.charAt(o)),~i&&(r=r.substring(i+1),a+=1/(i+1))
14810return a=Math.max(a/l-Math.abs(e.length-l)/e.length/2,0)},r=e.getElementsByTagName("span"),a=[],i=/[^\.\(]*(?=(\(\))?$)/,o=0,l=r.length;l>o;o++)a[o]={li:r[o].parentNode.parentNode,text:r[o].innerHTML.match(i)[0]}
14811var h=document.getElementById("dr-filter"),f=function(e,t){return t.weight-e.weight}
14812h.onclick=h.onchange=h.onkeydown=h.onkeyup=function(){var t=h.value,r=[]
14813if(t.length>1){for(var i=0,o=a.length;o>i;i++)r[i]={li:a[i].li,weight:n(a[i].text,t)}
14814r.sort(f)}else r=a
14815for(i=0,o=r.length;o>i;i++)e.appendChild(r[i].li)}}}(document.getElementById("dr-toc"))</script>
14816</body></html>
14817