diff options
| -rw-r--r-- | CHANGELOG.md | 13 | ||||
| -rw-r--r-- | README.md | 84 | ||||
| -rw-r--r-- | Rakefile | 4 | ||||
| -rw-r--r-- | dist/svg.js | 136 | ||||
| -rw-r--r-- | dist/svg.min.js | 4 | ||||
| -rw-r--r-- | spec/spec/container.js | 4 | ||||
| -rw-r--r-- | spec/spec/doc.js | 15 | ||||
| -rw-r--r-- | spec/spec/element.js | 27 | ||||
| -rw-r--r-- | spec/spec/ellipse.js | 33 | ||||
| -rw-r--r-- | spec/spec/image.js | 20 | ||||
| -rw-r--r-- | spec/spec/line.js | 28 | ||||
| -rw-r--r-- | spec/spec/path.js | 45 | ||||
| -rw-r--r-- | spec/spec/polygon.js | 24 | ||||
| -rw-r--r-- | spec/spec/polyline.js | 24 | ||||
| -rw-r--r-- | spec/spec/rect.js | 33 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/arrange.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/array.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/bbox.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/clip.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/color.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/container.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/default.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/defs.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/doc.js | 29 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/element.js | 16 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/ellipse.js | 8 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/event.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/fx.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/gradient.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/group.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/image.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/line.js | 18 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/loader.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/mask.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/memory.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/nested.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/number.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/parent.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/path.js | 52 | ||||
| -rw-r--r-- | src/plotable.js | 42 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/poly.js | 12 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/rbox.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/rect.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/regex.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/set.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/shape.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/sugar.js | 9 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/svg.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/text.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/textpath.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/use.js | 0 | ||||
| -rwxr-xr-x[-rw-r--r--] | src/viewbox.js | 0 |
52 files changed, 565 insertions, 115 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..f4a406f --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,13 @@ +# v0.33 + +- added `has()` method to `SVG.Set` +- added `width()` and `height()` as setter and getter methods on all shapes +- moved sub-pixel offset fix to be an optional method (e.g. `SVG('drawing').fixSubPixelOffset()`) +- added `replace()` method to elements +- added `radius()` method to `SVG.Rect` and `SVG.Ellipse` +- added reference to parent node in defs +- merged plotable.js and path.js + +# v0.32 + +- added library to [cdnjs](http://cdnjs.com)
\ No newline at end of file @@ -17,24 +17,24 @@ See [svgjs.com](http://svgjs.com) for an introduction, [documentation](http://do Use the `SVG()` function to create a SVG document within a given html element: ```javascript -var draw = SVG('canvas').size(300, 300) +var draw = SVG('drawing').size(300, 300) var rect = draw.rect(100, 100).attr({ fill: '#f06' }) ``` The first argument can either be an id of the element or the selected element itself. This will generate the following output: ```html -<div id="canvas"> +<div id="drawing"> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="300" height="300"> <rect width="100" height="100" fill="#f06"></rect> </svg> </div> ``` -By default the svg canvas follows the dimensions of its parent, in this case `#canvas`: +By default the svg drawing follows the dimensions of its parent, in this case `#drawing`: ```javascript -var draw = SVG('canvas').size('100%', '100%') +var draw = SVG('drawing').size('100%', '100%') ``` ### Checking for SVG support @@ -43,7 +43,7 @@ By default this library assumes the client's browser supports SVG. You can test ```javascript if (SVG.supported) { - var draw = SVG('canvas') + var draw = SVG('drawing') var rect = draw.rect(100, 100) } else { alert('SVG not supported') @@ -77,7 +77,7 @@ var box = draw.viewbox() var zoom = box.zoom ``` -If the size of the viewbox equals the size of the svg canvas, the zoom value will be 1. +If the size of the viewbox equals the size of the svg drawing, the zoom value will be 1. ### Nested svg With this feature you can nest svg documents within each other. Nested svg documents have exactly the same features as the main, top-level svg document: @@ -97,17 +97,24 @@ Svg.js also works outside of the HTML DOM, inside an SVG document for example: ```xml <?xml version="1.0" encoding="utf-8" ?> -<svg id="viewport" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" > +<svg id="drawing" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" > <script type="text/javascript" xlink:href="svg.min.js"></script> <script type="text/javascript"> <![CDATA[ - var draw = SVG('viewport') + var draw = SVG('drawing') draw.rect(100,100).animate().fill('#f03').move(100,100) ]]> </script> </svg> ``` +### Sub pixel offset fix +By default wub pixel offset won't be corrected. To enable it, call the `fixSubPixelOffset()` method: + +```javascript +var draw = SVG('drawing').fixSubPixelOffset() +``` + ## Elements @@ -118,6 +125,18 @@ Rects have two arguments, their `width` and `height`: var rect = draw.rect(100, 100) ``` +Rects can also have rounded corners: + +```javascript +rect.radius(10) +``` + +This will set the `rx` and `ry` attributes to `10`. To set `rx` and `ry` individually: + +```javascript +rect.radius(10, 20) +``` + ### Ellipse Ellipses, like rects, have two arguments, their `width` and `height`: @@ -203,7 +222,11 @@ Note that paths will always be positioned at x=0, y=0 on creation. This is to ma var path = draw.path('M10,20L30,40', true) ``` -This logic is also applicable to polylines and polygons. +Paths can be updated using the `plot()` method: + +```javascript +path.plot('M100,200L300,400') +``` ### Image @@ -309,7 +332,7 @@ var rect = draw.rect(100, 100).fill('#f09') var use = draw.use(rect).move(200, 200) ``` -In the case of the example above two rects will appear on the svg canvas, the original and the `use` instance. In some cases you might want to hide the original element. the best way to do this is to create the original element in the defs node: +In the case of the example above two rects will appear on the svg drawing, the original and the `use` instance. In some cases you might want to hide the original element. the best way to do this is to create the original element in the defs node: ```javascript var rect = draw.defs().rect(100, 100).fill('#f09') @@ -335,13 +358,13 @@ There is no DOM querying system built into svg.js but [jQuery](http://jquery.com ```javascript /* add elements */ -var draw = SVG('canvas') +var draw = SVG('drawing') var group = draw.group().attr('class', 'my-group') var rect = group.rect(100,100).attr('class', 'my-element') var circle = group.circle(100).attr('class', 'my-element').move(100, 100) /* get elements in group */ -var elements = $('#canvas g.my-group .my-element').each(function() { +var elements = $('#drawing g.my-group .my-element').each(function() { this.instance.animate().fill('#f09') }) ``` @@ -561,6 +584,34 @@ rect.size(200, 300) Same as with `move()` the size of an element could be set by using `attr()`. But because every type of element is handles its size differently the `size()` method is much more convenient. + +### Width +Set only width of an element: + +```javascript +rect.width(200) +``` + +This method also acts as a getter: + +```javascript +rect.width() //-> returns 200 +``` + +### Height +Set only height of an element: + +```javascript +rect.height(325) +``` + +This method also acts as a getter: + +```javascript +rect.height() //-> returns 325 +``` + + ### Hide and show We all love to have a little hide: @@ -593,6 +644,14 @@ draw.clear() ``` +### Replacing elements +This method will replace the called element with the given element in the same position in the stack: + +```javascript +rect.replace(draw.circle(100)) +``` + + ### Bounding box ```javascript @@ -1358,6 +1417,7 @@ Here are a few nice plugins that are available for svg.js: - [svg.path.js](https://github.com/otm/svg.path.js) for manually drawing paths (by Nils Lagerkvist). - [svg.pattern.js](https://github.com/wout/svg.pattern.js) add fill patterns. - [svg.shapes.js](https://github.com/wout/svg.shapes.js) for more polygon based shapes. +- [svg.topath.js](https://github.com/wout/svg.shapes.js) to convert any other shape to a path. ## Building @@ -1,7 +1,7 @@ -SVGJS_VERSION = '0.32' +SVGJS_VERSION = '0.33' # all available modules in the correct loading order -MODULES = %w[ svg regex default color array number viewbox bbox rbox element parent container fx event defs group arrange mask clip gradient doc shape use rect ellipse line poly path plotable image text textpath nested sugar set memory loader ] +MODULES = %w[ svg regex default color array number viewbox bbox rbox element parent container fx event defs group arrange mask clip gradient doc shape use rect ellipse line poly path image text textpath nested sugar set memory loader ] # how many bytes in a "kilobyte" KILO = 1024 diff --git a/dist/svg.js b/dist/svg.js index 19a8178..25299d0 100644 --- a/dist/svg.js +++ b/dist/svg.js @@ -1,4 +1,4 @@ -/* svg.js v0.32-6-g74614e0 - svg regex default color array number viewbox bbox rbox element parent container fx event defs group arrange mask clip gradient doc shape use rect ellipse line poly path plotable image text textpath nested sugar set memory loader - svgjs.com/license */ +/* svg.js v0.33 - svg regex default color array number viewbox bbox rbox element parent container fx event defs group arrange mask clip gradient doc shape use rect ellipse line poly path image text textpath nested sugar set memory loader - svgjs.com/license */ ;(function() { this.SVG = function(element) { @@ -756,8 +756,16 @@ , center: function(x, y) { return this.cx(x).cy(y) } + // Set width of element + , width: function(width) { + return this.attr('width', width) + } + // Set height of element + , height: function(height) { + return this.attr('height', height) + } // Set element size to given width and height - , size: function(width, height) { + , size: function(width, height) { return this.attr({ width: new SVG.Number(width) , height: new SVG.Number(height) @@ -803,6 +811,12 @@ return this } + // Replace element + , replace: function(element) { + this.after(element).remove() + + return element + } // Get parent document , doc: function(type) { return this._parent(type || SVG.Doc) @@ -2033,7 +2047,11 @@ /* create the <defs> node */ this._defs = new SVG.Defs + this._defs.parent = this this.node.appendChild(this._defs.node) + + /* turno of sub pixel offset by default */ + this.doSubPixelOffsetFix = false /* ensure correct rendering */ if (this.parent.nodeName != 'svg') @@ -2075,11 +2093,11 @@ element.parent.appendChild(element.node) /* after wrapping is done, fix sub-pixel offset */ - element.fixSubPixelOffset() + element.subPixelOffsetFix() /* make sure sub-pixel offset is fixed every time the window is resized */ SVG.on(window, 'resize', function() { - element.fixSubPixelOffset() + element.subPixelOffsetFix() }) }, 5) @@ -2100,12 +2118,23 @@ // Fix for possible sub-pixel offset. See: // https://bugzilla.mozilla.org/show_bug.cgi?id=608812 + , subPixelOffsetFix: function() { + if (this.doSubPixelOffsetFix) { + var pos = this.node.getScreenCTM() + + if (pos) + this + .style('left', (-pos.e % 1) + 'px') + .style('top', (-pos.f % 1) + 'px') + } + + return this + } + , fixSubPixelOffset: function() { - var pos = this.node.getScreenCTM() - - this - .style('left', (-pos.e % 1) + 'px') - .style('top', (-pos.f % 1) + 'px') + this.doSubPixelOffsetFix = true + + return this } }) @@ -2187,6 +2216,14 @@ , cy: function(y) { return y == null ? this.attr('cy') : this.attr('cy', new SVG.Number(y).divide(this.trans.scaleY)) } + // Set width of element + , width: function(width) { + return width == null ? this.attr('rx') * 2 : this.attr('rx', new SVG.Number(width).divide(2)) + } + // Set height of element + , height: function(height) { + return height == null ? this.attr('ry') * 2 : this.attr('ry', new SVG.Number(height).divide(2)) + } // Custom size function , size: function(width, height) { return this.attr({ @@ -2251,13 +2288,21 @@ var half = this.bbox().height / 2 return y == null ? this.y() + half : this.y(y - half) } + // Set width of element + , width: function(width) { + var b = this.bbox() + + return width == null ? b.width : this.attr(this.attr('x1') < this.attr('x2') ? 'x2' : 'x1', b.x + width) + } + // Set height of element + , height: function(height) { + var b = this.bbox() + + return height == null ? b.height : this.attr(this.attr('y1') < this.attr('y2') ? 'y2' : 'y1', b.y + height) + } // Set line size by width and height , size: function(width, height) { - var b = this.bbox() - - return this - .attr(this.attr('x1') < this.attr('x2') ? 'x2' : 'x1', b.x + width) - .attr(this.attr('y1') < this.attr('y2') ? 'y2' : 'y1', b.y + height) + return this.width(width).height(height) } // Set path data , plot: function(x1, y1, x2, y2) { @@ -2315,6 +2360,18 @@ , y: function(y) { return y == null ? this.bbox().y : this.move(this.bbox().x, y) } + // Set width of element + , width: function(width) { + var b = this.bbox() + + return width == null ? b.width : this.size(width, b.height) + } + // Set height of element + , height: function(height) { + var b = this.bbox() + + return height == null ? b.height : this.size(b.width, height) + } // Set element size to given width and height , size: function(width, height) { return this.attr('points', this.points.size(width, height)) @@ -2345,23 +2402,6 @@ SVG.Path.prototype = new SVG.Shape SVG.extend(SVG.Path, { - // Private: Native plot - _plot: function(data) { - return this.attr('d', data || 'M0,0') - } - - }) - - // - SVG.extend(SVG.Container, { - // Create a wrapped path element - path: function(data, unbiased) { - return this.put(new SVG.Path(unbiased)).plot(data) - } - - }) - - SVG.extend(SVG.Path, { // Move over x-axis x: function(x) { return x == null ? this.bbox().x : this.transform('x', x) @@ -2370,6 +2410,18 @@ , y: function(y) { return y == null ? this.bbox().y : this.transform('y', y) } + // Set width of element + , width: function(width) { + var b = this.bbox() + + return width == null ? b.width : this.size(width, b.height) + } + // Set height of element + , height: function(height) { + var b = this.bbox() + + return height == null ? b.height : this.size(b.width, height) + } // Set the actual size in pixels , size: function(width, height) { var scale = width / this._offset.width @@ -2400,8 +2452,21 @@ return this.transform({ scaleX: x, scaleY: y }) } + // Private: Native plot + , _plot: function(data) { + return this.attr('d', data || 'M0,0') + } }) + + // + SVG.extend(SVG.Container, { + // Create a wrapped path element + path: function(data, unbiased) { + return this.put(new SVG.Path(unbiased)).plot(data) + } + + }) SVG.Image = function() { this.constructor.call(this, SVG.create('image')) @@ -2769,6 +2834,15 @@ }) + // + SVG.extend(SVG.Rect, SVG.Ellipse, { + // Add x and y radius + radius: function(x, y) { + return this.attr({ rx: x, ry: y || x }) + } + + }) + if (SVG.Text) { SVG.extend(SVG.Text, SVG.FX, { diff --git a/dist/svg.min.js b/dist/svg.min.js index f972de1..9f3dbd7 100644 --- a/dist/svg.min.js +++ b/dist/svg.min.js @@ -1,2 +1,2 @@ -!function(){if(this.SVG=function(t){return SVG.supported?new SVG.Doc(t):void 0},SVG.ns="http://www.w3.org/2000/svg",SVG.xlink="http://www.w3.org/1999/xlink",SVG.did=1e3,SVG.eid=function(t){return"Svgjs"+t.charAt(0).toUpperCase()+t.slice(1)+SVG.did++},SVG.create=function(t){var e=document.createElementNS(this.ns,t);return e.setAttribute("id",this.eid(t)),e},SVG.extend=function(){var t,e,i,n;for(t=[].slice.call(arguments),e=t.pop(),n=t.length-1;n>=0;n--)if(t[n])for(i in e)t[n].prototype[i]=e[i];SVG.Set&&SVG.Set.inherit&&SVG.Set.inherit()},SVG.get=function(t){var e=document.getElementById(t);return e?e.instance:void 0},SVG.supported=function(){return!!document.createElementNS&&!!document.createElementNS(SVG.ns,"svg").createSVGRect}(),!SVG.supported)return!1;SVG.regex={test:function(t,e){return this[e].test(t)},unit:/^(-?[\d\.]+)([a-z%]{0,2})$/,hex:/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i,rgb:/rgb\((\d+),(\d+),(\d+)\)/,isHex:/^#[a-f0-9]{3,6}$/i,isRgb:/^rgb\(/,isCss:/[^:]+:[^;]+;?/,isStyle:/^font|text|leading|cursor/,isBlank:/^(\s+)?$/,isNumber:/^-?[\d\.]+$/,isPercent:/^-?[\d\.]+%$/},SVG.defaults={matrix:"1 0 0 1 0 0",attrs:{"fill-opacity":1,"stroke-opacity":1,"stroke-width":0,"stroke-linejoin":"miter","stroke-linecap":"butt",fill:"#000000",stroke:"#000000",opacity:1,x:0,y:0,cx:0,cy:0,width:0,height:0,r:0,rx:0,ry:0,offset:0,"stop-opacity":1,"stop-color":"#000000"},trans:function(){return{x:0,y:0,scaleX:1,scaleY:1,rotation:0,skewX:0,skewY:0,matrix:this.matrix,a:1,b:0,c:0,d:1,e:0,f:0}}},SVG.Color=function(t){var e;this.r=0,this.g=0,this.b=0,"string"==typeof t?SVG.regex.isRgb.test(t)?(e=SVG.regex.rgb.exec(t.replace(/\s/g,"")),this.r=parseInt(e[1]),this.g=parseInt(e[2]),this.b=parseInt(e[3])):SVG.regex.isHex.test(t)&&(e=SVG.regex.hex.exec(this._fullHex(t)),this.r=parseInt(e[1],16),this.g=parseInt(e[2],16),this.b=parseInt(e[3],16)):"object"==typeof t&&(this.r=t.r,this.g=t.g,this.b=t.b)},SVG.extend(SVG.Color,{toString:function(){return this.toHex()},toHex:function(){return"#"+this._compToHex(this.r)+this._compToHex(this.g)+this._compToHex(this.b)},toRgb:function(){return"rgb("+[this.r,this.g,this.b].join()+")"},brightness:function(){return.3*(this.r/255)+.59*(this.g/255)+.11*(this.b/255)},_fullHex:function(t){return 4==t.length?["#",t.substring(1,2),t.substring(1,2),t.substring(2,3),t.substring(2,3),t.substring(3,4),t.substring(3,4)].join(""):t},_compToHex:function(t){var e=t.toString(16);return 1==e.length?"0"+e:e}}),SVG.Color.test=function(t){return t+="",SVG.regex.isHex.test(t)||SVG.regex.isRgb.test(t)},SVG.Color.isRgb=function(t){return t&&"number"==typeof t.r},SVG.Array=function(t,e){t=(t||[]).valueOf(),0==t.length&&e&&(t=e.valueOf()),this.value=this.parse(t)},SVG.extend(SVG.Array,{morph:function(t){if(this.destination=this.parse(t),this.value.length!=this.destination.length){for(var e=this.value[this.value.length-1],i=this.destination[this.destination.length-1];this.value.length>this.destination.length;)this.destination.push(i);for(;this.value.length<this.destination.length;)this.value.push(e)}return this},settle:function(){var t,e=[];for(t=this.value.length-1;t>=0;t--)-1==e.indexOf(this.value[t])&&e.push(this.value[t]);return this.value=e},at:function(t){if(!this.destination)return this;for(var e=0,i=this.value.length,n=[];i>e;e++)n.push(this.value[e]+(this.destination[e]-this.value[e])*t);return new SVG.Array(n)},toString:function(){return this.value.join(" ")},valueOf:function(){return this.value},parse:function(t){return t=t.valueOf(),Array.isArray(t)?t:this.split(t)},split:function(t){return t.replace(/\s+/g," ").replace(/^\s+|\s+$/g,"").split(" ")}}),SVG.PointArray=function(){this.constructor.apply(this,arguments)},SVG.PointArray.prototype=new SVG.Array,SVG.extend(SVG.PointArray,{toString:function(){for(var t=0,e=this.value.length,i=[];e>t;t++)i.push(this.value[t].join(","));return i.join(" ")},at:function(t){if(!this.destination)return this;for(var e=0,i=this.value.length,n=[];i>e;e++)n.push([this.value[e][0]+(this.destination[e][0]-this.value[e][0])*t,this.value[e][1]+(this.destination[e][1]-this.value[e][1])*t]);return new SVG.PointArray(n)},parse:function(t){if(t=t.valueOf(),Array.isArray(t))return t;t=this.split(t);for(var e,i=0,n=t.length,s=[];n>i;i++)e=t[i].split(","),s.push([parseFloat(e[0]),parseFloat(e[1])]);return s},move:function(t,e){var i=this.bbox();t-=i.x,e-=i.y;for(var n=this.value.length-1;n>=0;n--)this.value[n]=[this.value[n][0]+t,this.value[n][1]+e];return this},size:function(t,e){var i,n=this.bbox();for(i=this.value.length-1;i>=0;i--)this.value[i][0]=(this.value[i][0]-n.x)*t/n.width+n.x,this.value[i][1]=(this.value[i][1]-n.y)*e/n.height+n.x;return this},bbox:function(){if(0==this.value.length)return{x:0,y:0,width:0,height:0};var t,e=this.value[0][0],i=this.value[0][1],n={x:e,y:i};for(t=this.value.length-1;t>=0;t--)this.value[t][0]<n.x&&(n.x=this.value[t][0]),this.value[t][1]<n.y&&(n.y=this.value[t][1]),this.value[t][0]>e&&(e=this.value[t][0]),this.value[t][1]>i&&(i=this.value[t][1]);return n.width=e-n.x,n.height=i-n.y,n}}),SVG.Number=function(t){switch(this.value=0,this.unit="",typeof t){case"number":this.value=isNaN(t)?0:isFinite(t)?t:0>t?-3.4e38:3.4e38;break;case"string":var e=t.match(SVG.regex.unit);e&&(this.value=parseFloat(e[1]),"%"==e[2]&&(this.value/=100),this.unit=e[2]);break;default:t instanceof SVG.Number&&(this.value=t.value,this.unit=t.unit)}},SVG.extend(SVG.Number,{toString:function(){return("%"==this.unit?~~(1e8*this.value)/1e6:this.value)+this.unit},valueOf:function(){return this.value},to:function(t){return"string"==typeof t&&(this.unit=t),this},plus:function(t){return this.value=this+new SVG.Number(t),this},minus:function(t){return this.plus(-new SVG.Number(t))},times:function(t){return this.value=this*new SVG.Number(t),this},divide:function(t){return this.value=this/new SVG.Number(t),this}}),SVG.ViewBox=function(t){var e,i,n,s,r=t.bbox(),h=(t.attr("viewBox")||"").match(/-?[\d\.]+/g);this.x=r.x,this.y=r.y,this.width=t.node.clientWidth||t.node.getBoundingClientRect().width,this.height=t.node.clientHeight||t.node.getBoundingClientRect().height,h&&(e=parseFloat(h[0]),i=parseFloat(h[1]),n=parseFloat(h[2]),s=parseFloat(h[3]),this.zoom=this.width/this.height>n/s?this.height/s:this.width/n,this.x=e,this.y=i,this.width=n,this.height=s),this.zoom=this.zoom||1},SVG.extend(SVG.ViewBox,{toString:function(){return this.x+" "+this.y+" "+this.width+" "+this.height}}),SVG.BBox=function(t){var e;if(this.x=0,this.y=0,this.width=0,this.height=0,t){try{e=t.node.getBBox()}catch(i){e={x:t.node.clientLeft,y:t.node.clientTop,width:t.node.clientWidth,height:t.node.clientHeight}}this.x=e.x+t.trans.x,this.y=e.y+t.trans.y,this.width=e.width*t.trans.scaleX,this.height=e.height*t.trans.scaleY}this.cx=this.x+this.width/2,this.cy=this.y+this.height/2},SVG.extend(SVG.BBox,{merge:function(t){var e=new SVG.BBox;return e.x=Math.min(this.x,t.x),e.y=Math.min(this.y,t.y),e.width=Math.max(this.x+this.width,t.x+t.width)-e.x,e.height=Math.max(this.y+this.height,t.y+t.height)-e.y,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2,e}}),SVG.RBox=function(t){var e,i,n={};if(this.x=0,this.y=0,this.width=0,this.height=0,t){for(e=t.doc().parent,i=t.doc().viewbox().zoom,n=t.node.getBoundingClientRect(),this.x=n.left,this.y=n.top,this.x-=e.offsetLeft,this.y-=e.offsetTop;e=e.offsetParent;)this.x-=e.offsetLeft,this.y-=e.offsetTop;for(e=t;e=e.parent;)"svg"==e.type&&e.viewbox&&(i*=e.viewbox().zoom,this.x-=e.x()||0,this.y-=e.y()||0)}this.x/=i,this.y/=i,this.width=n.width/=i,this.height=n.height/=i,this.cx=this.x+this.width/2,this.cy=this.y+this.height/2},SVG.extend(SVG.RBox,{merge:function(t){var e=new SVG.RBox;return e.x=Math.min(this.x,t.x),e.y=Math.min(this.y,t.y),e.width=Math.max(this.x+this.width,t.x+t.width)-e.x,e.height=Math.max(this.y+this.height,t.y+t.height)-e.y,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2,e}}),SVG.Element=function(t){this._stroke=SVG.defaults.attrs.stroke,this.styles={},this.trans=SVG.defaults.trans(),(this.node=t)&&(this.type=t.nodeName,this.node.instance=this)},SVG.extend(SVG.Element,{x:function(t){return t&&(t=new SVG.Number(t),t.value/=this.trans.scaleX),this.attr("x",t)},y:function(t){return t&&(t=new SVG.Number(t),t.value/=this.trans.scaleY),this.attr("y",t)},cx:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)},cy:function(t){return null==t?this.bbox().cy:this.y(t-this.bbox().height/2)},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},size:function(t,e){return this.attr({width:new SVG.Number(t),height:new SVG.Number(e)})},clone:function(){var t,e,i=this.type;return t="rect"==i||"ellipse"==i?this.parent[i](0,0):"line"==i?this.parent[i](0,0,0,0):"image"==i?this.parent[i](this.src):"text"==i?this.parent[i](this.content):"path"==i?this.parent[i](this.attr("d")):"polyline"==i||"polygon"==i?this.parent[i](this.attr("points")):"g"==i?this.parent.group():this.parent[i](),e=this.attr(),delete e.id,t.attr(e),t.trans=this.trans,t.transform({})},remove:function(){return this.parent&&this.parent.removeElement(this),this},doc:function(t){return this._parent(t||SVG.Doc)},attr:function(t,e,i){if(null==t){for(t={},e=this.node.attributes,i=e.length-1;i>=0;i--)t[e[i].nodeName]=SVG.regex.test(e[i].nodeValue,"isNumber")?parseFloat(e[i].nodeValue):e[i].nodeValue;return t}if("object"==typeof t)for(e in t)this.attr(e,t[e]);else if(null===e)this.node.removeAttribute(t);else{if(null==e)return this._isStyle(t)?"text"==t?this.content:"leading"==t&&this.leading?this.leading():this.style(t):(e=this.node.getAttribute(t),null==e?SVG.defaults.attrs[t]:SVG.regex.test(e,"isNumber")?parseFloat(e):e);if("style"==t)return this.style(e);if("x"==t&&Array.isArray(this.lines))for(i=this.lines.length-1;i>=0;i--)this.lines[i].attr(t,e);"stroke-width"==t?this.attr("stroke",parseFloat(e)>0?this._stroke:null):"stroke"==t&&(this._stroke=e),SVG.Color.test(e)||SVG.Color.isRgb(e)?e=new SVG.Color(e):"number"==typeof e?e=new SVG.Number(e):Array.isArray(e)&&(e=new SVG.Array(e)),null!=i?this.node.setAttributeNS(i,t,e.toString()):this.node.setAttribute(t,e.toString()),this._isStyle(t)&&("text"==t?this.text(e):"leading"==t&&this.leading?this.leading(e):this.style(t,e),this.rebuild&&this.rebuild(t,e))}return this},transform:function(t,e){if(0==arguments.length)return this.trans;if("string"==typeof t){if(arguments.length<2)return this.trans[t];var i={};return i[t]=e,this.transform(i)}var i=[];t=this._parseMatrix(t);for(e in t)null!=t[e]&&(this.trans[e]=t[e]);return this.trans.matrix=this.trans.a+" "+this.trans.b+" "+this.trans.c+" "+this.trans.d+" "+this.trans.e+" "+this.trans.f,t=this.trans,t.matrix!=SVG.defaults.matrix&&i.push("matrix("+t.matrix+")"),0!=t.rotation&&i.push("rotate("+t.rotation+" "+(null==t.cx?this.bbox().cx:t.cx)+" "+(null==t.cy?this.bbox().cy:t.cy)+")"),(1!=t.scaleX||1!=t.scaleY)&&i.push("scale("+t.scaleX+" "+t.scaleY+")"),0!=t.skewX&&i.push("skewX("+t.skewX+")"),0!=t.skewY&&i.push("skewY("+t.skewY+")"),(0!=t.x||0!=t.y)&&i.push("translate("+new SVG.Number(t.x/t.scaleX)+" "+new SVG.Number(t.y/t.scaleY)+")"),this._offset&&0!=this._offset.x&&0!=this._offset.y&&i.push("translate("+-this._offset.x+" "+-this._offset.y+")"),0==i.length?this.node.removeAttribute("transform"):this.node.setAttribute("transform",i.join(" ")),this},style:function(t,e){if(0==arguments.length)return this.attr("style")||"";if(arguments.length<2)if("object"==typeof t)for(e in t)this.style(e,t[e]);else{if(!SVG.regex.isCss.test(t))return this.styles[t];t=t.split(";");for(var i=0;i<t.length;i++)e=t[i].split(":"),2==e.length&&this.style(e[0].replace(/\s+/g,""),e[1].replace(/^\s+/,"").replace(/\s+$/,""))}else null===e||SVG.regex.test(e,"isBlank")?delete this.styles[t]:this.styles[t]=e;t="";for(e in this.styles)t+=e+":"+this.styles[e]+";";return""==t?this.node.removeAttribute("style"):this.node.setAttribute("style",t),this},data:function(t,e,i){if(arguments.length<2)try{return JSON.parse(this.attr("data-"+t))}catch(n){return this.attr("data-"+t)}else this.attr("data-"+t,null===e?null:i===!0||"string"==typeof e||"number"==typeof e?e:JSON.stringify(e));return this},bbox:function(){return new SVG.BBox(this)},rbox:function(){return new SVG.RBox(this)},inside:function(t,e){var i=this.bbox();return t>i.x&&e>i.y&&t<i.x+i.width&&e<i.y+i.height},show:function(){return this.style("display","")},hide:function(){return this.style("display","none")},visible:function(){return"none"!=this.style("display")},toString:function(){return this.attr("id")},_parent:function(t){for(var e=this;null!=e&&!(e instanceof t);)e=e.parent;return e},_isStyle:function(t){return"string"==typeof t?SVG.regex.test(t,"isStyle"):!1},_parseMatrix:function(t){if(t.matrix){var e=t.matrix.replace(/\s/g,"").split(",");6==e.length&&(t.a=parseFloat(e[0]),t.b=parseFloat(e[1]),t.c=parseFloat(e[2]),t.d=parseFloat(e[3]),t.e=parseFloat(e[4]),t.f=parseFloat(e[5]))}return t}}),SVG.Parent=function(t){this.constructor.call(this,t)},SVG.Parent.prototype=new SVG.Element,SVG.extend(SVG.Parent,{children:function(){return this._children||(this._children=[])},add:function(t,e){if(!this.has(t)){if(e=null==e?this.children().length:e,t.parent){var i=t.parent.children().indexOf(t);t.parent.children().splice(i,1)}this.children().splice(e,0,t),this.node.insertBefore(t.node,this.node.childNodes[e]||null),t.parent=this}return this._defs&&(this.node.removeChild(this._defs.node),this.node.appendChild(this._defs.node)),this},put:function(t,e){return this.add(t,e),t},has:function(t){return this.children().indexOf(t)>=0},get:function(t){return this.children()[t]},first:function(){return this.children()[0]},last:function(){return this.children()[this.children().length-1]},each:function(t,e){var i,n,s=this.children();for(i=0,n=s.length;n>i;i++)s[i]instanceof SVG.Element&&t.apply(s[i],[i,s]),e&&s[i]instanceof SVG.Container&&s[i].each(t,e);return this},removeElement:function(t){var e=this.children().indexOf(t);return this.children().splice(e,1),this.node.removeChild(t.node),t.parent=null,this},clear:function(){for(var t=this.children().length-1;t>=0;t--)this.removeElement(this.children()[t]);return this._defs&&this._defs.clear(),this},defs:function(){return this.doc().defs()}}),SVG.Container=function(t){this.constructor.call(this,t)},SVG.Container.prototype=new SVG.Parent,SVG.extend(SVG.Container,{viewbox:function(t){return 0==arguments.length?new SVG.ViewBox(this):(t=1==arguments.length?[t.x,t.y,t.width,t.height]:[].slice.call(arguments),this.attr("viewBox",t))}}),SVG.FX=function(t){this.target=t},SVG.extend(SVG.FX,{animate:function(t,e,i){var n,s,r,h,o=this.target,a=this;return"object"==typeof t&&(i=t.delay,e=t.ease,t=t.duration),t=null==t?1e3:t,e=e||"<>",a.to=function(t){var i;if(t=0>t?0:t>1?1:t,null==n){n=[];for(h in a.attrs)n.push(h);if(o.morphArray){var u,l=new o.morphArray(a._plot||o.points.toString());a._size&&l.size(a._size.width.to,a._size.height.to),u=l.bbox(),a._x?l.move(a._x.to,u.y):a._cx&&l.move(a._cx.to-u.width/2,u.y),u=l.bbox(),a._y?l.move(u.x,a._y.to):a._cy&&l.move(u.x,a._cy.to-u.height/2),delete a._x,delete a._y,delete a._cx,delete a._cy,delete a._size,a._plot=o.points.morph(l)}}if(null==s){s=[];for(h in a.trans)s.push(h)}if(null==r){r=[];for(h in a.styles)r.push(h)}for(t="<>"==e?-Math.cos(t*Math.PI)/2+.5:">"==e?Math.sin(t*Math.PI/2):"<"==e?-Math.cos(t*Math.PI/2)+1:"-"==e?t:"function"==typeof e?e(t):t,a._x?o.x(a._at(a._x,t)):a._cx&&o.cx(a._at(a._cx,t)),a._y?o.y(a._at(a._y,t)):a._cy&&o.cy(a._at(a._cy,t)),a._size&&o.size(a._at(a._size.width,t),a._at(a._size.height,t)),a._plot&&o.plot(a._plot.at(t)),a._viewbox&&o.viewbox(a._at(a._viewbox.x,t),a._at(a._viewbox.y,t),a._at(a._viewbox.width,t),a._at(a._viewbox.height,t)),i=n.length-1;i>=0;i--)o.attr(n[i],a._at(a.attrs[n[i]],t));for(i=s.length-1;i>=0;i--)o.transform(s[i],a._at(a.trans[s[i]],t));for(i=r.length-1;i>=0;i--)o.style(r[i],a._at(a.styles[r[i]],t));a._during&&a._during.call(o,t,function(e,i){return a._at({from:e,to:i},t)})},"number"==typeof t&&(this.timeout=setTimeout(function(){var e=1e3/60,i=(new Date).getTime(),n=i+t;a.interval=setInterval(function(){var e=(new Date).getTime(),s=e>n?1:(e-i)/t;a.to(s),e>n&&(a._plot&&o.plot(new SVG.PointArray(a._plot.destination).settle()),clearInterval(a.interval),a._after?a._after.apply(o,[a]):a.stop())},t>e?e:t)},i||0)),this},bbox:function(){return this.target.bbox()},attr:function(t,e){if("object"==typeof t)for(var i in t)this.attr(i,t[i]);else this.attrs[t]={from:this.target.attr(t),to:e};return this},transform:function(t,e){if(1==arguments.length){t=this.target._parseMatrix(t),delete t.matrix;for(e in t)this.trans[e]={from:this.target.trans[e],to:t[e]}}else{var i={};i[t]=e,this.transform(i)}return this},style:function(t,e){if("object"==typeof t)for(var i in t)this.style(i,t[i]);else this.styles[t]={from:this.target.style(t),to:e};return this},x:function(t){return this._x={from:this.target.x(),to:t},this},y:function(t){return this._y={from:this.target.y(),to:t},this},cx:function(t){return this._cx={from:this.target.cx(),to:t},this},cy:function(t){return this._cy={from:this.target.cy(),to:t},this},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},size:function(t,e){if(this.target instanceof SVG.Text)this.attr("font-size",t);else{var i=this.target.bbox();this._size={width:{from:i.width,to:t},height:{from:i.height,to:e}}}return this},plot:function(t){return this._plot=t,this},viewbox:function(t,e,i,n){if(this.target instanceof SVG.Container){var s=this.target.viewbox();this._viewbox={x:{from:s.x,to:t},y:{from:s.y,to:e},width:{from:s.width,to:i},height:{from:s.height,to:n}}}return this},update:function(t){return this.target instanceof SVG.Stop&&(null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new SVG.Number(t.offset))),this},during:function(t){return this._during=t,this},after:function(t){return this._after=t,this},stop:function(){return clearTimeout(this.timeout),clearInterval(this.interval),this.attrs={},this.trans={},this.styles={},delete this._x,delete this._y,delete this._cx,delete this._cy,delete this._size,delete this._plot,delete this._after,delete this._during,delete this._viewbox,this},_at:function(t,e){return"number"==typeof t.from?t.from+(t.to-t.from)*e:SVG.regex.unit.test(t.to)?new SVG.Number(t.to).minus(new SVG.Number(t.from)).times(e).plus(new SVG.Number(t.from)):t.to&&(t.to.r||SVG.Color.test(t.to))?this._color(t,e):1>e?t.from:t.to},_color:function(t,e){var i,n;return e=0>e?0:e>1?1:e,i=new SVG.Color(t.from),n=new SVG.Color(t.to),new SVG.Color({r:~~(i.r+(n.r-i.r)*e),g:~~(i.g+(n.g-i.g)*e),b:~~(i.b+(n.b-i.b)*e)}).toHex()}}),SVG.extend(SVG.Element,{animate:function(t,e,i){return(this.fx||(this.fx=new SVG.FX(this))).stop().animate(t,e,i)},stop:function(){return this.fx&&this.fx.stop(),this}}),["click","dblclick","mousedown","mouseup","mouseover","mouseout","mousemove","mouseenter","mouseleave"].forEach(function(t){SVG.Element.prototype[t]=function(e){var i=this;return this.node["on"+t]="function"==typeof e?function(){return e.apply(i,arguments)}:null,this}}),SVG.on=function(t,e,i){t.addEventListener?t.addEventListener(e,i,!1):t.attachEvent("on"+e,i)},SVG.off=function(t,e,i){t.removeEventListener?t.removeEventListener(e,i,!1):t.detachEvent("on"+e,i)},SVG.extend(SVG.Element,{on:function(t,e){return SVG.on(this.node,t,e),this},off:function(t,e){return SVG.off(this.node,t,e),this}}),SVG.Defs=function(){this.constructor.call(this,SVG.create("defs"))},SVG.Defs.prototype=new SVG.Container,SVG.G=function(){this.constructor.call(this,SVG.create("g"))},SVG.G.prototype=new SVG.Container,SVG.extend(SVG.G,{x:function(t){return null==t?this.trans.x:this.transform("x",t)},y:function(t){return null==t?this.trans.y:this.transform("y",t)}}),SVG.extend(SVG.Container,{group:function(){return this.put(new SVG.G)}}),SVG.extend(SVG.Element,{siblings:function(){return this.parent.children()},position:function(){var t=this.siblings();return t.indexOf(this)},next:function(){return this.siblings()[this.position()+1]},previous:function(){return this.siblings()[this.position()-1]},forward:function(){var t=this.position();return this.parent.removeElement(this).put(this,t+1)},backward:function(){var t=this.position();return t>0&&this.parent.removeElement(this).add(this,t-1),this},front:function(){return this.parent.removeElement(this).put(this)},back:function(){return this.position()>0&&this.parent.removeElement(this).add(this,0),this},before:function(t){t.remove();var e=this.position();return this.parent.add(t,e),this},after:function(t){t.remove();var e=this.position();return this.parent.add(t,e+1),this}}),SVG.Mask=function(){this.constructor.call(this,SVG.create("mask")),this.targets=[]},SVG.Mask.prototype=new SVG.Container,SVG.extend(SVG.Mask,{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unmask();return delete this.targets,this.parent.removeElement(this),this}}),SVG.extend(SVG.Element,{maskWith:function(t){return this.masker=t instanceof SVG.Mask?t:this.parent.mask().add(t),this.masker.targets.push(this),this.attr("mask",'url("#'+this.masker.attr("id")+'")')},unmask:function(){return delete this.masker,this.attr("mask",null)}}),SVG.extend(SVG.Container,{mask:function(){return this.defs().put(new SVG.Mask)}}),SVG.Clip=function(){this.constructor.call(this,SVG.create("clipPath")),this.targets=[]},SVG.Clip.prototype=new SVG.Container,SVG.extend(SVG.Clip,{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unclip();return delete this.targets,this.parent.removeElement(this),this}}),SVG.extend(SVG.Element,{clipWith:function(t){return this.clipper=t instanceof SVG.Clip?t:this.parent.clip().add(t),this.clipper.targets.push(this),this.attr("clip-path",'url("#'+this.clipper.attr("id")+'")')},unclip:function(){return delete this.clipper,this.attr("clip-path",null)}}),SVG.extend(SVG.Container,{clip:function(){return this.defs().put(new SVG.Clip)}}),SVG.Gradient=function(t){this.constructor.call(this,SVG.create(t+"Gradient")),this.type=t},SVG.Gradient.prototype=new SVG.Container,SVG.extend(SVG.Gradient,{from:function(t,e){return"radial"==this.type?this.attr({fx:new SVG.Number(t),fy:new SVG.Number(e)}):this.attr({x1:new SVG.Number(t),y1:new SVG.Number(e)})},to:function(t,e){return"radial"==this.type?this.attr({cx:new SVG.Number(t),cy:new SVG.Number(e)}):this.attr({x2:new SVG.Number(t),y2:new SVG.Number(e)})},radius:function(t){return"radial"==this.type?this.attr({r:new SVG.Number(t)}):this},at:function(t){return this.put(new SVG.Stop(t))},update:function(t){return this.clear(),t(this),this},fill:function(){return"url(#"+this.attr("id")+")"},toString:function(){return this.fill()}}),SVG.extend(SVG.Defs,{gradient:function(t,e){var i=this.put(new SVG.Gradient(t));return e(i),i}}),SVG.extend(SVG.Container,{gradient:function(t,e){return this.defs().gradient(t,e)}}),SVG.Stop=function(t){this.constructor.call(this,SVG.create("stop")),this.update(t)},SVG.Stop.prototype=new SVG.Element,SVG.extend(SVG.Stop,{update:function(t){return null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new SVG.Number(t.offset)),this}}),SVG.Doc=function(t){this.parent="string"==typeof t?document.getElementById(t):t,this.constructor.call(this,"svg"==this.parent.nodeName?this.parent:SVG.create("svg")),this.attr({xmlns:SVG.ns,version:"1.1",width:"100%",height:"100%"}).attr("xlink",SVG.xlink,SVG.ns),this._defs=new SVG.Defs,this.node.appendChild(this._defs.node),"svg"!=this.parent.nodeName&&this.stage()},SVG.Doc.prototype=new SVG.Container,SVG.extend(SVG.Doc,{stage:function(){var t,e=this,i=document.createElement("div");return i.style.cssText="position:relative;height:100%;",e.parent.appendChild(i),i.appendChild(e.node),t=function(){"complete"===document.readyState?(e.style("position:absolute;"),setTimeout(function(){e.style("position:relative;overflow:hidden;"),e.parent.removeChild(e.node.parentNode),e.node.parentNode.removeChild(e.node),e.parent.appendChild(e.node),e.fixSubPixelOffset(),SVG.on(window,"resize",function(){e.fixSubPixelOffset()})},5)):setTimeout(t,10)},t(),this},defs:function(){return this._defs},fixSubPixelOffset:function(){var t=this.node.getScreenCTM();this.style("left",-t.e%1+"px").style("top",-t.f%1+"px")}}),SVG.Shape=function(t){this.constructor.call(this,t)},SVG.Shape.prototype=new SVG.Element,SVG.Use=function(){this.constructor.call(this,SVG.create("use"))},SVG.Use.prototype=new SVG.Shape,SVG.extend(SVG.Use,{element:function(t){return this.target=t,this.attr("href","#"+t,SVG.xlink)}}),SVG.extend(SVG.Container,{use:function(t){return this.put(new SVG.Use).element(t)}}),SVG.Rect=function(){this.constructor.call(this,SVG.create("rect"))},SVG.Rect.prototype=new SVG.Shape,SVG.extend(SVG.Container,{rect:function(t,e){return this.put((new SVG.Rect).size(t,e))}}),SVG.Ellipse=function(){this.constructor.call(this,SVG.create("ellipse"))},SVG.Ellipse.prototype=new SVG.Shape,SVG.extend(SVG.Ellipse,{x:function(t){return null==t?this.cx()-this.attr("rx"):this.cx(t+this.attr("rx"))},y:function(t){return null==t?this.cy()-this.attr("ry"):this.cy(t+this.attr("ry"))},cx:function(t){return null==t?this.attr("cx"):this.attr("cx",new SVG.Number(t).divide(this.trans.scaleX))},cy:function(t){return null==t?this.attr("cy"):this.attr("cy",new SVG.Number(t).divide(this.trans.scaleY))},size:function(t,e){return this.attr({rx:new SVG.Number(t).divide(2),ry:new SVG.Number(e).divide(2)})}}),SVG.extend(SVG.Container,{circle:function(t){return this.ellipse(t,t)},ellipse:function(t,e){return this.put(new SVG.Ellipse).size(t,e).move(0,0)}}),SVG.Line=function(){this.constructor.call(this,SVG.create("line"))},SVG.Line.prototype=new SVG.Shape,SVG.extend(SVG.Line,{x:function(t){var e=this.bbox();return null==t?e.x:this.attr({x1:this.attr("x1")-e.x+t,x2:this.attr("x2")-e.x+t})},y:function(t){var e=this.bbox();return null==t?e.y:this.attr({y1:this.attr("y1")-e.y+t,y2:this.attr("y2")-e.y+t})},cx:function(t){var e=this.bbox().width/2;return null==t?this.x()+e:this.x(t-e)},cy:function(t){var e=this.bbox().height/2;return null==t?this.y()+e:this.y(t-e)},size:function(t,e){var i=this.bbox();return this.attr(this.attr("x1")<this.attr("x2")?"x2":"x1",i.x+t).attr(this.attr("y1")<this.attr("y2")?"y2":"y1",i.y+e)},plot:function(t,e,i,n){return this.attr({x1:t,y1:e,x2:i,y2:n})}}),SVG.extend(SVG.Container,{line:function(t,e,i,n){return this.put((new SVG.Line).plot(t,e,i,n))}}),SVG.Polyline=function(){this.constructor.call(this,SVG.create("polyline"))},SVG.Polyline.prototype=new SVG.Shape,SVG.Polygon=function(){this.constructor.call(this,SVG.create("polygon"))},SVG.Polygon.prototype=new SVG.Shape,SVG.extend(SVG.Polyline,SVG.Polygon,{morphArray:SVG.PointArray,plot:function(t){return this.attr("points",this.points=new SVG.PointArray(t,[[0,0]]))},move:function(t,e){return this.attr("points",this.points.move(t,e))},x:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)},y:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)},size:function(t,e){return this.attr("points",this.points.size(t,e))}}),SVG.extend(SVG.Container,{polyline:function(t){return this.put(new SVG.Polyline).plot(t)},polygon:function(t){return this.put(new SVG.Polygon).plot(t)}}),SVG.Path=function(t){this.constructor.call(this,SVG.create("path")),this.unbiased=!!t},SVG.Path.prototype=new SVG.Shape,SVG.extend(SVG.Path,{_plot:function(t){return this.attr("d",t||"M0,0")}}),SVG.extend(SVG.Container,{path:function(t,e){return this.put(new SVG.Path(e)).plot(t)}}),SVG.extend(SVG.Path,{x:function(t){return null==t?this.bbox().x:this.transform("x",t)},y:function(t){return null==t?this.bbox().y:this.transform("y",t)},size:function(t,e){var i=t/this._offset.width;return this.transform({scaleX:i,scaleY:null!=e?e/this._offset.height:i})},plot:function(t){var e=this.trans.scaleX,i=this.trans.scaleY;return this._plot(t),this._offset=this.transform({scaleX:1,scaleY:1}).bbox(),this.unbiased?this._offset.x=this._offset.y=0:(this._offset.x-=this.trans.x,this._offset.y-=this.trans.y),this.transform({scaleX:e,scaleY:i})}}),SVG.Image=function(){this.constructor.call(this,SVG.create("image"))},SVG.Image.prototype=new SVG.Shape,SVG.extend(SVG.Image,{load:function(t){return t?this.attr("href",this.src=t,SVG.xlink):this}}),SVG.extend(SVG.Container,{image:function(t,e,i){return e=null!=e?e:100,this.put((new SVG.Image).load(t).size(e,null!=i?i:e))}});var t="size family weight stretch variant style".split(" ");SVG.Text=function(){this.constructor.call(this,SVG.create("text")),this.styles={"font-size":16,"font-family":"Helvetica, Arial, sans-serif","text-anchor":"start"},this._leading=new SVG.Number("1.2em"),this._rebuild=!0},SVG.Text.prototype=new SVG.Shape,SVG.extend(SVG.Text,{x:function(t,e){return null==t?e?this.attr("x"):this.bbox().x:(e||(e=this.style("text-anchor"),t="start"==e?t:"end"==e?t+this.bbox().width:t+this.bbox().width/2),this.textPath||this.lines.each(function(){this.newLined&&this.x(t)}),this.attr("x",t))},cx:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)},cy:function(t,e){return null==t?this.bbox().cy:this.y(e?t:t-this.bbox().height/2)},move:function(t,e,i){return this.x(t,i).y(e)},center:function(t,e,i){return this.cx(t,i).cy(e,i)},text:function(t){if(null==t)return this.content;if(this.clear(),"function"==typeof t)this._rebuild=!1,t(this);else{this._rebuild=!0,t=SVG.regex.isBlank.test(t)?"text":t;var e,i,n=t.split("\n");for(e=0,i=n.length;i>e;e++)this.tspan(n[e]).newLine();this.rebuild()}return this},tspan:function(t){var e=this.textPath?this.textPath.node:this.node,i=(new SVG.TSpan).text(t),n=this.style();return e.appendChild(i.node),this.lines.add(i),SVG.regex.isBlank.test(n)||i.style(n),this.content+=t,i.parent=this,i},size:function(t){return this.attr("font-size",t)},leading:function(t){return null==t?this._leading:(t=new SVG.Number(t),this._leading=t,this.lines.each(function(){this.newLined&&this.attr("dy",t)}),this)},rebuild:function(){return this._rebuild&&this.lines.attr({x:this.attr("x"),dy:this._leading,style:this.style()}),this},clear:function(){for(var t=this.textPath?this.textPath.node:this.node;t.hasChildNodes();)t.removeChild(t.lastChild);return delete this.lines,this.lines=new SVG.Set,this.content="",this}}),SVG.extend(SVG.Container,{text:function(t){return this.put(new SVG.Text).text(t)}}),SVG.TSpan=function(){this.constructor.call(this,SVG.create("tspan"))},SVG.TSpan.prototype=new SVG.Shape,SVG.extend(SVG.TSpan,{text:function(t){return this.node.appendChild(document.createTextNode(t)),this},dx:function(t){return this.attr("dx",t)},dy:function(t){return this.attr("dy",t)},newLine:function(){return this.newLined=!0,this.parent.content+="\n",this.dy(this.parent._leading),this.attr("x",this.parent.x())}}),SVG.TextPath=function(){this.constructor.call(this,SVG.create("textPath"))},SVG.TextPath.prototype=new SVG.Element,SVG.extend(SVG.Text,{path:function(t){for(this.textPath=new SVG.TextPath;this.node.hasChildNodes();)this.textPath.node.appendChild(this.node.firstChild);return this.node.appendChild(this.textPath.node),this.track=this.doc().defs().path(t,!0),this.textPath.parent=this,this.textPath.attr("href","#"+this.track,SVG.xlink),this},plot:function(t){return this.track&&this.track.plot(t),this}}),SVG.Nested=function(){this.constructor.call(this,SVG.create("svg")),this.style("overflow","visible")},SVG.Nested.prototype=new SVG.Container,SVG.extend(SVG.Container,{nested:function(){return this.put(new SVG.Nested)}}),SVG._stroke=["color","width","opacity","linecap","linejoin","miterlimit","dasharray","dashoffset"],SVG._fill=["color","opacity","rule"];var e=function(t,e){return"color"==e?t:t+"-"+e};["fill","stroke"].forEach(function(t){var i={};i[t]=function(i){if("string"==typeof i||SVG.Color.isRgb(i)||i&&"function"==typeof i.fill)this.attr(t,i);else for(index=SVG["_"+t].length-1;index>=0;index--)null!=i[SVG["_"+t][index]]&&this.attr(e(t,SVG["_"+t][index]),i[SVG["_"+t][index]]);return this},SVG.extend(SVG.Element,SVG.FX,i)}),SVG.extend(SVG.Element,SVG.FX,{rotate:function(t,e,i){return this.transform({rotation:t||0,cx:e,cy:i})},skew:function(t,e){return this.transform({skewX:t||0,skewY:e||0})},scale:function(t,e){return this.transform({scaleX:t,scaleY:null==e?t:e})},translate:function(t,e){return this.transform({x:t,y:e})},matrix:function(t){return this.transform({matrix:t})},opacity:function(t){return this.attr("opacity",t)}}),SVG.Text&&SVG.extend(SVG.Text,SVG.FX,{font:function(e){for(var i in e)"anchor"==i?this.attr("text-anchor",e[i]):t.indexOf(i)>-1?this.attr("font-"+i,e[i]):this.attr(i,e[i]);return this}}),SVG.Set=function(){this.clear()},SVG.SetFX=function(t){this.set=t},SVG.extend(SVG.Set,{add:function(){var t,e,i=[].slice.call(arguments); -for(t=0,e=i.length;e>t;t++)this.members.push(i[t]);return this},remove:function(t){var e=this.members.indexOf(t);return e>-1&&this.members.splice(e,1),this},each:function(t){for(var e=0,i=this.members.length;i>e;e++)t.apply(this.members[e],[e,this.members]);return this},clear:function(){return this.members=[],this},valueOf:function(){return this.members}}),SVG.Set.inherit=function(){var t,e=[];for(var t in SVG.Shape.prototype)"function"==typeof SVG.Shape.prototype[t]&&"function"!=typeof SVG.Set.prototype[t]&&e.push(t);e.forEach(function(t){SVG.Set.prototype[t]=function(){for(var e=0,i=this.members.length;i>e;e++)this.members[e]&&"function"==typeof this.members[e][t]&&this.members[e][t].apply(this.members[e],arguments);return"animate"==t?this.fx||(this.fx=new SVG.SetFX(this)):this}}),e=[];for(var t in SVG.FX.prototype)"function"==typeof SVG.FX.prototype[t]&&"function"!=typeof SVG.SetFX.prototype[t]&&e.push(t);e.forEach(function(t){SVG.SetFX.prototype[t]=function(){for(var e=0,i=this.set.members.length;i>e;e++)this.set.members[e].fx[t].apply(this.set.members[e].fx,arguments);return this}})},SVG.extend(SVG.Container,{set:function(){return new SVG.Set}}),SVG.extend(SVG.Element,{remember:function(t,e){if("object"==typeof arguments[0])for(var e in t)this.remember(e,t[e]);else{if(1==arguments.length)return this.memory()[t];this.memory()[t]=e}return this},forget:function(){if(0==arguments.length)this._memory={};else for(var t=arguments.length-1;t>=0;t--)delete this.memory()[arguments[t]];return this},memory:function(){return this._memory||(this._memory={})}}),"function"==typeof define&&define.amd?define(function(){return SVG}):"undefined"!=typeof exports&&(exports.SVG=SVG)}.call(this);
\ No newline at end of file +(function(){if(this.SVG=function(t){return SVG.supported?new SVG.Doc(t):void 0},SVG.ns="http://www.w3.org/2000/svg",SVG.xlink="http://www.w3.org/1999/xlink",SVG.did=1e3,SVG.eid=function(t){return"Svgjs"+t.charAt(0).toUpperCase()+t.slice(1)+SVG.did++},SVG.create=function(t){var e=document.createElementNS(this.ns,t);return e.setAttribute("id",this.eid(t)),e},SVG.extend=function(){var t,e,i,n;for(t=[].slice.call(arguments),e=t.pop(),n=t.length-1;n>=0;n--)if(t[n])for(i in e)t[n].prototype[i]=e[i];SVG.Set&&SVG.Set.inherit&&SVG.Set.inherit()},SVG.get=function(t){var e=document.getElementById(t);return e?e.instance:void 0},SVG.supported=function(){return!!document.createElementNS&&!!document.createElementNS(SVG.ns,"svg").createSVGRect}(),!SVG.supported)return!1;SVG.regex={test:function(t,e){return this[e].test(t)},unit:/^(-?[\d\.]+)([a-z%]{0,2})$/,hex:/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i,rgb:/rgb\((\d+),(\d+),(\d+)\)/,isHex:/^#[a-f0-9]{3,6}$/i,isRgb:/^rgb\(/,isCss:/[^:]+:[^;]+;?/,isStyle:/^font|text|leading|cursor/,isBlank:/^(\s+)?$/,isNumber:/^-?[\d\.]+$/,isPercent:/^-?[\d\.]+%$/},SVG.defaults={matrix:"1 0 0 1 0 0",attrs:{"fill-opacity":1,"stroke-opacity":1,"stroke-width":0,"stroke-linejoin":"miter","stroke-linecap":"butt",fill:"#000000",stroke:"#000000",opacity:1,x:0,y:0,cx:0,cy:0,width:0,height:0,r:0,rx:0,ry:0,offset:0,"stop-opacity":1,"stop-color":"#000000"},trans:function(){return{x:0,y:0,scaleX:1,scaleY:1,rotation:0,skewX:0,skewY:0,matrix:this.matrix,a:1,b:0,c:0,d:1,e:0,f:0}}},SVG.Color=function(t){var e;this.r=0,this.g=0,this.b=0,"string"==typeof t?SVG.regex.isRgb.test(t)?(e=SVG.regex.rgb.exec(t.replace(/\s/g,"")),this.r=parseInt(e[1]),this.g=parseInt(e[2]),this.b=parseInt(e[3])):SVG.regex.isHex.test(t)&&(e=SVG.regex.hex.exec(this._fullHex(t)),this.r=parseInt(e[1],16),this.g=parseInt(e[2],16),this.b=parseInt(e[3],16)):"object"==typeof t&&(this.r=t.r,this.g=t.g,this.b=t.b)},SVG.extend(SVG.Color,{toString:function(){return this.toHex()},toHex:function(){return"#"+this._compToHex(this.r)+this._compToHex(this.g)+this._compToHex(this.b)},toRgb:function(){return"rgb("+[this.r,this.g,this.b].join()+")"},brightness:function(){return.3*(this.r/255)+.59*(this.g/255)+.11*(this.b/255)},_fullHex:function(t){return 4==t.length?["#",t.substring(1,2),t.substring(1,2),t.substring(2,3),t.substring(2,3),t.substring(3,4),t.substring(3,4)].join(""):t},_compToHex:function(t){var e=t.toString(16);return 1==e.length?"0"+e:e}}),SVG.Color.test=function(t){return t+="",SVG.regex.isHex.test(t)||SVG.regex.isRgb.test(t)},SVG.Color.isRgb=function(t){return t&&"number"==typeof t.r},SVG.Array=function(t,e){t=(t||[]).valueOf(),0==t.length&&e&&(t=e.valueOf()),this.value=this.parse(t)},SVG.extend(SVG.Array,{morph:function(t){if(this.destination=this.parse(t),this.value.length!=this.destination.length){for(var e=this.value[this.value.length-1],i=this.destination[this.destination.length-1];this.value.length>this.destination.length;)this.destination.push(i);for(;this.value.length<this.destination.length;)this.value.push(e)}return this},settle:function(){var t,e=[];for(t=this.value.length-1;t>=0;t--)-1==e.indexOf(this.value[t])&&e.push(this.value[t]);return this.value=e},at:function(t){if(!this.destination)return this;for(var e=0,i=this.value.length,n=[];i>e;e++)n.push(this.value[e]+(this.destination[e]-this.value[e])*t);return new SVG.Array(n)},toString:function(){return this.value.join(" ")},valueOf:function(){return this.value},parse:function(t){return t=t.valueOf(),Array.isArray(t)?t:this.split(t)},split:function(t){return t.replace(/\s+/g," ").replace(/^\s+|\s+$/g,"").split(" ")}}),SVG.PointArray=function(){this.constructor.apply(this,arguments)},SVG.PointArray.prototype=new SVG.Array,SVG.extend(SVG.PointArray,{toString:function(){for(var t=0,e=this.value.length,i=[];e>t;t++)i.push(this.value[t].join(","));return i.join(" ")},at:function(t){if(!this.destination)return this;for(var e=0,i=this.value.length,n=[];i>e;e++)n.push([this.value[e][0]+(this.destination[e][0]-this.value[e][0])*t,this.value[e][1]+(this.destination[e][1]-this.value[e][1])*t]);return new SVG.PointArray(n)},parse:function(t){if(t=t.valueOf(),Array.isArray(t))return t;t=this.split(t);for(var e,i=0,n=t.length,r=[];n>i;i++)e=t[i].split(","),r.push([parseFloat(e[0]),parseFloat(e[1])]);return r},move:function(t,e){var i=this.bbox();t-=i.x,e-=i.y;for(var n=this.value.length-1;n>=0;n--)this.value[n]=[this.value[n][0]+t,this.value[n][1]+e];return this},size:function(t,e){var i,n=this.bbox();for(i=this.value.length-1;i>=0;i--)this.value[i][0]=(this.value[i][0]-n.x)*t/n.width+n.x,this.value[i][1]=(this.value[i][1]-n.y)*e/n.height+n.x;return this},bbox:function(){if(0==this.value.length)return{x:0,y:0,width:0,height:0};var t,e=this.value[0][0],i=this.value[0][1],n={x:e,y:i};for(t=this.value.length-1;t>=0;t--)this.value[t][0]<n.x&&(n.x=this.value[t][0]),this.value[t][1]<n.y&&(n.y=this.value[t][1]),this.value[t][0]>e&&(e=this.value[t][0]),this.value[t][1]>i&&(i=this.value[t][1]);return n.width=e-n.x,n.height=i-n.y,n}}),SVG.Number=function(t){switch(this.value=0,this.unit="",typeof t){case"number":this.value=isNaN(t)?0:isFinite(t)?t:0>t?-3.4e38:3.4e38;break;case"string":var e=t.match(SVG.regex.unit);e&&(this.value=parseFloat(e[1]),"%"==e[2]&&(this.value/=100),this.unit=e[2]);break;default:t instanceof SVG.Number&&(this.value=t.value,this.unit=t.unit)}},SVG.extend(SVG.Number,{toString:function(){return("%"==this.unit?~~(1e8*this.value)/1e6:this.value)+this.unit},valueOf:function(){return this.value},to:function(t){return"string"==typeof t&&(this.unit=t),this},plus:function(t){return this.value=this+new SVG.Number(t),this},minus:function(t){return this.plus(-new SVG.Number(t))},times:function(t){return this.value=this*new SVG.Number(t),this},divide:function(t){return this.value=this/new SVG.Number(t),this}}),SVG.ViewBox=function(t){var e,i,n,r,s=t.bbox(),h=(t.attr("viewBox")||"").match(/-?[\d\.]+/g);this.x=s.x,this.y=s.y,this.width=t.node.clientWidth||t.node.getBoundingClientRect().width,this.height=t.node.clientHeight||t.node.getBoundingClientRect().height,h&&(e=parseFloat(h[0]),i=parseFloat(h[1]),n=parseFloat(h[2]),r=parseFloat(h[3]),this.zoom=this.width/this.height>n/r?this.height/r:this.width/n,this.x=e,this.y=i,this.width=n,this.height=r),this.zoom=this.zoom||1},SVG.extend(SVG.ViewBox,{toString:function(){return this.x+" "+this.y+" "+this.width+" "+this.height}}),SVG.BBox=function(t){var e;if(this.x=0,this.y=0,this.width=0,this.height=0,t){try{e=t.node.getBBox()}catch(i){e={x:t.node.clientLeft,y:t.node.clientTop,width:t.node.clientWidth,height:t.node.clientHeight}}this.x=e.x+t.trans.x,this.y=e.y+t.trans.y,this.width=e.width*t.trans.scaleX,this.height=e.height*t.trans.scaleY}this.cx=this.x+this.width/2,this.cy=this.y+this.height/2},SVG.extend(SVG.BBox,{merge:function(t){var e=new SVG.BBox;return e.x=Math.min(this.x,t.x),e.y=Math.min(this.y,t.y),e.width=Math.max(this.x+this.width,t.x+t.width)-e.x,e.height=Math.max(this.y+this.height,t.y+t.height)-e.y,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2,e}}),SVG.RBox=function(t){var e,i,n={};if(this.x=0,this.y=0,this.width=0,this.height=0,t){for(e=t.doc().parent,i=t.doc().viewbox().zoom,n=t.node.getBoundingClientRect(),this.x=n.left,this.y=n.top,this.x-=e.offsetLeft,this.y-=e.offsetTop;e=e.offsetParent;)this.x-=e.offsetLeft,this.y-=e.offsetTop;for(e=t;e=e.parent;)"svg"==e.type&&e.viewbox&&(i*=e.viewbox().zoom,this.x-=e.x()||0,this.y-=e.y()||0)}this.x/=i,this.y/=i,this.width=n.width/=i,this.height=n.height/=i,this.cx=this.x+this.width/2,this.cy=this.y+this.height/2},SVG.extend(SVG.RBox,{merge:function(t){var e=new SVG.RBox;return e.x=Math.min(this.x,t.x),e.y=Math.min(this.y,t.y),e.width=Math.max(this.x+this.width,t.x+t.width)-e.x,e.height=Math.max(this.y+this.height,t.y+t.height)-e.y,e.cx=e.x+e.width/2,e.cy=e.y+e.height/2,e}}),SVG.Element=function(t){this._stroke=SVG.defaults.attrs.stroke,this.styles={},this.trans=SVG.defaults.trans(),(this.node=t)&&(this.type=t.nodeName,this.node.instance=this)},SVG.extend(SVG.Element,{x:function(t){return t&&(t=new SVG.Number(t),t.value/=this.trans.scaleX),this.attr("x",t)},y:function(t){return t&&(t=new SVG.Number(t),t.value/=this.trans.scaleY),this.attr("y",t)},cx:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)},cy:function(t){return null==t?this.bbox().cy:this.y(t-this.bbox().height/2)},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},width:function(t){return this.attr("width",t)},height:function(t){return this.attr("height",t)},size:function(t,e){return this.attr({width:new SVG.Number(t),height:new SVG.Number(e)})},clone:function(){var t,e,i=this.type;return t="rect"==i||"ellipse"==i?this.parent[i](0,0):"line"==i?this.parent[i](0,0,0,0):"image"==i?this.parent[i](this.src):"text"==i?this.parent[i](this.content):"path"==i?this.parent[i](this.attr("d")):"polyline"==i||"polygon"==i?this.parent[i](this.attr("points")):"g"==i?this.parent.group():this.parent[i](),e=this.attr(),delete e.id,t.attr(e),t.trans=this.trans,t.transform({})},remove:function(){return this.parent&&this.parent.removeElement(this),this},replace:function(t){return this.after(t).remove(),t},doc:function(t){return this._parent(t||SVG.Doc)},attr:function(t,e,i){if(null==t){for(t={},e=this.node.attributes,i=e.length-1;i>=0;i--)t[e[i].nodeName]=SVG.regex.test(e[i].nodeValue,"isNumber")?parseFloat(e[i].nodeValue):e[i].nodeValue;return t}if("object"==typeof t)for(e in t)this.attr(e,t[e]);else if(null===e)this.node.removeAttribute(t);else{if(null==e)return this._isStyle(t)?"text"==t?this.content:"leading"==t&&this.leading?this.leading():this.style(t):(e=this.node.getAttribute(t),null==e?SVG.defaults.attrs[t]:SVG.regex.test(e,"isNumber")?parseFloat(e):e);if("style"==t)return this.style(e);if("x"==t&&Array.isArray(this.lines))for(i=this.lines.length-1;i>=0;i--)this.lines[i].attr(t,e);"stroke-width"==t?this.attr("stroke",parseFloat(e)>0?this._stroke:null):"stroke"==t&&(this._stroke=e),SVG.Color.test(e)||SVG.Color.isRgb(e)?e=new SVG.Color(e):"number"==typeof e?e=new SVG.Number(e):Array.isArray(e)&&(e=new SVG.Array(e)),null!=i?this.node.setAttributeNS(i,t,e.toString()):this.node.setAttribute(t,e.toString()),this._isStyle(t)&&("text"==t?this.text(e):"leading"==t&&this.leading?this.leading(e):this.style(t,e),this.rebuild&&this.rebuild(t,e))}return this},transform:function(t,e){if(0==arguments.length)return this.trans;if("string"==typeof t){if(2>arguments.length)return this.trans[t];var i={};return i[t]=e,this.transform(i)}var i=[];t=this._parseMatrix(t);for(e in t)null!=t[e]&&(this.trans[e]=t[e]);return this.trans.matrix=this.trans.a+" "+this.trans.b+" "+this.trans.c+" "+this.trans.d+" "+this.trans.e+" "+this.trans.f,t=this.trans,t.matrix!=SVG.defaults.matrix&&i.push("matrix("+t.matrix+")"),0!=t.rotation&&i.push("rotate("+t.rotation+" "+(null==t.cx?this.bbox().cx:t.cx)+" "+(null==t.cy?this.bbox().cy:t.cy)+")"),(1!=t.scaleX||1!=t.scaleY)&&i.push("scale("+t.scaleX+" "+t.scaleY+")"),0!=t.skewX&&i.push("skewX("+t.skewX+")"),0!=t.skewY&&i.push("skewY("+t.skewY+")"),(0!=t.x||0!=t.y)&&i.push("translate("+new SVG.Number(t.x/t.scaleX)+" "+new SVG.Number(t.y/t.scaleY)+")"),this._offset&&0!=this._offset.x&&0!=this._offset.y&&i.push("translate("+-this._offset.x+" "+-this._offset.y+")"),0==i.length?this.node.removeAttribute("transform"):this.node.setAttribute("transform",i.join(" ")),this},style:function(t,e){if(0==arguments.length)return this.attr("style")||"";if(2>arguments.length)if("object"==typeof t)for(e in t)this.style(e,t[e]);else{if(!SVG.regex.isCss.test(t))return this.styles[t];t=t.split(";");for(var i=0;t.length>i;i++)e=t[i].split(":"),2==e.length&&this.style(e[0].replace(/\s+/g,""),e[1].replace(/^\s+/,"").replace(/\s+$/,""))}else null===e||SVG.regex.test(e,"isBlank")?delete this.styles[t]:this.styles[t]=e;t="";for(e in this.styles)t+=e+":"+this.styles[e]+";";return""==t?this.node.removeAttribute("style"):this.node.setAttribute("style",t),this},data:function(t,e,i){if(2>arguments.length)try{return JSON.parse(this.attr("data-"+t))}catch(n){return this.attr("data-"+t)}else this.attr("data-"+t,null===e?null:i===!0||"string"==typeof e||"number"==typeof e?e:JSON.stringify(e));return this},bbox:function(){return new SVG.BBox(this)},rbox:function(){return new SVG.RBox(this)},inside:function(t,e){var i=this.bbox();return t>i.x&&e>i.y&&i.x+i.width>t&&i.y+i.height>e},show:function(){return this.style("display","")},hide:function(){return this.style("display","none")},visible:function(){return"none"!=this.style("display")},toString:function(){return this.attr("id")},_parent:function(t){for(var e=this;null!=e&&!(e instanceof t);)e=e.parent;return e},_isStyle:function(t){return"string"==typeof t?SVG.regex.test(t,"isStyle"):!1},_parseMatrix:function(t){if(t.matrix){var e=t.matrix.replace(/\s/g,"").split(",");6==e.length&&(t.a=parseFloat(e[0]),t.b=parseFloat(e[1]),t.c=parseFloat(e[2]),t.d=parseFloat(e[3]),t.e=parseFloat(e[4]),t.f=parseFloat(e[5]))}return t}}),SVG.Parent=function(t){this.constructor.call(this,t)},SVG.Parent.prototype=new SVG.Element,SVG.extend(SVG.Parent,{children:function(){return this._children||(this._children=[])},add:function(t,e){if(!this.has(t)){if(e=null==e?this.children().length:e,t.parent){var i=t.parent.children().indexOf(t);t.parent.children().splice(i,1)}this.children().splice(e,0,t),this.node.insertBefore(t.node,this.node.childNodes[e]||null),t.parent=this}return this._defs&&(this.node.removeChild(this._defs.node),this.node.appendChild(this._defs.node)),this},put:function(t,e){return this.add(t,e),t},has:function(t){return this.children().indexOf(t)>=0},get:function(t){return this.children()[t]},first:function(){return this.children()[0]},last:function(){return this.children()[this.children().length-1]},each:function(t,e){var i,n,r=this.children();for(i=0,n=r.length;n>i;i++)r[i]instanceof SVG.Element&&t.apply(r[i],[i,r]),e&&r[i]instanceof SVG.Container&&r[i].each(t,e);return this},removeElement:function(t){var e=this.children().indexOf(t);return this.children().splice(e,1),this.node.removeChild(t.node),t.parent=null,this},clear:function(){for(var t=this.children().length-1;t>=0;t--)this.removeElement(this.children()[t]);return this._defs&&this._defs.clear(),this},defs:function(){return this.doc().defs()}}),SVG.Container=function(t){this.constructor.call(this,t)},SVG.Container.prototype=new SVG.Parent,SVG.extend(SVG.Container,{viewbox:function(t){return 0==arguments.length?new SVG.ViewBox(this):(t=1==arguments.length?[t.x,t.y,t.width,t.height]:[].slice.call(arguments),this.attr("viewBox",t))}}),SVG.FX=function(t){this.target=t},SVG.extend(SVG.FX,{animate:function(t,e,i){var n,r,s,h,o=this.target,a=this;return"object"==typeof t&&(i=t.delay,e=t.ease,t=t.duration),t=null==t?1e3:t,e=e||"<>",a.to=function(t){var i;if(t=0>t?0:t>1?1:t,null==n){n=[];for(h in a.attrs)n.push(h);if(o.morphArray){var u,l=new o.morphArray(a._plot||o.points.toString());a._size&&l.size(a._size.width.to,a._size.height.to),u=l.bbox(),a._x?l.move(a._x.to,u.y):a._cx&&l.move(a._cx.to-u.width/2,u.y),u=l.bbox(),a._y?l.move(u.x,a._y.to):a._cy&&l.move(u.x,a._cy.to-u.height/2),delete a._x,delete a._y,delete a._cx,delete a._cy,delete a._size,a._plot=o.points.morph(l)}}if(null==r){r=[];for(h in a.trans)r.push(h)}if(null==s){s=[];for(h in a.styles)s.push(h)}for(t="<>"==e?-Math.cos(t*Math.PI)/2+.5:">"==e?Math.sin(t*Math.PI/2):"<"==e?-Math.cos(t*Math.PI/2)+1:"-"==e?t:"function"==typeof e?e(t):t,a._x?o.x(a._at(a._x,t)):a._cx&&o.cx(a._at(a._cx,t)),a._y?o.y(a._at(a._y,t)):a._cy&&o.cy(a._at(a._cy,t)),a._size&&o.size(a._at(a._size.width,t),a._at(a._size.height,t)),a._plot&&o.plot(a._plot.at(t)),a._viewbox&&o.viewbox(a._at(a._viewbox.x,t),a._at(a._viewbox.y,t),a._at(a._viewbox.width,t),a._at(a._viewbox.height,t)),i=n.length-1;i>=0;i--)o.attr(n[i],a._at(a.attrs[n[i]],t));for(i=r.length-1;i>=0;i--)o.transform(r[i],a._at(a.trans[r[i]],t));for(i=s.length-1;i>=0;i--)o.style(s[i],a._at(a.styles[s[i]],t));a._during&&a._during.call(o,t,function(e,i){return a._at({from:e,to:i},t)})},"number"==typeof t&&(this.timeout=setTimeout(function(){var e=1e3/60,i=(new Date).getTime(),n=i+t;a.interval=setInterval(function(){var e=(new Date).getTime(),r=e>n?1:(e-i)/t;a.to(r),e>n&&(a._plot&&o.plot(new SVG.PointArray(a._plot.destination).settle()),clearInterval(a.interval),a._after?a._after.apply(o,[a]):a.stop())},t>e?e:t)},i||0)),this},bbox:function(){return this.target.bbox()},attr:function(t,e){if("object"==typeof t)for(var i in t)this.attr(i,t[i]);else this.attrs[t]={from:this.target.attr(t),to:e};return this},transform:function(t,e){if(1==arguments.length){t=this.target._parseMatrix(t),delete t.matrix;for(e in t)this.trans[e]={from:this.target.trans[e],to:t[e]}}else{var i={};i[t]=e,this.transform(i)}return this},style:function(t,e){if("object"==typeof t)for(var i in t)this.style(i,t[i]);else this.styles[t]={from:this.target.style(t),to:e};return this},x:function(t){return this._x={from:this.target.x(),to:t},this},y:function(t){return this._y={from:this.target.y(),to:t},this},cx:function(t){return this._cx={from:this.target.cx(),to:t},this},cy:function(t){return this._cy={from:this.target.cy(),to:t},this},move:function(t,e){return this.x(t).y(e)},center:function(t,e){return this.cx(t).cy(e)},size:function(t,e){if(this.target instanceof SVG.Text)this.attr("font-size",t);else{var i=this.target.bbox();this._size={width:{from:i.width,to:t},height:{from:i.height,to:e}}}return this},plot:function(t){return this._plot=t,this},viewbox:function(t,e,i,n){if(this.target instanceof SVG.Container){var r=this.target.viewbox();this._viewbox={x:{from:r.x,to:t},y:{from:r.y,to:e},width:{from:r.width,to:i},height:{from:r.height,to:n}}}return this},update:function(t){return this.target instanceof SVG.Stop&&(null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new SVG.Number(t.offset))),this},during:function(t){return this._during=t,this},after:function(t){return this._after=t,this},stop:function(){return clearTimeout(this.timeout),clearInterval(this.interval),this.attrs={},this.trans={},this.styles={},delete this._x,delete this._y,delete this._cx,delete this._cy,delete this._size,delete this._plot,delete this._after,delete this._during,delete this._viewbox,this},_at:function(t,e){return"number"==typeof t.from?t.from+(t.to-t.from)*e:SVG.regex.unit.test(t.to)?new SVG.Number(t.to).minus(new SVG.Number(t.from)).times(e).plus(new SVG.Number(t.from)):t.to&&(t.to.r||SVG.Color.test(t.to))?this._color(t,e):1>e?t.from:t.to},_color:function(t,e){var i,n;return e=0>e?0:e>1?1:e,i=new SVG.Color(t.from),n=new SVG.Color(t.to),new SVG.Color({r:~~(i.r+(n.r-i.r)*e),g:~~(i.g+(n.g-i.g)*e),b:~~(i.b+(n.b-i.b)*e)}).toHex()}}),SVG.extend(SVG.Element,{animate:function(t,e,i){return(this.fx||(this.fx=new SVG.FX(this))).stop().animate(t,e,i)},stop:function(){return this.fx&&this.fx.stop(),this}}),["click","dblclick","mousedown","mouseup","mouseover","mouseout","mousemove","mouseenter","mouseleave"].forEach(function(t){SVG.Element.prototype[t]=function(e){var i=this;return this.node["on"+t]="function"==typeof e?function(){return e.apply(i,arguments)}:null,this}}),SVG.on=function(t,e,i){t.addEventListener?t.addEventListener(e,i,!1):t.attachEvent("on"+e,i)},SVG.off=function(t,e,i){t.removeEventListener?t.removeEventListener(e,i,!1):t.detachEvent("on"+e,i)},SVG.extend(SVG.Element,{on:function(t,e){return SVG.on(this.node,t,e),this},off:function(t,e){return SVG.off(this.node,t,e),this}}),SVG.Defs=function(){this.constructor.call(this,SVG.create("defs"))},SVG.Defs.prototype=new SVG.Container,SVG.G=function(){this.constructor.call(this,SVG.create("g"))},SVG.G.prototype=new SVG.Container,SVG.extend(SVG.G,{x:function(t){return null==t?this.trans.x:this.transform("x",t)},y:function(t){return null==t?this.trans.y:this.transform("y",t)}}),SVG.extend(SVG.Container,{group:function(){return this.put(new SVG.G)}}),SVG.extend(SVG.Element,{siblings:function(){return this.parent.children()},position:function(){var t=this.siblings();return t.indexOf(this)},next:function(){return this.siblings()[this.position()+1]},previous:function(){return this.siblings()[this.position()-1]},forward:function(){var t=this.position();return this.parent.removeElement(this).put(this,t+1)},backward:function(){var t=this.position();return t>0&&this.parent.removeElement(this).add(this,t-1),this},front:function(){return this.parent.removeElement(this).put(this)},back:function(){return this.position()>0&&this.parent.removeElement(this).add(this,0),this},before:function(t){t.remove();var e=this.position();return this.parent.add(t,e),this},after:function(t){t.remove();var e=this.position();return this.parent.add(t,e+1),this}}),SVG.Mask=function(){this.constructor.call(this,SVG.create("mask")),this.targets=[]},SVG.Mask.prototype=new SVG.Container,SVG.extend(SVG.Mask,{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unmask();return delete this.targets,this.parent.removeElement(this),this}}),SVG.extend(SVG.Element,{maskWith:function(t){return this.masker=t instanceof SVG.Mask?t:this.parent.mask().add(t),this.masker.targets.push(this),this.attr("mask",'url("#'+this.masker.attr("id")+'")')},unmask:function(){return delete this.masker,this.attr("mask",null)}}),SVG.extend(SVG.Container,{mask:function(){return this.defs().put(new SVG.Mask)}}),SVG.Clip=function(){this.constructor.call(this,SVG.create("clipPath")),this.targets=[]},SVG.Clip.prototype=new SVG.Container,SVG.extend(SVG.Clip,{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unclip();return delete this.targets,this.parent.removeElement(this),this}}),SVG.extend(SVG.Element,{clipWith:function(t){return this.clipper=t instanceof SVG.Clip?t:this.parent.clip().add(t),this.clipper.targets.push(this),this.attr("clip-path",'url("#'+this.clipper.attr("id")+'")')},unclip:function(){return delete this.clipper,this.attr("clip-path",null)}}),SVG.extend(SVG.Container,{clip:function(){return this.defs().put(new SVG.Clip)}}),SVG.Gradient=function(t){this.constructor.call(this,SVG.create(t+"Gradient")),this.type=t},SVG.Gradient.prototype=new SVG.Container,SVG.extend(SVG.Gradient,{from:function(t,e){return"radial"==this.type?this.attr({fx:new SVG.Number(t),fy:new SVG.Number(e)}):this.attr({x1:new SVG.Number(t),y1:new SVG.Number(e)})},to:function(t,e){return"radial"==this.type?this.attr({cx:new SVG.Number(t),cy:new SVG.Number(e)}):this.attr({x2:new SVG.Number(t),y2:new SVG.Number(e)})},radius:function(t){return"radial"==this.type?this.attr({r:new SVG.Number(t)}):this},at:function(t){return this.put(new SVG.Stop(t))},update:function(t){return this.clear(),t(this),this},fill:function(){return"url(#"+this.attr("id")+")"},toString:function(){return this.fill()}}),SVG.extend(SVG.Defs,{gradient:function(t,e){var i=this.put(new SVG.Gradient(t));return e(i),i}}),SVG.extend(SVG.Container,{gradient:function(t,e){return this.defs().gradient(t,e)}}),SVG.Stop=function(t){this.constructor.call(this,SVG.create("stop")),this.update(t)},SVG.Stop.prototype=new SVG.Element,SVG.extend(SVG.Stop,{update:function(t){return null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",new SVG.Number(t.offset)),this}}),SVG.Doc=function(t){this.parent="string"==typeof t?document.getElementById(t):t,this.constructor.call(this,"svg"==this.parent.nodeName?this.parent:SVG.create("svg")),this.attr({xmlns:SVG.ns,version:"1.1",width:"100%",height:"100%"}).attr("xlink",SVG.xlink,SVG.ns),this._defs=new SVG.Defs,this._defs.parent=this,this.node.appendChild(this._defs.node),this.doSubPixelOffsetFix=!1,"svg"!=this.parent.nodeName&&this.stage()},SVG.Doc.prototype=new SVG.Container,SVG.extend(SVG.Doc,{stage:function(){var t,e=this,i=document.createElement("div");return i.style.cssText="position:relative;height:100%;",e.parent.appendChild(i),i.appendChild(e.node),t=function(){"complete"===document.readyState?(e.style("position:absolute;"),setTimeout(function(){e.style("position:relative;overflow:hidden;"),e.parent.removeChild(e.node.parentNode),e.node.parentNode.removeChild(e.node),e.parent.appendChild(e.node),e.subPixelOffsetFix(),SVG.on(window,"resize",function(){e.subPixelOffsetFix()})},5)):setTimeout(t,10)},t(),this},defs:function(){return this._defs},subPixelOffsetFix:function(){if(this.doSubPixelOffsetFix){var t=this.node.getScreenCTM();t&&this.style("left",-t.e%1+"px").style("top",-t.f%1+"px")}return this},fixSubPixelOffset:function(){return this.doSubPixelOffsetFix=!0,this}}),SVG.Shape=function(t){this.constructor.call(this,t)},SVG.Shape.prototype=new SVG.Element,SVG.Use=function(){this.constructor.call(this,SVG.create("use"))},SVG.Use.prototype=new SVG.Shape,SVG.extend(SVG.Use,{element:function(t){return this.target=t,this.attr("href","#"+t,SVG.xlink)}}),SVG.extend(SVG.Container,{use:function(t){return this.put(new SVG.Use).element(t)}}),SVG.Rect=function(){this.constructor.call(this,SVG.create("rect"))},SVG.Rect.prototype=new SVG.Shape,SVG.extend(SVG.Container,{rect:function(t,e){return this.put((new SVG.Rect).size(t,e))}}),SVG.Ellipse=function(){this.constructor.call(this,SVG.create("ellipse"))},SVG.Ellipse.prototype=new SVG.Shape,SVG.extend(SVG.Ellipse,{x:function(t){return null==t?this.cx()-this.attr("rx"):this.cx(t+this.attr("rx"))},y:function(t){return null==t?this.cy()-this.attr("ry"):this.cy(t+this.attr("ry"))},cx:function(t){return null==t?this.attr("cx"):this.attr("cx",new SVG.Number(t).divide(this.trans.scaleX))},cy:function(t){return null==t?this.attr("cy"):this.attr("cy",new SVG.Number(t).divide(this.trans.scaleY))},width:function(t){return null==t?2*this.attr("rx"):this.attr("rx",new SVG.Number(t).divide(2))},height:function(t){return null==t?2*this.attr("ry"):this.attr("ry",new SVG.Number(t).divide(2))},size:function(t,e){return this.attr({rx:new SVG.Number(t).divide(2),ry:new SVG.Number(e).divide(2)})}}),SVG.extend(SVG.Container,{circle:function(t){return this.ellipse(t,t)},ellipse:function(t,e){return this.put(new SVG.Ellipse).size(t,e).move(0,0)}}),SVG.Line=function(){this.constructor.call(this,SVG.create("line"))},SVG.Line.prototype=new SVG.Shape,SVG.extend(SVG.Line,{x:function(t){var e=this.bbox();return null==t?e.x:this.attr({x1:this.attr("x1")-e.x+t,x2:this.attr("x2")-e.x+t})},y:function(t){var e=this.bbox();return null==t?e.y:this.attr({y1:this.attr("y1")-e.y+t,y2:this.attr("y2")-e.y+t})},cx:function(t){var e=this.bbox().width/2;return null==t?this.x()+e:this.x(t-e)},cy:function(t){var e=this.bbox().height/2;return null==t?this.y()+e:this.y(t-e)},width:function(t){var e=this.bbox();return null==t?e.width:this.attr(this.attr("x1")<this.attr("x2")?"x2":"x1",e.x+t)},height:function(t){var e=this.bbox();return null==t?e.height:this.attr(this.attr("y1")<this.attr("y2")?"y2":"y1",e.y+t)},size:function(t,e){return this.width(t).height(e)},plot:function(t,e,i,n){return this.attr({x1:t,y1:e,x2:i,y2:n})}}),SVG.extend(SVG.Container,{line:function(t,e,i,n){return this.put((new SVG.Line).plot(t,e,i,n))}}),SVG.Polyline=function(){this.constructor.call(this,SVG.create("polyline"))},SVG.Polyline.prototype=new SVG.Shape,SVG.Polygon=function(){this.constructor.call(this,SVG.create("polygon"))},SVG.Polygon.prototype=new SVG.Shape,SVG.extend(SVG.Polyline,SVG.Polygon,{morphArray:SVG.PointArray,plot:function(t){return this.attr("points",this.points=new SVG.PointArray(t,[[0,0]]))},move:function(t,e){return this.attr("points",this.points.move(t,e))},x:function(t){return null==t?this.bbox().x:this.move(t,this.bbox().y)},y:function(t){return null==t?this.bbox().y:this.move(this.bbox().x,t)},width:function(t){var e=this.bbox();return null==t?e.width:this.size(t,e.height)},height:function(t){var e=this.bbox();return null==t?e.height:this.size(e.width,t)},size:function(t,e){return this.attr("points",this.points.size(t,e))}}),SVG.extend(SVG.Container,{polyline:function(t){return this.put(new SVG.Polyline).plot(t)},polygon:function(t){return this.put(new SVG.Polygon).plot(t)}}),SVG.Path=function(t){this.constructor.call(this,SVG.create("path")),this.unbiased=!!t},SVG.Path.prototype=new SVG.Shape,SVG.extend(SVG.Path,{x:function(t){return null==t?this.bbox().x:this.transform("x",t)},y:function(t){return null==t?this.bbox().y:this.transform("y",t)},width:function(t){var e=this.bbox();return null==t?e.width:this.size(t,e.height)},height:function(t){var e=this.bbox();return null==t?e.height:this.size(e.width,t)},size:function(t,e){var i=t/this._offset.width;return this.transform({scaleX:i,scaleY:null!=e?e/this._offset.height:i})},plot:function(t){var e=this.trans.scaleX,i=this.trans.scaleY;return this._plot(t),this._offset=this.transform({scaleX:1,scaleY:1}).bbox(),this.unbiased?this._offset.x=this._offset.y=0:(this._offset.x-=this.trans.x,this._offset.y-=this.trans.y),this.transform({scaleX:e,scaleY:i})},_plot:function(t){return this.attr("d",t||"M0,0")}}),SVG.extend(SVG.Container,{path:function(t,e){return this.put(new SVG.Path(e)).plot(t)}}),SVG.Image=function(){this.constructor.call(this,SVG.create("image"))},SVG.Image.prototype=new SVG.Shape,SVG.extend(SVG.Image,{load:function(t){return t?this.attr("href",this.src=t,SVG.xlink):this}}),SVG.extend(SVG.Container,{image:function(t,e,i){return e=null!=e?e:100,this.put((new SVG.Image).load(t).size(e,null!=i?i:e))}});var t="size family weight stretch variant style".split(" ");SVG.Text=function(){this.constructor.call(this,SVG.create("text")),this.styles={"font-size":16,"font-family":"Helvetica, Arial, sans-serif","text-anchor":"start"},this._leading=new SVG.Number("1.2em"),this._rebuild=!0},SVG.Text.prototype=new SVG.Shape,SVG.extend(SVG.Text,{x:function(t,e){return null==t?e?this.attr("x"):this.bbox().x:(e||(e=this.style("text-anchor"),t="start"==e?t:"end"==e?t+this.bbox().width:t+this.bbox().width/2),this.textPath||this.lines.each(function(){this.newLined&&this.x(t)}),this.attr("x",t))},cx:function(t){return null==t?this.bbox().cx:this.x(t-this.bbox().width/2)},cy:function(t,e){return null==t?this.bbox().cy:this.y(e?t:t-this.bbox().height/2)},move:function(t,e,i){return this.x(t,i).y(e)},center:function(t,e,i){return this.cx(t,i).cy(e,i)},text:function(t){if(null==t)return this.content;if(this.clear(),"function"==typeof t)this._rebuild=!1,t(this);else{this._rebuild=!0,t=SVG.regex.isBlank.test(t)?"text":t;var e,i,n=t.split("\n");for(e=0,i=n.length;i>e;e++)this.tspan(n[e]).newLine();this.rebuild()}return this},tspan:function(t){var e=this.textPath?this.textPath.node:this.node,i=(new SVG.TSpan).text(t),n=this.style();return e.appendChild(i.node),this.lines.add(i),SVG.regex.isBlank.test(n)||i.style(n),this.content+=t,i.parent=this,i},size:function(t){return this.attr("font-size",t)},leading:function(t){return null==t?this._leading:(t=new SVG.Number(t),this._leading=t,this.lines.each(function(){this.newLined&&this.attr("dy",t)}),this)},rebuild:function(){return this._rebuild&&this.lines.attr({x:this.attr("x"),dy:this._leading,style:this.style()}),this},clear:function(){for(var t=this.textPath?this.textPath.node:this.node;t.hasChildNodes();)t.removeChild(t.lastChild);return delete this.lines,this.lines=new SVG.Set,this.content="",this}}),SVG.extend(SVG.Container,{text:function(t){return this.put(new SVG.Text).text(t)}}),SVG.TSpan=function(){this.constructor.call(this,SVG.create("tspan"))},SVG.TSpan.prototype=new SVG.Shape,SVG.extend(SVG.TSpan,{text:function(t){return this.node.appendChild(document.createTextNode(t)),this},dx:function(t){return this.attr("dx",t)},dy:function(t){return this.attr("dy",t)},newLine:function(){return this.newLined=!0,this.parent.content+="\n",this.dy(this.parent._leading),this.attr("x",this.parent.x())}}),SVG.TextPath=function(){this.constructor.call(this,SVG.create("textPath"))},SVG.TextPath.prototype=new SVG.Element,SVG.extend(SVG.Text,{path:function(t){for(this.textPath=new SVG.TextPath;this.node.hasChildNodes();)this.textPath.node.appendChild(this.node.firstChild);return this.node.appendChild(this.textPath.node),this.track=this.doc().defs().path(t,!0),this.textPath.parent=this,this.textPath.attr("href","#"+this.track,SVG.xlink),this},plot:function(t){return this.track&&this.track.plot(t),this}}),SVG.Nested=function(){this.constructor.call(this,SVG.create("svg")),this.style("overflow","visible")},SVG.Nested.prototype=new SVG.Container,SVG.extend(SVG.Container,{nested:function(){return this.put(new SVG.Nested)}}),SVG._stroke=["color","width","opacity","linecap","linejoin","miterlimit","dasharray","dashoffset"],SVG._fill=["color","opacity","rule"];var e=function(t,e){return"color"==e?t:t+"-"+e};["fill","stroke"].forEach(function(t){var i={};i[t]=function(i){if("string"==typeof i||SVG.Color.isRgb(i)||i&&"function"==typeof i.fill)this.attr(t,i); +else for(index=SVG["_"+t].length-1;index>=0;index--)null!=i[SVG["_"+t][index]]&&this.attr(e(t,SVG["_"+t][index]),i[SVG["_"+t][index]]);return this},SVG.extend(SVG.Element,SVG.FX,i)}),SVG.extend(SVG.Element,SVG.FX,{rotate:function(t,e,i){return this.transform({rotation:t||0,cx:e,cy:i})},skew:function(t,e){return this.transform({skewX:t||0,skewY:e||0})},scale:function(t,e){return this.transform({scaleX:t,scaleY:null==e?t:e})},translate:function(t,e){return this.transform({x:t,y:e})},matrix:function(t){return this.transform({matrix:t})},opacity:function(t){return this.attr("opacity",t)}}),SVG.extend(SVG.Rect,SVG.Ellipse,{radius:function(t,e){return this.attr({rx:t,ry:e||t})}}),SVG.Text&&SVG.extend(SVG.Text,SVG.FX,{font:function(e){for(var i in e)"anchor"==i?this.attr("text-anchor",e[i]):t.indexOf(i)>-1?this.attr("font-"+i,e[i]):this.attr(i,e[i]);return this}}),SVG.Set=function(){this.clear()},SVG.SetFX=function(t){this.set=t},SVG.extend(SVG.Set,{add:function(){var t,e,i=[].slice.call(arguments);for(t=0,e=i.length;e>t;t++)this.members.push(i[t]);return this},remove:function(t){var e=this.members.indexOf(t);return e>-1&&this.members.splice(e,1),this},each:function(t){for(var e=0,i=this.members.length;i>e;e++)t.apply(this.members[e],[e,this.members]);return this},clear:function(){return this.members=[],this},valueOf:function(){return this.members}}),SVG.Set.inherit=function(){var t,e=[];for(var t in SVG.Shape.prototype)"function"==typeof SVG.Shape.prototype[t]&&"function"!=typeof SVG.Set.prototype[t]&&e.push(t);e.forEach(function(t){SVG.Set.prototype[t]=function(){for(var e=0,i=this.members.length;i>e;e++)this.members[e]&&"function"==typeof this.members[e][t]&&this.members[e][t].apply(this.members[e],arguments);return"animate"==t?this.fx||(this.fx=new SVG.SetFX(this)):this}}),e=[];for(var t in SVG.FX.prototype)"function"==typeof SVG.FX.prototype[t]&&"function"!=typeof SVG.SetFX.prototype[t]&&e.push(t);e.forEach(function(t){SVG.SetFX.prototype[t]=function(){for(var e=0,i=this.set.members.length;i>e;e++)this.set.members[e].fx[t].apply(this.set.members[e].fx,arguments);return this}})},SVG.extend(SVG.Container,{set:function(){return new SVG.Set}}),SVG.extend(SVG.Element,{remember:function(t,e){if("object"==typeof arguments[0])for(var e in t)this.remember(e,t[e]);else{if(1==arguments.length)return this.memory()[t];this.memory()[t]=e}return this},forget:function(){if(0==arguments.length)this._memory={};else for(var t=arguments.length-1;t>=0;t--)delete this.memory()[arguments[t]];return this},memory:function(){return this._memory||(this._memory={})}}),"function"==typeof define&&define.amd?define(function(){return SVG}):"undefined"!=typeof exports&&(exports.SVG=SVG)}).call(this);
\ No newline at end of file diff --git a/spec/spec/container.js b/spec/spec/container.js index 4aaa68a..47a871e 100644 --- a/spec/spec/container.js +++ b/spec/spec/container.js @@ -262,8 +262,8 @@ describe('Container', function() { expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50') }) it('should accept negative values', function() { - draw.size(100,100).viewbox(-100,-100,-50,-50) - expect(draw.node.getAttribute('viewBox')).toEqual('-100 -100 -50 -50') + draw.size(100,100).viewbox(-100,-100,50,50) + expect(draw.node.getAttribute('viewBox')).toEqual('-100 -100 50 50') }) it('should get the viewbox if no arguments are given', function() { draw.viewbox(0,0,100,100) diff --git a/spec/spec/doc.js b/spec/spec/doc.js index 1d5eaa5..4312678 100644 --- a/spec/spec/doc.js +++ b/spec/spec/doc.js @@ -1,11 +1,20 @@ describe('Doc', function() { - it('should be an instance of SVG.Container', function() { + it('is an instance of SVG.Container', function() { expect(draw instanceof SVG.Container).toBe(true) }) - it('should have a defs element', function() { - expect(draw instanceof SVG.Container).toBe(true) + it('has a defs element', function() { + expect(draw._defs instanceof SVG.Defs).toBe(true) + }) + + describe('defs()', function() { + it('returns defs element', function(){ + expect(draw.defs()).toBe(draw._defs) + }) + it('references parent node', function(){ + expect(draw.defs().parent).toBe(draw) + }) }) })
\ No newline at end of file diff --git a/spec/spec/element.js b/spec/spec/element.js index cbe4088..acb5de5 100644 --- a/spec/spec/element.js +++ b/spec/spec/element.js @@ -203,7 +203,7 @@ describe('Element', function() { var box = rect.rbox() expect(approximately(box.x)).toBe(approximately(2)) expect(approximately(box.y)).toBe(approximately(12)) - expect(approximately(box.cx)).toBe(approximately(54).5) + expect(approximately(box.cx)).toBe(approximately(54.5)) expect(approximately(box.cy)).toBe(approximately(117)) expect(approximately(box.width)).toBe(approximately(105)) expect(approximately(box.height)).toBe(approximately(210)) @@ -258,6 +258,31 @@ describe('Element', function() { expect(rect + '').toBe(rect.attr('id')) }) }) + + describe('replace()', function() { + it('replaces the original element by another given element', function() { + var rect = draw.rect(100,100).center(321,567).fill('#f06') + var circle = draw.circle(200) + var rectIndex = draw.children().indexOf(rect) + + rect.replace(circle) + + expect(rectIndex).toBe(draw.children().indexOf(circle)) + }) + it('removes the original element', function() { + var rect = draw.rect(100,100).center(321,567).fill('#f06') + + rect.replace(draw.circle(200)) + + expect(draw.has(rect)).toBe(false) + }) + it('returns the new element', function() { + var circle = draw.circle(200) + var element = draw.rect(100,100).center(321,567).fill('#f06').replace(circle) + + expect(element).toBe(circle) + }) + }) }) diff --git a/spec/spec/ellipse.js b/spec/spec/ellipse.js index 507ec7a..27d1840 100644 --- a/spec/spec/ellipse.js +++ b/spec/spec/ellipse.js @@ -52,6 +52,19 @@ describe('Ellipse', function() { expect(box.cy).toBe(345) }) }) + + describe('radius()', function() { + it('should set the rx and ry', function() { + ellipse.radius(10,20) + expect(ellipse.node.getAttribute('rx')).toBe('10') + expect(ellipse.node.getAttribute('ry')).toBe('20') + }) + it('should set the rx and ry if only rx given', function() { + ellipse.radius(30) + expect(ellipse.node.getAttribute('rx')).toBe('30') + expect(ellipse.node.getAttribute('ry')).toBe('30') + }) + }) describe('move()', function() { it('should set the x and y position', function() { @@ -70,6 +83,26 @@ describe('Ellipse', function() { expect(box.cy).toBe(567) }) }) + + describe('width()', function() { + it('sets the width of the element', function() { + ellipse.width(82) + expect(ellipse.node.getAttribute('rx')).toBe('41') + }) + it('gets the width of the element if the argument is null', function() { + expect((ellipse.width() / 2).toString()).toBe(ellipse.node.getAttribute('rx')) + }) + }) + + describe('height()', function() { + it('sets the height of the element', function() { + ellipse.height(1236) + expect(ellipse.node.getAttribute('ry')).toBe('618') + }) + it('gets the height of the element if the argument is null', function() { + expect((ellipse.height() / 2).toString()).toBe(ellipse.node.getAttribute('ry')) + }) + }) describe('size()', function() { it('defines the rx and ry of the element', function() { diff --git a/spec/spec/image.js b/spec/spec/image.js index dec462b..798ea08 100644 --- a/spec/spec/image.js +++ b/spec/spec/image.js @@ -69,6 +69,26 @@ describe('Image', function() { expect(box.cy).toBe(567) }) }) + + describe('width()', function() { + it('sets the width of the element', function() { + image.width(789) + expect(image.node.getAttribute('width')).toBe('789') + }) + it('gets the width of the element if the argument is null', function() { + expect(image.width().toString()).toBe(image.node.getAttribute('width')) + }) + }) + + describe('height()', function() { + it('sets the height of the element', function() { + image.height(1236) + expect(image.node.getAttribute('height')).toBe('1236') + }) + it('gets the height of the element if the argument is null', function() { + expect(image.height().toString()).toBe(image.node.getAttribute('height')) + }) + }) describe('size()', function() { it('should define the width and height of the element', function() { diff --git a/spec/spec/line.js b/spec/spec/line.js index 91874b9..1ed45fb 100644 --- a/spec/spec/line.js +++ b/spec/spec/line.js @@ -74,6 +74,34 @@ describe('Line', function() { expect(box.y).toBe(517) }) }) + + describe('width()', function() { + it('sets the width of the element', function() { + line.width(400) + var box = line.bbox() + expect(box.x).toBe(0) + expect(box.x + box.width).toBe(400) + }) + it('get the width of the element without argument', function() { + line.width(123) + var box = line.bbox() + expect(line.width()).toBe(box.width) + }) + }) + + describe('height()', function() { + it('sets the height of the element', function() { + line.height(300) + var box = line.bbox() + expect(box.y).toBe(0) + expect(box.y + box.height).toBe(300) + }) + it('gets the height of the element without argument', function() { + line.height(456) + var box = line.bbox() + expect(line.height()).toBe(box.height) + }) + }) describe('size()', function() { it('should define the width and height of the element', function() { diff --git a/spec/spec/path.js b/spec/spec/path.js index 77ef77c..a64f8aa 100644 --- a/spec/spec/path.js +++ b/spec/spec/path.js @@ -76,6 +76,30 @@ describe('Path', function() { expect(box.y).toBe(517) }) }) + + describe('width()', function() { + it('sets the width of the element', function() { + path.width(234) + var box = path.bbox() + expect(approximately(box.width, 0.1)).toBe(234) + }) + it('gets the width of the element aithout an agrument', function() { + path.width(456) + expect(approximately(path.width(), 0.1)).toBe(456) + }) + }) + + describe('height()', function() { + it('sets the height of the element', function() { + path.height(654) + var box = path.bbox() + expect(approximately(box.height, 0.1)).toBe(654) + }) + it('gets the height of the element aithout an agrument', function() { + path.height(321) + expect(approximately(path.height(), 0.1)).toBe(321) + }) + }) describe('size()', function() { it('should define the width and height of the element', function() { @@ -88,16 +112,18 @@ describe('Path', function() { describe('scale()', function() { it('should scale the element universally with one argument', function() { - var box = path.scale(2).bbox() + var box1 = path.bbox() + , box2 = path.scale(2).bbox() - expect(box.width).toBe(path._offset.width * 2) - expect(box.height).toBe(path._offset.height * 2) + expect(box1.width * 2).toBe(box2.width) + expect(box1.height * 2).toBe(box2.height) }) it('should scale the element over individual x and y axes with two arguments', function() { - var box = path.scale(2, 3.5).bbox() + var box1 = path.bbox() + , box2 = path.scale(2, 3.5).bbox() - expect(box.width).toBe(path._offset.width * 2) - expect(box.height).toBe(path._offset.height * 3.5) + expect(box1.width * 2).toBe(box2.width) + expect(box1.height * 3.5).toBe(box2.height) }) }) @@ -107,6 +133,13 @@ describe('Path', function() { expect(path.node.getAttribute('transform')).toBe('translate(12 12)') }) }) + + describe('plot()', function() { + it('falls back to a single point without an argument', function() { + path = draw.path() + expect(path.node.getAttribute('d')).toBe('M0,0') + }) + }) }) diff --git a/spec/spec/polygon.js b/spec/spec/polygon.js index f0f131f..a124796 100644 --- a/spec/spec/polygon.js +++ b/spec/spec/polygon.js @@ -70,6 +70,30 @@ describe('Polygon', function() { expect(box.y).toBe(517) }) }) + + describe('width()', function() { + it('sets the width and height of the element', function() { + polygon.width(987) + var box = polygon.bbox() + expect(approximately(box.width, 0.1)).toBe(987) + }) + it('gets the width and height of the element without an argument', function() { + polygon.width(789) + expect(approximately(polygon.width(), 0.1)).toBe(789) + }) + }) + + describe('height()', function() { + it('sets the height and height of the element', function() { + polygon.height(987) + var box = polygon.bbox() + expect(approximately(box.height, 0.1)).toBe(987) + }) + it('gets the height and height of the element without an argument', function() { + polygon.height(789) + expect(approximately(polygon.height(), 0.1)).toBe(789) + }) + }) describe('size()', function() { it('should define the width and height of the element', function() { diff --git a/spec/spec/polyline.js b/spec/spec/polyline.js index c8dcc00..9272d78 100644 --- a/spec/spec/polyline.js +++ b/spec/spec/polyline.js @@ -70,6 +70,30 @@ describe('Polyline', function() { expect(box.y).toBe(517) }) }) + + describe('width()', function() { + it('sets the width and height of the element', function() { + polyline.width(987) + var box = polyline.bbox() + expect(approximately(box.width, 0.1)).toBe(987) + }) + it('gets the width and height of the element without an argument', function() { + polyline.width(789) + expect(approximately(polyline.width(), 0.1)).toBe(789) + }) + }) + + describe('height()', function() { + it('sets the height and height of the element', function() { + polyline.height(987) + var box = polyline.bbox() + expect(approximately(box.height, 0.1)).toBe(987) + }) + it('gets the height and height of the element without an argument', function() { + polyline.height(789) + expect(approximately(polyline.height(), 0.1)).toBe(789) + }) + }) describe('size()', function() { it('should define the width and height of the element', function() { diff --git a/spec/spec/rect.js b/spec/spec/rect.js index 2ebab04..4b9ef2f 100644 --- a/spec/spec/rect.js +++ b/spec/spec/rect.js @@ -52,6 +52,19 @@ describe('Rect', function() { expect(box.cy).toBe(345) }) }) + + describe('radius()', function() { + it('should set the rx and ry', function() { + rect.radius(10,20) + expect(rect.node.getAttribute('rx')).toBe('10') + expect(rect.node.getAttribute('ry')).toBe('20') + }) + it('should set the rx and ry if only rx given', function() { + rect.radius(30) + expect(rect.node.getAttribute('rx')).toBe('30') + expect(rect.node.getAttribute('ry')).toBe('30') + }) + }) describe('move()', function() { it('should set the x and y position', function() { @@ -70,6 +83,26 @@ describe('Rect', function() { }) }) + describe('width()', function() { + it('sets the width of the element', function() { + rect.width(789) + expect(rect.node.getAttribute('width')).toBe('789') + }) + it('gets the width of the element if the argument is null', function() { + expect(rect.width().toString()).toBe(rect.node.getAttribute('width')) + }) + }) + + describe('height()', function() { + it('sets the height of the element', function() { + rect.height(1236) + expect(rect.node.getAttribute('height')).toBe('1236') + }) + it('gets the height of the element if the argument is null', function() { + expect(rect.height().toString()).toBe(rect.node.getAttribute('height')) + }) + }) + describe('size()', function() { it('should define the width and height of the element', function() { rect.size(987,654) diff --git a/src/arrange.js b/src/arrange.js index 0eb2830..0eb2830 100644..100755 --- a/src/arrange.js +++ b/src/arrange.js diff --git a/src/array.js b/src/array.js index b51d740..b51d740 100644..100755 --- a/src/array.js +++ b/src/array.js diff --git a/src/bbox.js b/src/bbox.js index 603b6c9..603b6c9 100644..100755 --- a/src/bbox.js +++ b/src/bbox.js diff --git a/src/clip.js b/src/clip.js index 54f9d37..54f9d37 100644..100755 --- a/src/clip.js +++ b/src/clip.js diff --git a/src/color.js b/src/color.js index 57a4d64..57a4d64 100644..100755 --- a/src/color.js +++ b/src/color.js diff --git a/src/container.js b/src/container.js index 60f62c4..60f62c4 100644..100755 --- a/src/container.js +++ b/src/container.js diff --git a/src/default.js b/src/default.js index e8eeecd..e8eeecd 100644..100755 --- a/src/default.js +++ b/src/default.js diff --git a/src/defs.js b/src/defs.js index 48a8f28..48a8f28 100644..100755 --- a/src/defs.js +++ b/src/defs.js diff --git a/src/doc.js b/src/doc.js index 0a60f99..462fd84 100644..100755 --- a/src/doc.js +++ b/src/doc.js @@ -19,7 +19,11 @@ SVG.Doc = function(element) { /* create the <defs> node */ this._defs = new SVG.Defs + this._defs.parent = this this.node.appendChild(this._defs.node) + + /* turno of sub pixel offset by default */ + this.doSubPixelOffsetFix = false /* ensure correct rendering */ if (this.parent.nodeName != 'svg') @@ -61,11 +65,11 @@ SVG.extend(SVG.Doc, { element.parent.appendChild(element.node) /* after wrapping is done, fix sub-pixel offset */ - element.fixSubPixelOffset() + element.subPixelOffsetFix() /* make sure sub-pixel offset is fixed every time the window is resized */ SVG.on(window, 'resize', function() { - element.fixSubPixelOffset() + element.subPixelOffsetFix() }) }, 5) @@ -86,12 +90,23 @@ SVG.extend(SVG.Doc, { // Fix for possible sub-pixel offset. See: // https://bugzilla.mozilla.org/show_bug.cgi?id=608812 +, subPixelOffsetFix: function() { + if (this.doSubPixelOffsetFix) { + var pos = this.node.getScreenCTM() + + if (pos) + this + .style('left', (-pos.e % 1) + 'px') + .style('top', (-pos.f % 1) + 'px') + } + + return this + } + , fixSubPixelOffset: function() { - var pos = this.node.getScreenCTM() - - this - .style('left', (-pos.e % 1) + 'px') - .style('top', (-pos.f % 1) + 'px') + this.doSubPixelOffsetFix = true + + return this } })
\ No newline at end of file diff --git a/src/element.js b/src/element.js index 630b4a8..dafb9b9 100644..100755 --- a/src/element.js +++ b/src/element.js @@ -53,8 +53,16 @@ SVG.extend(SVG.Element, { , center: function(x, y) { return this.cx(x).cy(y) } + // Set width of element +, width: function(width) { + return this.attr('width', width) + } + // Set height of element +, height: function(height) { + return this.attr('height', height) + } // Set element size to given width and height -, size: function(width, height) { +, size: function(width, height) { return this.attr({ width: new SVG.Number(width) , height: new SVG.Number(height) @@ -100,6 +108,12 @@ SVG.extend(SVG.Element, { return this } + // Replace element +, replace: function(element) { + this.after(element).remove() + + return element + } // Get parent document , doc: function(type) { return this._parent(type || SVG.Doc) diff --git a/src/ellipse.js b/src/ellipse.js index ea019e0..86186c9 100644..100755 --- a/src/ellipse.js +++ b/src/ellipse.js @@ -24,6 +24,14 @@ SVG.extend(SVG.Ellipse, { , cy: function(y) { return y == null ? this.attr('cy') : this.attr('cy', new SVG.Number(y).divide(this.trans.scaleY)) } + // Set width of element +, width: function(width) { + return width == null ? this.attr('rx') * 2 : this.attr('rx', new SVG.Number(width).divide(2)) + } + // Set height of element +, height: function(height) { + return height == null ? this.attr('ry') * 2 : this.attr('ry', new SVG.Number(height).divide(2)) + } // Custom size function , size: function(width, height) { return this.attr({ diff --git a/src/event.js b/src/event.js index 2fc14bb..2fc14bb 100644..100755 --- a/src/event.js +++ b/src/event.js diff --git a/src/fx.js b/src/fx.js index fdcfa0f..fdcfa0f 100644..100755 --- a/src/fx.js +++ b/src/fx.js diff --git a/src/gradient.js b/src/gradient.js index c5c51d1..c5c51d1 100644..100755 --- a/src/gradient.js +++ b/src/gradient.js diff --git a/src/group.js b/src/group.js index 84eed54..84eed54 100644..100755 --- a/src/group.js +++ b/src/group.js diff --git a/src/image.js b/src/image.js index d0a1b40..d0a1b40 100644..100755 --- a/src/image.js +++ b/src/image.js diff --git a/src/line.js b/src/line.js index 2c9034e..a5a9b09 100644..100755 --- a/src/line.js +++ b/src/line.js @@ -35,13 +35,21 @@ SVG.extend(SVG.Line, { var half = this.bbox().height / 2 return y == null ? this.y() + half : this.y(y - half) } + // Set width of element +, width: function(width) { + var b = this.bbox() + + return width == null ? b.width : this.attr(this.attr('x1') < this.attr('x2') ? 'x2' : 'x1', b.x + width) + } + // Set height of element +, height: function(height) { + var b = this.bbox() + + return height == null ? b.height : this.attr(this.attr('y1') < this.attr('y2') ? 'y2' : 'y1', b.y + height) + } // Set line size by width and height , size: function(width, height) { - var b = this.bbox() - - return this - .attr(this.attr('x1') < this.attr('x2') ? 'x2' : 'x1', b.x + width) - .attr(this.attr('y1') < this.attr('y2') ? 'y2' : 'y1', b.y + height) + return this.width(width).height(height) } // Set path data , plot: function(x1, y1, x2, y2) { diff --git a/src/loader.js b/src/loader.js index 80644d8..80644d8 100644..100755 --- a/src/loader.js +++ b/src/loader.js diff --git a/src/mask.js b/src/mask.js index 2aa53d7..2aa53d7 100644..100755 --- a/src/mask.js +++ b/src/mask.js diff --git a/src/memory.js b/src/memory.js index 9b6f308..9b6f308 100644..100755 --- a/src/memory.js +++ b/src/memory.js diff --git a/src/nested.js b/src/nested.js index d42abf9..d42abf9 100644..100755 --- a/src/nested.js +++ b/src/nested.js diff --git a/src/number.js b/src/number.js index 2b3b147..2b3b147 100644..100755 --- a/src/number.js +++ b/src/number.js diff --git a/src/parent.js b/src/parent.js index 8b11f5f..8b11f5f 100644..100755 --- a/src/parent.js +++ b/src/parent.js diff --git a/src/path.js b/src/path.js index 3a50703..e9f4735 100644..100755 --- a/src/path.js +++ b/src/path.js @@ -8,8 +8,58 @@ SVG.Path = function(unbiased) { SVG.Path.prototype = new SVG.Shape SVG.extend(SVG.Path, { + // Move over x-axis + x: function(x) { + return x == null ? this.bbox().x : this.transform('x', x) + } + // Move over y-axis +, y: function(y) { + return y == null ? this.bbox().y : this.transform('y', y) + } + // Set width of element +, width: function(width) { + var b = this.bbox() + + return width == null ? b.width : this.size(width, b.height) + } + // Set height of element +, height: function(height) { + var b = this.bbox() + + return height == null ? b.height : this.size(b.width, height) + } + // Set the actual size in pixels +, size: function(width, height) { + var scale = width / this._offset.width + + return this.transform({ + scaleX: scale + , scaleY: height != null ? height / this._offset.height : scale + }) + } + // Set path data +, plot: function(data) { + var x = this.trans.scaleX + , y = this.trans.scaleY + + /* native plot */ + this._plot(data) + + /* store offset */ + this._offset = this.transform({ scaleX: 1, scaleY: 1 }).bbox() + + /* get and store the actual offset of the element */ + if (this.unbiased) { + this._offset.x = this._offset.y = 0 + } else { + this._offset.x -= this.trans.x + this._offset.y -= this.trans.y + } + + return this.transform({ scaleX: x, scaleY: y }) + } // Private: Native plot - _plot: function(data) { +, _plot: function(data) { return this.attr('d', data || 'M0,0') } diff --git a/src/plotable.js b/src/plotable.js deleted file mode 100644 index 6386f13..0000000 --- a/src/plotable.js +++ /dev/null @@ -1,42 +0,0 @@ - -SVG.extend(SVG.Path, { - // Move over x-axis - x: function(x) { - return x == null ? this.bbox().x : this.transform('x', x) - } - // Move over y-axis -, y: function(y) { - return y == null ? this.bbox().y : this.transform('y', y) - } - // Set the actual size in pixels -, size: function(width, height) { - var scale = width / this._offset.width - - return this.transform({ - scaleX: scale - , scaleY: height != null ? height / this._offset.height : scale - }) - } - // Set path data -, plot: function(data) { - var x = this.trans.scaleX - , y = this.trans.scaleY - - /* native plot */ - this._plot(data) - - /* store offset */ - this._offset = this.transform({ scaleX: 1, scaleY: 1 }).bbox() - - /* get and store the actual offset of the element */ - if (this.unbiased) { - this._offset.x = this._offset.y = 0 - } else { - this._offset.x -= this.trans.x - this._offset.y -= this.trans.y - } - - return this.transform({ scaleX: x, scaleY: y }) - } - -})
\ No newline at end of file diff --git a/src/poly.js b/src/poly.js index 937960d..93a40fd 100644..100755 --- a/src/poly.js +++ b/src/poly.js @@ -32,6 +32,18 @@ SVG.extend(SVG.Polyline, SVG.Polygon, { , y: function(y) { return y == null ? this.bbox().y : this.move(this.bbox().x, y) } + // Set width of element +, width: function(width) { + var b = this.bbox() + + return width == null ? b.width : this.size(width, b.height) + } + // Set height of element +, height: function(height) { + var b = this.bbox() + + return height == null ? b.height : this.size(b.width, height) + } // Set element size to given width and height , size: function(width, height) { return this.attr('points', this.points.size(width, height)) diff --git a/src/rbox.js b/src/rbox.js index 95cc1e2..95cc1e2 100644..100755 --- a/src/rbox.js +++ b/src/rbox.js diff --git a/src/rect.js b/src/rect.js index 583556d..583556d 100644..100755 --- a/src/rect.js +++ b/src/rect.js diff --git a/src/regex.js b/src/regex.js index 602d2c7..602d2c7 100644..100755 --- a/src/regex.js +++ b/src/regex.js diff --git a/src/set.js b/src/set.js index 4c42efc..4c42efc 100644..100755 --- a/src/set.js +++ b/src/set.js diff --git a/src/shape.js b/src/shape.js index 0594ed7..0594ed7 100644..100755 --- a/src/shape.js +++ b/src/shape.js diff --git a/src/sugar.js b/src/sugar.js index 9577d94..5d7f5aa 100644..100755 --- a/src/sugar.js +++ b/src/sugar.js @@ -72,6 +72,15 @@ SVG.extend(SVG.Element, SVG.FX, { }) +// +SVG.extend(SVG.Rect, SVG.Ellipse, { + // Add x and y radius + radius: function(x, y) { + return this.attr({ rx: x, ry: y || x }) + } + +}) + if (SVG.Text) { SVG.extend(SVG.Text, SVG.FX, { diff --git a/src/svg.js b/src/svg.js index 89c23e4..89c23e4 100644..100755 --- a/src/svg.js +++ b/src/svg.js diff --git a/src/text.js b/src/text.js index 4acd236..4acd236 100644..100755 --- a/src/text.js +++ b/src/text.js diff --git a/src/textpath.js b/src/textpath.js index 04d7bde..04d7bde 100644..100755 --- a/src/textpath.js +++ b/src/textpath.js diff --git a/src/use.js b/src/use.js index 0a8bb90..0a8bb90 100644..100755 --- a/src/use.js +++ b/src/use.js diff --git a/src/viewbox.js b/src/viewbox.js index dfafed4..dfafed4 100644..100755 --- a/src/viewbox.js +++ b/src/viewbox.js |