` element using the given string as the path's definition
+ - pathString (string) #optional path string in SVG format
+ * Path string consists of one-letter commands, followed by comma seprarated arguments in numerical form. Example:
+ | "M10,20L30,40"
+ * This example features two commands: `M`, with arguments `(10, 20)` and `L` with arguments `(30, 40)`. Uppercase letter commands express coordinates in absolute terms, while lowercase commands express them in relative terms from the most recently declared coordinates.
+ *
+ # Here is short list of commands available, for more details see SVG path string format or article about path strings at MDN.
+ # | Command | Name | Parameters |
|---|
+ # | M | moveto | (x y)+ |
+ # | Z | closepath | (none) |
+ # | L | lineto | (x y)+ |
+ # | H | horizontal lineto | x+ |
+ # | V | vertical lineto | y+ |
+ # | C | curveto | (x1 y1 x2 y2 x y)+ |
+ # | S | smooth curveto | (x2 y2 x y)+ |
+ # | Q | quadratic Bézier curveto | (x1 y1 x y)+ |
+ # | T | smooth quadratic Bézier curveto | (x y)+ |
+ # | A | elliptical arc | (rx ry x-axis-rotation large-arc-flag sweep-flag x y)+ |
+ # | R | Catmull-Rom curveto* | x1 y1 (x y)+ |
+ * * _Catmull-Rom curveto_ is a not standard SVG command and added to make life easier.
+ * Note: there is a special case when a path consists of only three commands: `M10,10R…z`. In this case the path connects back to its starting point.
+ > Usage
+ | var c = paper.path("M10 10L90 90");
+ | // draw a diagonal line:
+ | // move to 10,10, line to 90,90
+ \*/
+ proto.path = function (d) {
+ var attr;
+ if (is(d, "object") && !is(d, "array")) {
+ attr = d;
+ } else if (d) {
+ attr = {d: d};
+ }
+ return this.el("path", attr);
+ };
+ /*\
+ * Paper.g
+ [ method ]
+ **
+ * Creates a group element
+ **
+ - varargs (…) #optional elements to nest within the group
+ = (object) the `g` element
+ **
+ > Usage
+ | var c1 = paper.circle(),
+ | c2 = paper.rect(),
+ | g = paper.g(c2, c1); // note that the order of elements is different
+ * or
+ | var c1 = paper.circle(),
+ | c2 = paper.rect(),
+ | g = paper.g();
+ | g.add(c2, c1);
+ \*/
+ /*\
+ * Paper.group
+ [ method ]
+ **
+ * See @Paper.g
+ \*/
+ proto.group = proto.g = function (first) {
+ var attr,
+ el = this.el("g");
+ if (arguments.length == 1 && first && !first.type) {
+ el.attr(first);
+ } else if (arguments.length) {
+ el.add(Array.prototype.slice.call(arguments, 0));
+ }
+ return el;
+ };
+ /*\
+ * Paper.svg
+ [ method ]
+ **
+ * Creates a nested SVG element.
+ - x (number) @optional X of the element
+ - y (number) @optional Y of the element
+ - width (number) @optional width of the element
+ - height (number) @optional height of the element
+ - vbx (number) @optional viewbox X
+ - vby (number) @optional viewbox Y
+ - vbw (number) @optional viewbox width
+ - vbh (number) @optional viewbox height
+ **
+ = (object) the `svg` element
+ **
+ \*/
+ proto.svg = function (x, y, width, height, vbx, vby, vbw, vbh) {
+ var attrs = {};
+ if (is(x, "object") && y == null) {
+ attrs = x;
+ } else {
+ if (x != null) {
+ attrs.x = x;
+ }
+ if (y != null) {
+ attrs.y = y;
+ }
+ if (width != null) {
+ attrs.width = width;
+ }
+ if (height != null) {
+ attrs.height = height;
+ }
+ if (vbx != null && vby != null && vbw != null && vbh != null) {
+ attrs.viewBox = [vbx, vby, vbw, vbh];
+ }
+ }
+ return this.el("svg", attrs);
+ };
+ /*\
+ * Paper.mask
+ [ method ]
+ **
+ * Equivalent in behaviour to @Paper.g, except it’s a mask.
+ **
+ = (object) the `mask` element
+ **
+ \*/
+ proto.mask = function (first) {
+ var attr,
+ el = this.el("mask");
+ if (arguments.length == 1 && first && !first.type) {
+ el.attr(first);
+ } else if (arguments.length) {
+ el.add(Array.prototype.slice.call(arguments, 0));
+ }
+ return el;
+ };
+ /*\
+ * Paper.ptrn
+ [ method ]
+ **
+ * Equivalent in behaviour to @Paper.g, except it’s a mask.
+ - x (number) @optional X of the element
+ - y (number) @optional Y of the element
+ - width (number) @optional width of the element
+ - height (number) @optional height of the element
+ - vbx (number) @optional viewbox X
+ - vby (number) @optional viewbox Y
+ - vbw (number) @optional viewbox width
+ - vbh (number) @optional viewbox height
+ **
+ = (object) the `mask` element
+ **
+ \*/
+ proto.ptrn = function (x, y, width, height, vx, vy, vw, vh) {
+ if (is(x, "object")) {
+ var attr = x;
+ } else if (!arguments.length) {
+ attr = {patternUnits: "userSpaceOnUse"};
+ } else {
+ attr = {};
+ if (x != null) {
+ attr.x = x;
+ }
+ if (y != null) {
+ attr.y = y;
+ }
+ if (width != null) {
+ attr.width = width;
+ }
+ if (height != null) {
+ attr.height = height;
+ }
+ if (vx != null && vy != null && vw != null && vh != null) {
+ attr.viewBox = [vx, vy, vw, vh];
+ }
+ }
+ return this.el("pattern", attr);
+ };
+ /*\
+ * Paper.use
+ [ method ]
+ **
+ * Creates a