├── README.md ├── bezier.html ├── genogram.html ├── img ├── 01.jpg ├── 02.jpg ├── 11.jpg ├── 12.jpg ├── 13.jpg ├── 14.jpg ├── 15.jpg ├── 21.jpg ├── 22.jpg ├── 23.jpg ├── 24.jpg ├── 41.jpg ├── 42.jpg ├── 43.jpg ├── a.png ├── an.png ├── forwiki │ └── show1.jpg ├── jzt.png ├── large-loading.gif └── she.png └── js ├── genogram - 右键菜单多个.js ├── genogram.js ├── saveSvgAsPng.js ├── svg.filter.js ├── svg.filter.min.js ├── svg.js └── svg.min.js /README.md: -------------------------------------------------------------------------------- 1 | # genogram 2 | #家谱图 3 | ###多子节点，多父节点对应关系 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /bezier.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | bezier 6 | 7 | 8 | 9 | 10 |
11 | 12 | 30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /img/01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/01.jpg -------------------------------------------------------------------------------- /img/02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/02.jpg -------------------------------------------------------------------------------- /img/11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/11.jpg -------------------------------------------------------------------------------- /img/12.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/12.jpg -------------------------------------------------------------------------------- /img/13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/13.jpg -------------------------------------------------------------------------------- /img/14.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/14.jpg -------------------------------------------------------------------------------- /img/15.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/15.jpg -------------------------------------------------------------------------------- /img/21.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/21.jpg -------------------------------------------------------------------------------- /img/22.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/22.jpg -------------------------------------------------------------------------------- /img/23.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/23.jpg -------------------------------------------------------------------------------- /img/24.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/24.jpg -------------------------------------------------------------------------------- /img/41.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/41.jpg -------------------------------------------------------------------------------- /img/42.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/42.jpg -------------------------------------------------------------------------------- /img/43.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/43.jpg -------------------------------------------------------------------------------- /img/a.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/a.png -------------------------------------------------------------------------------- /img/an.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/an.png -------------------------------------------------------------------------------- /img/forwiki/show1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/forwiki/show1.jpg -------------------------------------------------------------------------------- /img/jzt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/jzt.png -------------------------------------------------------------------------------- /img/large-loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/large-loading.gif -------------------------------------------------------------------------------- /img/she.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zhangchan/genogram/1d3e79e9be7e081bdddf68baf5cda58244b190f4/img/she.png -------------------------------------------------------------------------------- /js/genogram - 右键菜单多个.js: -------------------------------------------------------------------------------- 1 | function Genogram(msg){ 2 | var draw; 3 | this.init(msg); 4 | } 5 | Genogram.prototype = { 6 | "createGroup" : function(data,imgW,addEvent){ 7 | var that = this; 8 | var color = data.record && data.record.indexOf("橙色_") != -1 ? (data.record.indexOf("红色_") != -1 ? "red" : "Darkorange") : (data.record.indexOf("红色_") != -1 ? "red" : ""); 9 | var image = this.draw.image(data.imgurl, imgW, imgW).attr({"x":-imgW/2,}); 10 | var group = this.draw.group().attr({"transform":'translate('+ data.x +','+ data.y +')'}); 11 | var text = this.draw.text(data.relation + "\n" + data.id + "\n" + data.name + "\n" + data.record.replace(/橙色\_|红色\_/g,"")).attr({"y":imgW,"dy":".35em","text-anchor":"middle","fill":color,"style":"cursor: pointer;"}); 12 | image.click(function(e){ 13 | addEvent(this,data); 14 | }); 15 | group.add(image).add(text); 16 | group.on("contextmenu",function(e){ 17 | e.preventDefault(); 18 | that.craetMenuLayout({pageX:e.pageX,pageY:e.pageY},data.url); 19 | }); 20 | 21 | }, 22 | "setDefaultXY" : function(data,coordX,coordY){ 23 | for (var i = data.length - 1; i >= 0; i--) { 24 | var xVal = 0; 25 | for(var j = 0; j < data[i].length; j++){ 26 | xVal += coordX; 27 | data[i][j].x = xVal; 28 | data[i][j].y = i*coordY; 29 | } 30 | } 31 | var tick = 0; 32 | for (var i = data.length - 1; i >= 0; i--) { 33 | for(var j = 0; j < data[i].length; j++){ 34 | if(data[i][j].bid.length == 1 && data[i][j].fid){ 35 | var arrp = []; 36 | for(var m = 0;m1){ 131 | var arr = []; 132 | for(var m = j;m < data[i].length; m++){ 133 | if(data[i][j].bid.indexOf(data[i][m].id) != -1){ 134 | arr.push(data[i][m]); 135 | } 136 | } 137 | if(data[i][j].bid.length == arr.length){ 138 | this.draw.polyline((arr[0].x-lineStrokeW) + "," + (arr[0].y - lineH) + " " + (arr[arr.length-1].x + lineStrokeW) + "," + (arr[arr.length-1].y - lineH)).fill('none').stroke(stroke); 139 | // 子类确定中心线 140 | var midX = (arr[arr.length-1].x - arr[0].x)/2 + arr[0].x; 141 | this.draw.polyline(midX + "," + (arr[0].y - lineH) + " " + midX + "," + (arr[arr.length-1].y - lineH*2)).fill('none').stroke(stroke); 142 | } 143 | } 144 | if(!data[i][j].cid.length && data[i][j].pid){ 145 | this.draw.polyline(data[i][j].x +","+(data[i][j].y+selfH)+" "+data[i][j].x+","+ (data[i][j].y+selfH+lineH)).fill('none').stroke(stroke); 146 | } 147 | 148 | } 149 | }; 150 | }, 151 | "getWH" : function(data,coordX){ 152 | var arrx=[], arry=[], result = {}; 153 | for(var i = 0; i < data.length;i++){ 154 | arrx.push(data[i][data[i].length -1].x); 155 | arry.push(data[i][data[i].length -1].y); 156 | } 157 | result = { 158 | maxW : Math.max.apply(null, arrx) + coordX, 159 | minH : Math.max.apply(null, arry) + coordX*1.4 160 | } 161 | return result; 162 | }, 163 | "craetMenuLayout" : function(obj,url){ 164 | if(!document.getElementById("cmenu")){ 165 | var cmenu = document.createElement("div"), 166 | ul = document.createElement("ul"); 167 | cmenu.id="cmenu"; 168 | ul.id = "cmenu_list"; 169 | cmenu.appendChild(ul); 170 | document.getElementById("genogram").appendChild(cmenu); 171 | } 172 | this.createMenuList(obj,url); 173 | }, 174 | "createMenuList" : function(obj,url){ 175 | if(!url.length) return false; 176 | var menu = document.getElementById("cmenu"), 177 | list = document.getElementById("cmenu_list"), 178 | html=''; 179 | menu.style.display = "block"; 180 | menu.style.top = obj.pageY + "px"; 181 | menu.style.left = obj.pageX + "px"; 182 | for(var i = 0; i < url.length; i++){ 183 | html += '
  • '+ url[i].name +'
    • '; 184 | } 185 | list.innerHTML = html; 186 | 187 | }, 188 | "addTag" : function(desc,collec,pos){ 189 | var groupDesc = this.draw.group().attr({"transform":'translate(0,0)'}); 190 | var textDesc = this.draw.text(desc).attr({"fill":"#333","style":"cursor: pointer;width:200px"}); 191 | var groupCollec = this.draw.group().attr({"transform":'translate('+ (pos.x - 180)+','+ (pos.y - 60)+')'}); 192 | var textCollec = this.draw.text(collec.name +"\n"+ collec.time).attr({"fill":"#333","style":"cursor: pointer;"}); 193 | groupDesc.add(textDesc); 194 | groupCollec.add(textCollec); 195 | }, 196 | "init" : function(arg){ 197 | var defaultVal = { 198 | data : [], 199 | id : "", 200 | coordX : 180, 201 | coordY : 280, 202 | selfH : 190, 203 | lineStrokeW : 1, 204 | imgW : 100, 205 | desc : "", 206 | collec : { 207 | name : "", 208 | time : "" 209 | }, 210 | listener : function(){} 211 | }; 212 | var lineH = (arg.coordY - arg.selfH)/3; 213 | if(arg && typeof arg == "object" ){ 214 | for(var key in defaultVal){ 215 | arg[key] = arg[key] ? arg[key] :defaultVal[key]; 216 | } 217 | }else{ 218 | arg = defaultVal; 219 | } 220 | if(!arg.data.length){ 221 | alert("缺少数据！"); 222 | return false; 223 | } 224 | if(!arg.id){ 225 | alert("未绑定到html"); 226 | return false; 227 | } 228 | document.getElementById(arg.id).innerHTML = ""; 229 | var that =this; 230 | var data = this.setDefaultXY(arg.data,arg.coordX,arg.coordY); 231 | var stage = this.getWH(data,arg.coordX); 232 | this.draw = SVG(arg.id).size(stage.maxW,stage.minH); 233 | var createNodes = (function(data){ 234 | for(var i = 0; i = 0; i--) { 197 | var xVal = 0; 198 | for(var j = 0; j < data[i].length; j++){ 199 | if(i == 0){ 200 | data[i][j].fid = ""; 201 | data[i][j].mid = ""; 202 | } 203 | xVal += coordX; 204 | data[i][j].index = j; 205 | data[i][j].x = xVal; 206 | data[i][j].y = i*coordY +100; 207 | } 208 | } 209 | if(type == "genogram"){ 210 | function oneChild(m,k){ 211 | if(++m>data.length) return false; 212 | var old; 213 | for(var n = 0;n 1 && data[i][j].fid && !data[i][j].mid){ 299 | //单亲多兄弟 300 | //父级 this.getObj(data[i][j].fid,data)[0] 301 | setParentX (data[i][j],i,j) 302 | function setParentX (obj,ix,jx) { 303 | var arrObj = me.getObj(obj.bid,data).sort(function(a, b) { 304 | return a.x - b.x; 305 | }); 306 | var minObj = arrObj[0],maxObj = arrObj[arrObj.length-1]; 307 | if (obj.id != minObj.id) return false; 308 | var oneParent = me.getObj(obj.fid,data)[0]; 309 | var halfBidW = (maxObj.x-minObj.x)/2; 310 | if(minObj.x + halfBidW < oneParent.x){ 311 | var oldmx = obj.x; 312 | data[ix][jx].x = oneParent.x-halfBidW; 313 | var movex = data[ix][jx].x - oldmx; 314 | for (var im = jx+1; im < data[ix].length; im++) { 315 | data[ix][im].x += movex; 316 | } 317 | }else{ 318 | var xDvalue = minObj.x + halfBidW -oneParent.x; 319 | for (var mn = oneParent.index; mn < data[ix-1].length; mn++) { 320 | data[ix-1][mn].x +=xDvalue; 321 | } 322 | for (mn = oneParent.index-1; mn>=0; mn--) { 323 | if (data[ix-1][mn].cid.length) { 324 | break; 325 | } 326 | data[ix-1][mn].x +=xDvalue; 327 | } 328 | var fpa = oneParent; 329 | for (var m = ix-2; m >= 0; m--) { 330 | for (var n = 0; n < data[m].length; n++) { 331 | if (fpa.fid == data[m][n].id) { 332 | fpa = me.getObj(fpa.fid,data)[0]; 333 | for (var mn = data[m][n].index; mn < data[m].length; mn++) { 334 | data[m][mn].x +=xDvalue; 335 | } 336 | for (mn = fpa.index-1; mn>=0; mn--) { 337 | if (data[m][mn].cid.length) { 338 | break; 339 | } 340 | data[m][mn].x +=xDvalue; 341 | } 342 | break; 343 | } 344 | } 345 | } 346 | } 347 | } 348 | }else{ 349 | var chalf, arr = []; 350 | for(var m = j;m < data[i].length; m++){ 351 | if(data[i][m].fid && data[i][j].bid.indexOf(data[i][m].id) != -1){ 352 | arr.push(data[i][m]); 353 | } 354 | } 355 | 356 | if(arr.length>1&&data[i][j].bid.length == arr.length){ 357 | chalf = (arr[arr.length-1].x - arr[0].x)/2 +arr[0].x; 358 | } 359 | for(var m = 0;m 0){ 390 | num--; 391 | } 392 | return num; 393 | })(); 394 | var s =j-(data[i][j].bid.length-1) -bpNum; 395 | var oldh = (data[i][j].x - data[i][s].x)/2; 396 | 397 | var olsf = data[i][s].x; 398 | var movep = data[m][n].x + (data[m][n].pid ? coordX/2 : 0) - oldh-data[i][s].x ; 399 | data[i][s].x = movep+olsf; 400 | for(var a = s+1;a 1 && !data[0][0].pid){ 447 | var xs = objs.map(function(ele){ 448 | return ele.x; 449 | }).sort(function(a,b){ 450 | return a-b; 451 | }); 452 | x = (xs[xs.length-1] - xs[0])/2 + xs[0] 453 | }else if(data[0][0].cid.length > 1 && data[0][0].pid){ 454 | var xs = objs.map(function(ele){ 455 | return ele.x; 456 | }).sort(function(a,b){ 457 | return a-b; 458 | }); 459 | x = (xs[xs.length-1] - xs[0])/2 + xs[0]-100 460 | } 461 | 462 | data[0][0].x = x 463 | var temp = x - oldx; 464 | for (var i = 1; i < data[0].length; i++) { 465 | data[0][i].x += temp; 466 | } 467 | }, 468 | "drawLine" : function(data,selfH,lineH,lineStrokeW,type){ 469 | var stroke = { width: 2,color: 'black'},posX,posY,that =this; 470 | var group = this.draw.group().attr({"id":"polyline"}); 471 | if(type == "genogram"){ 472 | for (var i = 0; i 1){ 492 | var arr = []; 493 | for(var m = j;m < data[i].length; m++){ 494 | if(data[i][j].bid.indexOf(data[i][m].id) != -1){ 495 | arr.push(data[i][m]); 496 | } 497 | } 498 | if(data[i][j].bid.length == arr.length){ 499 | group.add(this.draw.polyline((arr[0].x-lineStrokeW) + "," + (arr[0].y - lineH) + " " + (arr[arr.length-1].x + lineStrokeW) + "," + (arr[arr.length-1].y - lineH)).fill('none').stroke(stroke)); 500 | // 子类确定中心线 501 | var midX = (arr[arr.length-1].x - arr[0].x)/2 + arr[0].x; 502 | group.add(this.draw.polyline(midX + "," + (arr[0].y - lineH) + " " + midX + "," + (arr[arr.length-1].y - lineH*2)).fill('none').stroke(stroke)); 503 | } 504 | } 505 | } 506 | } 507 | }else if(type == "tree"){ 508 | if(data.length == 1) return false; 509 | // this.draw.polyline(data[0][0].x + "," + (data[0][0].y+selfH) + " " + data[0][0].x + "," + (data[0][0].y+selfH+2*lineH)).fill('none').stroke(stroke); 510 | for (var i = 0; i 1){ 554 | var arr = []; 555 | for(var m = j;m < data[i].length; m++){ 556 | if(data[i][j].bid.indexOf(data[i][m].id) != -1){ 557 | arr.push(data[i][m]); 558 | } 559 | } 560 | if(data[i][j].bid.length == arr.length){ 561 | group.add(this.draw.polyline((arr[0].x-selfH/2- lineH) + "," + (arr[0].y -lineStrokeW +selfH/2) + " " + (arr[arr.length-1].x -selfH/2- lineH) + "," + (arr[arr.length-1].y + selfH/2 + lineStrokeW)).fill('none').stroke(stroke)); 562 | // 子类确定中心线 563 | var midX = (arr[arr.length-1].y - arr[0].y)/2 + arr[0].y; 564 | group.add(this.draw.polyline((arr[0].x-selfH/2-2*lineH) + "," + (midX+selfH/2) + " " + (arr[arr.length-1].x -selfH/2- lineH) + "," + (midX+selfH/2)).fill('none').stroke(stroke)); 565 | } 566 | } 567 | 568 | } 569 | } 570 | }else if(type == "tree"){ 571 | // this.draw.polyline((data[0][0].x+selfH/2) + "," + (data[0][0].y+selfH/2) + " " + (data[0][0].x+selfH/2+2*lineH) + "," + (data[0][0].y+selfH/2)).fill('none').stroke(stroke); 572 | for (var i = 0; i = 0; i--) { 626 | if(groups[i].type == "g" && groups[i].attr("uid") && groups[i] != group && ids.indexOf(groups[i].attr("uid").slice(0,-1)) == -1){ 627 | groups[i].filter(function(add) { 628 | // add.gaussianBlur(3, 0) 629 | add.componentTransfer({ 630 | rgb: { type: 'linear', slope: 1.5, intercept: 0.3 } 631 | }) 632 | }); 633 | } 634 | }; 635 | }, 636 | "drawGEle" : function(data,arg){ 637 | var arr = [],obj=[],lineh = 120; 638 | var mw = this.getlmpWH(data).w/2; 639 | var mapw = this.getlmpWH(data).w; 640 | var maph = this.getlmpWH(data).h; 641 | // SVG.get("btitle") 642 | SVG.get("jlry").attr({"transform":'translate('+(mapw-200)+','+(maph-140)+')'}); 643 | SVG.get("shuom").attr({"transform":'translate(60,'+(maph-160)+')'}); 644 | if(SVG.get("levelG")) return; 645 | this.draw.size(mapw+200,maph); 646 | var group = this.draw.group().attr("id","levelG").attr({"transform":'translate('+mw+',100)'}); 647 | for (var i = 0; i < data.length; i++) { 648 | arr[i]={}; 649 | var zbarr=[]; 650 | if(!i){ 651 | obj[i] = this.draw.group().attr({"transform":"matrix(1,0,0,1,0,0)"}); 652 | }else{ 653 | obj[i] = this.draw.group().attr({"transform":"matrix(1,0,0,1,"+ data[i-1][key].lw/2+","+(data[i-1][key].lh+lineh)+")"}) 654 | } 655 | for(var key in data[i]){ 656 | arr[i][key] = this.draw.group().attr({"transform":"matrix(1,0,0,1,"+data[i][key].lx+","+data[i][key].ly+")"}); 657 | arr[i][key].add(this.draw.text(key).attr({"transform":'translate(-80,-20)',"font-size":"16px"})); 658 | arr[i][key].rect(data[i][key].lw,data[i][key].lh).fill("none").stroke({ width: 2,color: 'black'}).attr({"transform":"matrix(1,0,0,1,-90,-20)"}); 659 | 660 | for (var j = 0; j < data[i][key].children.length; j++) { 661 | arr[i][key].add(this.createGroup(data[i][key].children[j],arg.imgW,arg.listener,arg)); 662 | } 663 | obj[i].add(arr[i][key]) 664 | var px = data[i][key].lx+data[i][key].lw/2, 665 | py = data[i][key].ly; 666 | zbarr.push({ 667 | x : px, 668 | y : py-lineh/2 669 | }) 670 | if(i){ 671 | obj[i].add(this.draw.line(px,py,px,py-lineh/2).attr({"transform":"translate(-90,-20)"}).stroke({ width: 2,color: 'black'})); 672 | } 673 | if(data[i+1]){ 674 | obj[i].add(this.draw.line(px,py+data[i][key].lh,px,py+data[i][key].lh+lineh/2).attr({"transform":"translate(-90,-20)"}).stroke({ width: 2,color: 'black'})); 675 | } 676 | } 677 | 678 | obj[i].add(this.draw.line(zbarr[0].x,zbarr[0].y,zbarr[zbarr.length-1].x,zbarr[zbarr.length-1].y).attr({"transform":"translate(-90,-20)"}).stroke({ width: 2,color: 'black'})); 679 | group.add(obj[i]); 680 | } 681 | 682 | 683 | }, 684 | "getlmpWH" : function (data){ 685 | var lineh = 120; 686 | //获取图宽 687 | var arrw = [],arrh=[]; 688 | for (var i = 0; i < data.length; i++) { 689 | arrw[i] = []; 690 | arrh[i] = []; 691 | for(var key in data[i]){ 692 | arrw[i].push(data[i][key].lw); 693 | arrh[i].push(data[i][key].lh); 694 | } 695 | arrw[i] = arrw[i].length*20 + arrw[i].reduce(function(a,b){ 696 | return a+b; 697 | }) 698 | arrh[i].sort(function(a,b){ 699 | return b-a; 700 | }); 701 | arrh[i] = arrh[i][0]; 702 | } 703 | arrw.sort(function(a,b){ 704 | return b-a; 705 | }); 706 | var lasth = arrh.length*lineh +arrh.reduce(function(a,b){ 707 | return a+b; 708 | })+300; 709 | return { 710 | w:arrw[0], 711 | h:lasth 712 | } 713 | }, 714 | "clearRL" : function(){ 715 | //clear relation line 716 | if(this.arrowLine && this.arrowLine.length){ 717 | this.arrowLine.map(function(e){ 718 | e.remove(); 719 | }); 720 | this.arrowText.map(function(e){ 721 | e.remove(); 722 | }); 723 | this.draw.get(0).clear(); 724 | } 725 | }, 726 | "creatMenuLayout" : function(obj,data,arg,url){ 727 | if((arg.showMenuRecords || data.usemenu) && !document.getElementById("cmenu")){ 728 | var cmenu = document.createElement("div"), 729 | ul = document.createElement("ul"); 730 | cmenu.id="cmenu"; 731 | ul.id = "cmenu_list"; 732 | cmenu.appendChild(ul); 733 | document.getElementById("genogram").appendChild(cmenu); 734 | } 735 | if(arg.showMenuRecords || data.usemenu){ 736 | this.createMenuList(obj,data,arg,url); 737 | } 738 | }, 739 | "createMenuList" : function(obj,data,arg,url){ 740 | var menu = document.getElementById("cmenu"), 741 | list = document.getElementById("cmenu_list"), 742 | html=''; 743 | menu.style.position = "absolute"; 744 | menu.style.display = "block"; 745 | menu.style.top = obj.pageY- arg.offsetTop + "px"; 746 | menu.style.left = obj.pageX - arg.offsetLeft + "px"; 747 | 748 | if(arg.showMenuRecords){ 749 | html += '
  • 全息档案
    • '; 750 | } 751 | if(data.usemenu){ 752 | for(var i = 0; i < url.length; i++){ 753 | html += '
  • '+ url[i].name +'
    • '; 754 | } 755 | } 756 | 757 | list.innerHTML = html; 758 | if(arg.showMenuRecords){ 759 | document.getElementById("qxdr").onclick=function(e){ 760 | e.preventDefault(); 761 | arg.menuTo(data,this); 762 | }; 763 | } 764 | }, 765 | "addDirection" : function(obj,data,arg,size,btnf){ 766 | var that = this; 767 | var btn = this.createBtn({ 768 | type : "button", 769 | id : "direction", 770 | style :{ 771 | position : "absolute", 772 | right : "120px" 773 | }, 774 | text : "" 775 | }); 776 | if(!btnf) { 777 | btn.innerText = "横向显示"; 778 | btn.setAttribute("dir","horizontal"); 779 | this.btns.appendChild(btn); 780 | }else{ 781 | direc = btnf.getAttribute("dir"); 782 | btnf.innerText = direc == "horizontal" ? "竖向显示" : "横向显示"; 783 | btnf.setAttribute("dir",direc == "horizontal" ? "vertical" : "horizontal"); 784 | this.btns.appendChild(btnf); 785 | } 786 | btn.onclick = function(){ 787 | var newData = that.changeXY(data); 788 | arg.data = newData; 789 | that.init(arg,btn); 790 | }; 791 | // var png = document.getElementById("savepng") 792 | // if(png){ 793 | // png.parentNode.removeChild(png); 794 | // this.addSave(obj,arg.pngNameRule,size,btnf); 795 | // } 796 | }, 797 | "addSave" : function(obj,name,size,btn){ 798 | var that = this; 799 | var btn = this.createBtn({ 800 | type : "button", 801 | id : "savepng", 802 | style :{ 803 | position : "absolute", 804 | right : "35px" 805 | }, 806 | text : "保存为图片" 807 | }); 808 | this.btns.appendChild(btn); 809 | var canvas = document.getElementsByTagName("svg")[0]; 810 | btn.onclick = function(){ 811 | var border = that.draw.polyline(0 + "," + 0 + " " + size.x + "," + 0 + " " + size.x + "," + size.y + " " + 0 + ","+ size.y + " "+ 0 +","+0).fill('none').stroke({ width: 2,color: 'black'}); 812 | saveSvgAsPng(canvas, name); 813 | setTimeout(function(){ 814 | border.remove(); 815 | },500); 816 | }; 817 | }, 818 | "addLevelBtn" : function(obj,data,arg){ 819 | var me = this,arr = []; 820 | for (var i = 0; i < data.length; i++) { 821 | arr[i]=[]; 822 | for (var j = 0; j < data[i].length; j++) { 823 | if(this.checkDataType(arr[i][data[i][j].relation]) == 'undefined'){ 824 | arr[i][data[i][j].relation] = {}; 825 | arr[i][data[i][j].relation].children = []; 826 | } 827 | arr[i][data[i][j].relation].children.push(data[i][j]) 828 | } 829 | } 830 | var btn = this.createBtn({ 831 | type : "button", 832 | id : "levelbtn", 833 | style :{ 834 | position : "absolute", 835 | right : "190px" 836 | }, 837 | text : "按层级查看" 838 | }); 839 | btn.onclick = function(){ 840 | var newData = me.levelXY(arr,arg); 841 | arg.ldata = newData; 842 | if(!arg.view){ 843 | this.innerText='返回'; 844 | arg.view = true; 845 | SVG.get('eleg').hide(); 846 | SVG.get('polyline').hide(); 847 | 848 | me.drawGEle(newData,arg); 849 | SVG.get('levelG').show(); 850 | }else{ 851 | this.innerText='按层级查看'; 852 | arg.view = false; 853 | SVG.get('eleg').show(); 854 | SVG.get('polyline').show(); 855 | SVG.get('levelG').hide(); 856 | } 857 | // me.init(arg,btn); 858 | }; 859 | this.btns.appendChild(btn); 860 | }, 861 | "addRelationBtn" : function(obj,name,btn,callback){ 862 | var that = this; 863 | var btn = this.createBtn({ 864 | type : "button", 865 | id : "relationbtn", 866 | style :{ 867 | position : "absolute", 868 | right : "190px" 869 | }, 870 | text : "按家族查看" 871 | }); 872 | this.btns.appendChild(btn); 873 | btn.onclick = callback; 874 | }, 875 | "createBtn" : function(ele){ 876 | var btn = document.createElement(ele.type); 877 | btn.id = ele.id; 878 | btn.style.position = ele.style.position; 879 | btn.style.right = ele.style.right; 880 | btn.style.top = ele.style.top; 881 | btn.innerText = ele.text; 882 | return btn; 883 | }, 884 | "changeXY" : function(data){ 885 | var temp; 886 | for(var i = 0; i < data.length; i++){ 887 | for(var j = 0; j= 0; i--) { 898 | var wall = 0,warr=[]; 899 | for (var key in data[i]) { 900 | 901 | data[i][key].ly = sh; 902 | children = data[i][key].children; 903 | for (var j = 0; j < children.length; j++) { 904 | children[j].lx = jj + (j%4)*arg.coordX; 905 | children[j].ly = jj + Math.floor(j/4)*arg.coordY; 906 | } 907 | data[i][key].lh = Math.ceil(children.length/4)*arg.coordY + jj*2; 908 | data[i][key].lw = (children.length >= num ? num : children.length)*arg.coordX + jj*2; 909 | warr.push(data[i][key].lw); 910 | wall += data[i][key].lw; 911 | data[i][key].lx; 912 | } 913 | var count = 0; 914 | wall += (children.length-1)*jj; 915 | for (var key in data[i]) { 916 | data[i][key].lx = getelev(count,warr) +count*jj - wall/2; 917 | count++; 918 | } 919 | } 920 | function getelev(n,arr){ 921 | var w=0; 922 | for (var i = 0; i < n; i++) { 923 | w+=arr[i]; 924 | } 925 | return w; 926 | } 927 | 928 | return data; 929 | }, 930 | "getWH" : function(data,coordX){ 931 | var arrx=[], arry=[], result = {}; 932 | for(var i = 0; i < data.length;i++){ 933 | arrx.push(data[i][data[i].length -1].x); 934 | arry.push(data[i][data[i].length -1].y); 935 | } 936 | result = { 937 | maxW : Math.max.apply(null, arrx) + coordX, 938 | minH : Math.max.apply(null, arry) + coordX*2 939 | } 940 | return result; 941 | }, 942 | "addTag" : function(desc,collec,ms,pos){ 943 | var me = this; 944 | var titleW = this.calStrWidth(desc,15)>200 ? 200 : this.calStrWidth(desc,15); 945 | var num = Math.floor((pos.x-250)/15); 946 | var textnum = 28; 947 | var linenum = ms.length >= textnum ? textnum : ms.length+3 948 | var lheight = (ms.length+3)/textnum > 3 ? Math.ceil((ms.length+3)/textnum)*21 : 85; 949 | var arr = []; 950 | for(var i =0;i= 0; i--) { 1021 | for (var j = data[i].length - 1; j >= 0; j--) { 1022 | if(id.indexOf(data[i][j].id) != -1){ 1023 | objArr.push(data[i][j]); 1024 | } 1025 | } 1026 | } 1027 | return objArr; 1028 | }, 1029 | "changeDesc": function(val,type){ 1030 | switch(type){ 1031 | case "desc" : 1032 | var rx = this.draw.node.clientWidth; 1033 | var titleW = this.calStrWidth(val,15)>200 ? 200 : this.calStrWidth(val,15); 1034 | this.groupLs.groupDesc.attr({"transform":'translate('+(rx-titleW)/2+',10)'}); 1035 | this.groupLs.textDesc.text(this.sliceStr(val,19)); 1036 | break; 1037 | case "ms" : 1038 | this.groupLs.textMS.text(this.sliceStr(val? "说明："+val : "" ,35)); 1039 | break; 1040 | case "cjr" : 1041 | this.groupLs.textcjr.text("采集人："+val); 1042 | break; 1043 | default : break; 1044 | } 1045 | }, 1046 | "checkDataType" : function(value) { 1047 | return Object.prototype.toString.apply(value).slice(8, -1).toLowerCase(); 1048 | }, 1049 | "calStrWidth" : function(str,w){ 1050 | //calculate string width 1051 | function calCn(str){ 1052 | re=/[\u4E00-\u9FA5]|\u3002|\uff1f|\uff01|\uff0c|\u3001|\uff1b|\uff1a|\u201c|\u201d|\u2018|\u2019|\uff08|\uff09|\u300a|\u300b|\u3008|\u3009|\u3010|\u3011|\u300e|\u300f|\u300c|\u300d|\ufe43|\ufe44|\u3014|\u3015|\u2026|\u2014|\uff5e|\ufe4f|\uffe5/g; 1053 | if(re.test(str)){ 1054 | return str.match(re).length; 1055 | }else{ 1056 | return 0 ; 1057 | } 1058 | } 1059 | var n = calCn(str),len =str.length; 1060 | return Math.ceil((len+n)*w/2); 1061 | } 1062 | 1063 | } 1064 | 1065 | 1066 | -------------------------------------------------------------------------------- /js/saveSvgAsPng.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | var out$ = typeof exports != 'undefined' && exports || typeof define != 'undefined' && {} || this; 3 | 4 | var doctype = ''; 5 | 6 | function isElement(obj) { 7 | return obj instanceof HTMLElement || obj instanceof SVGElement; 8 | } 9 | 10 | function requireDomNode(el) { 11 | if (!isElement(el)) { 12 | throw new Error('an HTMLElement or SVGElement is required; got ' + el); 13 | } 14 | } 15 | 16 | function isExternal(url) { 17 | return url && url.lastIndexOf('http',0) == 0 && url.lastIndexOf(window.location.host) == -1; 18 | } 19 | 20 | function inlineImages(el, callback) { 21 | requireDomNode(el); 22 | 23 | var images = el.querySelectorAll('image'), 24 | left = images.length, 25 | checkDone = function() { 26 | if (left === 0) { 27 | callback(); 28 | } 29 | }; 30 | 31 | checkDone(); 32 | for (var i = 0; i < images.length; i++) { 33 | (function(image) { 34 | var href = image.getAttributeNS("http://www.w3.org/1999/xlink", "href"); 35 | if (href) { 36 | if (isExternal(href.value)) { 37 | console.warn("Cannot render embedded images linking to external hosts: "+href.value); 38 | return; 39 | } 40 | } 41 | var canvas = document.createElement('canvas'); 42 | var ctx = canvas.getContext('2d'); 43 | var img = new Image(); 44 | img.crossOrigin = "Anonymous"; 45 | href = href || image.getAttribute('href'); 46 | if (href) { 47 | img.src = href; 48 | img.onload = function() { 49 | canvas.width = img.width; 50 | canvas.height = img.height; 51 | ctx.drawImage(img, 0, 0); 52 | image.setAttributeNS("http://www.w3.org/1999/xlink", "href", canvas.toDataURL('image/png')); 53 | left--; 54 | checkDone(); 55 | } 56 | img.onerror = function() { 57 | console.log("Could not load "+href); 58 | left--; 59 | checkDone(); 60 | } 61 | } else { 62 | left--; 63 | checkDone(); 64 | } 65 | })(images[i]); 66 | } 67 | } 68 | 69 | function styles(el, selectorRemap) { 70 | var css = ""; 71 | var sheets = document.styleSheets; 72 | for (var i = 0; i < sheets.length; i++) { 73 | try { 74 | var rules = sheets[i].cssRules; 75 | } catch (e) { 76 | console.warn("Stylesheet could not be loaded: "+sheets[i].href); 77 | continue; 78 | } 79 | 80 | if (rules != null) { 81 | for (var j = 0; j < rules.length; j++) { 82 | var rule = rules[j]; 83 | if (typeof(rule.style) != "undefined") { 84 | var match, selectorText; 85 | 86 | try { 87 | selectorText = rule.selectorText; 88 | } catch(err) { 89 | console.warn('The following CSS rule has an invalid selector: "' + rule + '"', err); 90 | } 91 | 92 | try { 93 | if (selectorText) { 94 | match = el.querySelector(selectorText); 95 | } 96 | } catch(err) { 97 | console.warn('Invalid CSS selector "' + selectorText + '"', err); 98 | } 99 | 100 | if (match) { 101 | var selector = selectorRemap ? selectorRemap(rule.selectorText) : rule.selectorText; 102 | css += selector + " { " + rule.style.cssText + " }\n"; 103 | } else if(rule.cssText.match(/^@font-face/)) { 104 | css += rule.cssText + '\n'; 105 | } 106 | } 107 | } 108 | } 109 | } 110 | return css; 111 | } 112 | 113 | function getDimension(el, clone, dim) { 114 | var v = (el.viewBox && el.viewBox.baseVal && el.viewBox.baseVal[dim]) || 115 | (clone.getAttribute(dim) !== null && !clone.getAttribute(dim).match(/%$/) && parseInt(clone.getAttribute(dim))) || 116 | el.getBoundingClientRect()[dim] || 117 | parseInt(clone.style[dim]) || 118 | parseInt(window.getComputedStyle(el).getPropertyValue(dim)); 119 | return (typeof v === 'undefined' || v === null || isNaN(parseFloat(v))) ? 0 : v; 120 | } 121 | 122 | function reEncode(data) { 123 | data = encodeURIComponent(data); 124 | data = data.replace(/%([0-9A-F]{2})/g, function(match, p1) { 125 | var c = String.fromCharCode('0x'+p1); 126 | return c === '%' ? '%25' : c; 127 | }); 128 | return decodeURIComponent(data); 129 | } 130 | 131 | out$.svgAsDataUri = function(el, options, cb) { 132 | requireDomNode(el); 133 | 134 | options = options || {}; 135 | options.scale = options.scale || 1; 136 | options.responsive = options.responsive || false; 137 | var xmlns = "http://www.w3.org/2000/xmlns/"; 138 | 139 | inlineImages(el, function() { 140 | var outer = document.createElement("div"); 141 | var clone = el.cloneNode(true); 142 | var width, height; 143 | if(el.tagName == 'svg') { 144 | width = options.width || getDimension(el, clone, 'width'); 145 | height = options.height || getDimension(el, clone, 'height'); 146 | } else if(el.getBBox) { 147 | var box = el.getBBox(); 148 | width = box.x + box.width; 149 | height = box.y + box.height; 150 | clone.setAttribute('transform', clone.getAttribute('transform').replace(/translate\(.*?\)/, '')); 151 | 152 | var svg = document.createElementNS('http://www.w3.org/2000/svg','svg') 153 | svg.appendChild(clone) 154 | clone = svg; 155 | } else { 156 | console.error('Attempted to render non-SVG element', el); 157 | return; 158 | } 159 | 160 | clone.setAttribute("version", "1.1"); 161 | if (!clone.getAttribute('xmlns')) { 162 | clone.setAttributeNS(xmlns, "xmlns", "http://www.w3.org/2000/svg"); 163 | } 164 | if (!clone.getAttribute('xmlns:xlink')) { 165 | clone.setAttributeNS(xmlns, "xmlns:xlink", "http://www.w3.org/1999/xlink"); 166 | } 167 | 168 | if (options.responsive) { 169 | clone.removeAttribute('width'); 170 | clone.removeAttribute('height'); 171 | clone.setAttribute('preserveAspectRatio', 'xMinYMin meet'); 172 | } else { 173 | clone.setAttribute("width", width * options.scale); 174 | clone.setAttribute("height", height * options.scale); 175 | } 176 | 177 | clone.setAttribute("viewBox", [ 178 | options.left || 0, 179 | options.top || 0, 180 | width, 181 | height 182 | ].join(" ")); 183 | 184 | var fos = clone.querySelectorAll('foreignObject > *'); 185 | for (var i = 0; i < fos.length; i++) { 186 | if (!fos[i].getAttributeNS('xml', 'xmlns')) { 187 | fos[i].setAttributeNS(xmlns, "xmlns", "http://www.w3.org/1999/xhtml"); 188 | } 189 | } 190 | 191 | outer.appendChild(clone); 192 | 193 | var css = styles(el, options.selectorRemap); 194 | var s = document.createElement('style'); 195 | s.setAttribute('type', 'text/css'); 196 | s.innerHTML = ""; 197 | var defs = document.createElement('defs'); 198 | defs.appendChild(s); 199 | clone.insertBefore(defs, clone.firstChild); 200 | 201 | var svg = doctype + outer.innerHTML; 202 | var uri = 'data:image/svg+xml;base64,' + window.btoa(reEncode(svg)); 203 | if (cb) { 204 | cb(uri); 205 | } 206 | }); 207 | } 208 | 209 | out$.svgAsPngUri = function(el, options, cb) { 210 | requireDomNode(el); 211 | 212 | out$.svgAsDataUri(el, options, function(uri) { 213 | var image = new Image(); 214 | image.crossOrigin = "Anonymous"; 215 | image.onload = function() { 216 | var canvas = document.createElement('canvas'); 217 | canvas.width = image.width; 218 | canvas.height = image.height; 219 | var context = canvas.getContext('2d'); 220 | if(options && options.backgroundColor){ 221 | context.fillStyle = options.backgroundColor; 222 | context.fillRect(0, 0, canvas.width, canvas.height); 223 | } 224 | context.drawImage(image, 0, 0); 225 | var a = document.createElement('a'), png; 226 | try { 227 | png = canvas.toDataURL('image/png'); 228 | } catch (e) { 229 | if ((typeof SecurityError !== 'undefined' && e instanceof SecurityError) || e.name == "SecurityError") { 230 | console.error("Rendered SVG images cannot be downloaded in this browser."); 231 | return; 232 | } else { 233 | throw e; 234 | } 235 | } 236 | cb(png); 237 | } 238 | image.onerror = function() { 239 | console.error( 240 | 'There was an error loading the data URI as an image on the following SVG\n', 241 | window.atob(uri.slice(26)), '\n', 242 | "Open the following link to see browser's diagnosis\n", 243 | uri); 244 | } 245 | image.src = uri; 246 | }); 247 | } 248 | 249 | function download(name, uri) { 250 | var a = document.createElement('a'); 251 | a.download = name; 252 | a.href = uri; 253 | document.body.appendChild(a); 254 | a.addEventListener("click", function(e) { 255 | a.parentNode.removeChild(a); 256 | }); 257 | a.click(); 258 | } 259 | 260 | out$.saveSvg = function(el, name, options) { 261 | requireDomNode(el); 262 | 263 | options = options || {}; 264 | out$.svgAsDataUri(el, options, function(uri) { 265 | download(name, uri); 266 | }); 267 | } 268 | 269 | out$.saveSvgAsPng = function(el, name, options) { 270 | requireDomNode(el); 271 | 272 | options = options || {}; 273 | out$.svgAsPngUri(el, options, function(uri) { 274 | download(name, uri); 275 | }); 276 | } 277 | 278 | // if define is defined create as an AMD module 279 | if (typeof define !== 'undefined') { 280 | define(function() { 281 | return out$; 282 | }); 283 | } 284 | })(); 285 | -------------------------------------------------------------------------------- /js/svg.filter.js: -------------------------------------------------------------------------------- 1 | /*! svg.filter.js - v2.0.2 - 2016-03-02 2 | * https://github.com/wout/svg.filter.js 3 | * Copyright (c) 2016 Wout Fierens; Licensed MIT */ 4 | ;(function() { 5 | 6 | // Main filter class 7 | SVG.Filter = SVG.invent({ 8 | create: 'filter', 9 | inherit: SVG.Parent, 10 | extend: { 11 | // Static strings 12 | source: 'SourceGraphic', 13 | sourceAlpha: 'SourceAlpha', 14 | background: 'BackgroundImage', 15 | backgroundAlpha: 'BackgroundAlpha', 16 | fill: 'FillPaint', 17 | stroke: 'StrokePaint', 18 | 19 | autoSetIn: true, 20 | // Custom put method for leaner code 21 | put: function(element, i) { 22 | this.add(element, i) 23 | 24 | if(!element.attr('in') && this.autoSetIn){ 25 | element.attr('in',this.source) 26 | } 27 | if(!element.attr('result')){ 28 | element.attr('result',element) 29 | } 30 | 31 | return element 32 | }, 33 | // Blend effect 34 | blend: function(in1, in2, mode) { 35 | return this.put(new SVG.BlendEffect(in1, in2, mode)) 36 | }, 37 | // ColorMatrix effect 38 | colorMatrix: function(type, values) { 39 | return this.put(new SVG.ColorMatrixEffect(type, values)) 40 | }, 41 | // ConvolveMatrix effect 42 | convolveMatrix: function(matrix) { 43 | return this.put(new SVG.ConvolveMatrixEffect(matrix)) 44 | }, 45 | // ComponentTransfer effect 46 | componentTransfer: function(components) { 47 | return this.put(new SVG.ComponentTransferEffect(components)) 48 | }, 49 | // Composite effect 50 | composite: function(in1, in2, operator) { 51 | return this.put(new SVG.CompositeEffect(in1, in2, operator)) 52 | }, 53 | // Flood effect 54 | flood: function(color, opacity) { 55 | return this.put(new SVG.FloodEffect(color, opacity)) 56 | }, 57 | // Offset effect 58 | offset: function(x, y) { 59 | return this.put(new SVG.OffsetEffect(x,y)) 60 | }, 61 | // Image effect 62 | image: function(src) { 63 | return this.put(new SVG.ImageEffect(src)) 64 | }, 65 | // Merge effect 66 | merge: function() { 67 | //pass the array of arguments to the constructor because we dont know if the user gave us an array as the first arguemnt or wether they listed the effects in the arguments 68 | var args = [undefined] 69 | for(var i in arguments) args.push(arguments[i]) 70 | return this.put(new (SVG.MergeEffect.bind.apply(SVG.MergeEffect,args))) 71 | }, 72 | // Gaussian Blur effect 73 | gaussianBlur: function(x,y) { 74 | return this.put(new SVG.GaussianBlurEffect(x,y)) 75 | }, 76 | // Morphology effect 77 | morphology: function(operator,radius){ 78 | return this.put(new SVG.MorphologyEffect(operator,radius)) 79 | }, 80 | // DiffuseLighting effect 81 | diffuseLighting: function(surfaceScale,diffuseConstant,kernelUnitLength){ 82 | return this.put(new SVG.DiffuseLightingEffect(surfaceScale,diffuseConstant,kernelUnitLength)) 83 | }, 84 | // DisplacementMap effect 85 | displacementMap: function(in1,in2,scale,xChannelSelector,yChannelSelector){ 86 | return this.put(new SVG.DisplacementMapEffect(in1,in2,scale,xChannelSelector,yChannelSelector)) 87 | }, 88 | // SpecularLighting effect 89 | specularLighting: function(surfaceScale,diffuseConstant,specularExponent,kernelUnitLength){ 90 | return this.put(new SVG.SpecularLightingEffect(surfaceScale,diffuseConstant,specularExponent,kernelUnitLength)) 91 | }, 92 | // Tile effect 93 | tile: function(){ 94 | return this.put(new SVG.TileEffect()); 95 | }, 96 | // Turbulence effect 97 | turbulence: function(baseFrequency,numOctaves,seed,stitchTiles,type){ 98 | return this.put(new SVG.TurbulenceEffect(baseFrequency,numOctaves,seed,stitchTiles,type)) 99 | }, 100 | // Default string value 101 | toString: function() { 102 | return 'url(#' + this.attr('id') + ')' 103 | } 104 | } 105 | }) 106 | 107 | //add .filter function 108 | SVG.extend(SVG.Defs, { 109 | // Define filter 110 | filter: function(block) { 111 | var filter = this.put(new SVG.Filter) 112 | 113 | /* invoke passed block */ 114 | if (typeof block === 'function') 115 | block.call(filter, filter) 116 | 117 | return filter 118 | } 119 | }) 120 | SVG.extend(SVG.Container, { 121 | // Define filter on defs 122 | filter: function(block) { 123 | return this.defs().filter(block) 124 | } 125 | }) 126 | SVG.extend(SVG.Element, SVG.G, SVG.Nested, { 127 | // Create filter element in defs and store reference 128 | filter: function(block) { 129 | this.filterer = block instanceof SVG.Element ? 130 | block : this.doc().filter(block) 131 | 132 | if(this.doc() && this.filterer.doc() !== this.doc()){ 133 | this.doc().defs().add(this.filterer) 134 | } 135 | 136 | this.attr('filter', this.filterer) 137 | 138 | return this.filterer 139 | }, 140 | // Remove filter 141 | unfilter: function(remove) { 142 | /* also remove the filter node */ 143 | if (this.filterer && remove === true) 144 | this.filterer.remove() 145 | 146 | /* delete reference to filterer */ 147 | delete this.filterer 148 | 149 | /* remove filter attribute */ 150 | return this.attr('filter', null) 151 | } 152 | }) 153 | 154 | // Create SVG.Effect class 155 | SVG.Effect = SVG.invent({ 156 | create: function(){ 157 | this.constructor.call(this) 158 | }, 159 | inherit: SVG.Element, 160 | extend: { 161 | // Set in attribute 162 | in: function(effect) { 163 | return effect == null? this.parent() && this.parent().select('[result="'+this.attr('in')+'"]').get(0) || this.attr('in') : this.attr('in', effect) 164 | }, 165 | // Named result 166 | result: function(result) { 167 | return result == null? this.attr('result') : this.attr('result',result) 168 | }, 169 | // Stringification 170 | toString: function() { 171 | return this.result() 172 | } 173 | } 174 | }) 175 | 176 | // create class for parent effects like merge 177 | // Inherit from SVG.Parent 178 | SVG.ParentEffect = SVG.invent({ 179 | create: function(){ 180 | this.constructor.call(this) 181 | }, 182 | inherit: SVG.Parent, 183 | extend: { 184 | // Set in attribute 185 | in: function(effect) { 186 | return effect == null? this.parent() && this.parent().select('[result="'+this.attr('in')+'"]').get(0) || this.attr('in') : this.attr('in', effect) 187 | }, 188 | // Named result 189 | result: function(result) { 190 | return result == null? this.attr('result') : this.attr('result',result) 191 | }, 192 | // Stringification 193 | toString: function() { 194 | return this.result() 195 | } 196 | } 197 | }) 198 | 199 | //chaining 200 | var chainingEffects = { 201 | // Blend effect 202 | blend: function(in2, mode) { 203 | return this.parent() && this.parent().blend(this, in2, mode) //pass this as the first input 204 | }, 205 | // ColorMatrix effect 206 | colorMatrix: function(type, values) { 207 | return this.parent() && this.parent().colorMatrix(type, values).in(this) 208 | }, 209 | // ConvolveMatrix effect 210 | convolveMatrix: function(matrix) { 211 | return this.parent() && this.parent().convolveMatrix(matrix).in(this) 212 | }, 213 | // ComponentTransfer effect 214 | componentTransfer: function(components) { 215 | return this.parent() && this.parent().componentTransfer(components).in(this) 216 | }, 217 | // Composite effect 218 | composite: function(in2, operator) { 219 | return this.parent() && this.parent().composite(this, in2, operator) //pass this as the first input 220 | }, 221 | // Flood effect 222 | flood: function(color, opacity) { 223 | return this.parent() && this.parent().flood(color, opacity) //this effect dont have inputs 224 | }, 225 | // Offset effect 226 | offset: function(x, y) { 227 | return this.parent() && this.parent().offset(x,y).in(this) 228 | }, 229 | // Image effect 230 | image: function(src) { 231 | return this.parent() && this.parent().image(src) //this effect dont have inputs 232 | }, 233 | // Merge effect 234 | merge: function() { 235 | return this.parent() && this.parent().merge.apply(this.parent(),[this].concat(arguments)) //pass this as the first argument 236 | }, 237 | // Gaussian Blur effect 238 | gaussianBlur: function(x,y) { 239 | return this.parent() && this.parent().gaussianBlur(x,y).in(this) 240 | }, 241 | // Morphology effect 242 | morphology: function(operator,radius){ 243 | return this.parent() && this.parent().morphology(operator,radius).in(this) 244 | }, 245 | // DiffuseLighting effect 246 | diffuseLighting: function(surfaceScale,diffuseConstant,kernelUnitLength){ 247 | return this.parent() && this.parent().diffuseLighting(surfaceScale,diffuseConstant,kernelUnitLength).in(this) 248 | }, 249 | // DisplacementMap effect 250 | displacementMap: function(in2,scale,xChannelSelector,yChannelSelector){ 251 | return this.parent() && this.parent().displacementMap(this,in2,scale,xChannelSelector,yChannelSelector) //pass this as the first input 252 | }, 253 | // SpecularLighting effect 254 | specularLighting: function(surfaceScale,diffuseConstant,specularExponent,kernelUnitLength){ 255 | return this.parent() && this.parent().specularLighting(surfaceScale,diffuseConstant,specularExponent,kernelUnitLength).in(this) 256 | }, 257 | // Tile effect 258 | tile: function(){ 259 | return this.parent() && this.parent().tile().in(this) 260 | }, 261 | // Turbulence effect 262 | turbulence: function(baseFrequency,numOctaves,seed,stitchTiles,type){ 263 | return this.parent() && this.parent().turbulence(baseFrequency,numOctaves,seed,stitchTiles,type).in(this) 264 | } 265 | } 266 | SVG.extend(SVG.Effect,chainingEffects) 267 | SVG.extend(SVG.ParentEffect,chainingEffects) 268 | 269 | //crea class for child effects, like MergeNode, FuncR and lights 270 | SVG.ChildEffect = SVG.invent({ 271 | create: function(){ 272 | this.constructor.call(this) 273 | }, 274 | inherit: SVG.Element, 275 | extend: { 276 | in: function(effect){ 277 | this.attr('in',effect) 278 | } 279 | //dont include any "result" functions because these types of nodes dont have them 280 | } 281 | }) 282 | 283 | // Create all different effects 284 | var effects = { 285 | blend: function(in1,in2,mode){ 286 | this.attr({ 287 | in: in1, 288 | in2: in2, 289 | mode: mode || 'normal' 290 | }) 291 | }, 292 | colorMatrix: function(type,values){ 293 | if (type == 'matrix') 294 | values = normaliseMatrix(values) 295 | 296 | this.attr({ 297 | type: type 298 | , values: typeof values == 'undefined' ? null : values 299 | }) 300 | }, 301 | convolveMatrix: function(matrix){ 302 | matrix = normaliseMatrix(matrix) 303 | 304 | this.attr({ 305 | order: Math.sqrt(matrix.split(' ').length) 306 | , kernelMatrix: matrix 307 | }) 308 | }, 309 | composite: function(in1, in2, operator){ 310 | this.attr({ 311 | in: in1, 312 | in2: in2, 313 | operator: operator 314 | }) 315 | }, 316 | flood: function(color,opacity){ 317 | this.attr('flood-color',color) 318 | if(opacity != null) this.attr('flood-opacity',opacity) 319 | }, 320 | offset: function(x,y){ 321 | this.attr({ 322 | dx: x, 323 | dy: y 324 | }) 325 | }, 326 | image: function(src){ 327 | this.attr('href', src, SVG.xlink) 328 | }, 329 | displacementMap: function(in1,in2,scale,xChannelSelector,yChannelSelector){ 330 | this.attr({ 331 | in: in1, 332 | in2: in2, 333 | scale: scale, 334 | xChannelSelector: xChannelSelector, 335 | yChannelSelector: yChannelSelector 336 | }) 337 | }, 338 | gaussianBlur: function(x,y){ 339 | x = x || 0 340 | y = y || x || 0 341 | this.attr('stdDeviation', x+' '+y) 342 | }, 343 | morphology: function(operator,radius){ 344 | this.attr({ 345 | operator: operator, 346 | radius: radius 347 | }) 348 | }, 349 | tile: function(){ 350 | 351 | }, 352 | turbulence: function(baseFrequency,numOctaves,seed,stitchTiles,type){ 353 | this.attr({ 354 | numOctaves: numOctaves, 355 | seed: seed, 356 | stitchTiles: stitchTiles, 357 | baseFrequency: baseFrequency, 358 | type: type 359 | }) 360 | } 361 | } 362 | 363 | // Create all parent effects 364 | var parentEffects = { 365 | merge: function(){ 366 | var children 367 | 368 | //test to see if we have a set 369 | if(arguments[0] instanceof SVG.Set){ 370 | var that = this 371 | arguments[0].each(function(i){ 372 | if(this instanceof SVG.MergeNode) 373 | that.put(this) 374 | else if(this instanceof SVG.Effect || this instanceof SVG.ParentEffect) 375 | that.put(new SVG.MergeNode(this)) 376 | }) 377 | } 378 | else{ 379 | //if the first argument is an array use it 380 | if(Array.isArray(arguments[0])) 381 | children = arguments[0] 382 | else 383 | children = arguments 384 | 385 | for(var i = 0; i < children.length; i++){ 386 | if(children[i] instanceof SVG.MergeNode){ 387 | this.put(children[i]) 388 | } 389 | else this.put(new SVG.MergeNode(children[i])) 390 | } 391 | } 392 | }, 393 | componentTransfer: function(compontents){ 394 | /* create rgb set */ 395 | this.rgb = new SVG.Set 396 | 397 | /* create components */ 398 | ;(['r', 'g', 'b', 'a']).forEach(function(c) { 399 | /* create component */ 400 | this[c] = new SVG['Func' + c.toUpperCase()]('identity') 401 | 402 | /* store component in set */ 403 | this.rgb.add(this[c]) 404 | 405 | /* add component node */ 406 | this.node.appendChild(this[c].node) 407 | }.bind(this)) //lost context in foreach 408 | 409 | /* set components */ 410 | if (compontents) { 411 | if (compontents.rgb) { 412 | /* set bundled components */ 413 | ;(['r', 'g', 'b']).forEach(function(c) { 414 | this[c].attr(compontents.rgb) 415 | }.bind(this)) 416 | 417 | delete compontents.rgb 418 | } 419 | 420 | /* set individual components */ 421 | for (var c in compontents) 422 | this[c].attr(compontents[c]) 423 | } 424 | }, 425 | diffuseLighting: function(surfaceScale,diffuseConstant,kernelUnitLength){ 426 | this.attr({ 427 | surfaceScale: surfaceScale, 428 | diffuseConstant: diffuseConstant, 429 | kernelUnitLength: kernelUnitLength 430 | }) 431 | }, 432 | specularLighting: function(surfaceScale,diffuseConstant,specularExponent,kernelUnitLength){ 433 | this.attr({ 434 | surfaceScale: surfaceScale, 435 | diffuseConstant: diffuseConstant, 436 | specularExponent: specularExponent, 437 | kernelUnitLength: kernelUnitLength 438 | }) 439 | }, 440 | } 441 | 442 | // Create child effects like PointLight and MergeNode 443 | var childEffects = { 444 | distantLight: function(azimuth, elevation){ 445 | this.attr({ 446 | azimuth: azimuth, 447 | elevation: elevation 448 | }) 449 | }, 450 | pointLight: function(x,y,z){ 451 | this.attr({ 452 | x: x, 453 | y: y, 454 | z: z 455 | }) 456 | }, 457 | spotLight: function(x,y,z,pointsAtX,pointsAtY,pointsAtZ){ 458 | this.attr({ 459 | x: x, 460 | y: y, 461 | z: z, 462 | pointsAtX: pointsAtX, 463 | pointsAtY: pointsAtY, 464 | pointsAtZ: pointsAtZ 465 | }) 466 | }, 467 | mergeNode: function(in1){ 468 | this.attr('in',in1) 469 | } 470 | } 471 | 472 | // Create compontent functions 473 | ;(['r', 'g', 'b', 'a']).forEach(function(c) { 474 | /* create class */ 475 | childEffects['Func' + c.toUpperCase()] = function(type) { 476 | this.attr('type',type) 477 | 478 | // take diffent arguments based on the type 479 | switch(type){ 480 | case 'table': 481 | this.attr('tableValues',arguments[1]) 482 | break 483 | case 'linear': 484 | this.attr('slope',arguments[1]) 485 | this.attr('intercept',arguments[2]) 486 | break 487 | case 'gamma': 488 | this.attr('amplitude',arguments[1]) 489 | this.attr('exponent',arguments[2]) 490 | this.attr('offset',arguments[2]) 491 | break 492 | } 493 | } 494 | }) 495 | 496 | //create effects 497 | foreach(effects,function(effect,i){ 498 | 499 | /* capitalize name */ 500 | var name = i.charAt(0).toUpperCase() + i.slice(1) 501 | var proto = {} 502 | 503 | /* create class */ 504 | SVG[name + 'Effect'] = SVG.invent({ 505 | create: function() { 506 | //call super 507 | this.constructor.call(this, SVG.create('fe' + name)) 508 | 509 | //call constructor for this effect 510 | effect.apply(this,arguments) 511 | 512 | //set the result 513 | this.result(this.attr('id') + 'Out') 514 | }, 515 | inherit: SVG.Effect, 516 | extend: proto 517 | }) 518 | }) 519 | 520 | //create parent effects 521 | foreach(parentEffects,function(effect,i){ 522 | 523 | /* capitalize name */ 524 | var name = i.charAt(0).toUpperCase() + i.slice(1) 525 | var proto = {} 526 | 527 | /* create class */ 528 | SVG[name + 'Effect'] = SVG.invent({ 529 | create: function() { 530 | //call super 531 | this.constructor.call(this, SVG.create('fe' + name)) 532 | 533 | //call constructor for this effect 534 | effect.apply(this,arguments) 535 | 536 | //set the result 537 | this.result(this.attr('id') + 'Out') 538 | }, 539 | inherit: SVG.ParentEffect, 540 | extend: proto 541 | }) 542 | }) 543 | 544 | //create child effects 545 | foreach(childEffects,function(effect,i){ 546 | 547 | /* capitalize name */ 548 | var name = i.charAt(0).toUpperCase() + i.slice(1) 549 | var proto = {} 550 | 551 | /* create class */ 552 | SVG[name] = SVG.invent({ 553 | create: function() { 554 | //call super 555 | this.constructor.call(this, SVG.create('fe' + name)) 556 | 557 | //call constructor for this effect 558 | effect.apply(this,arguments) 559 | }, 560 | inherit: SVG.ChildEffect, 561 | extend: proto 562 | }) 563 | }) 564 | 565 | // Effect-specific extensions 566 | SVG.extend(SVG.MergeEffect,{ 567 | in: function(effect){ 568 | if(effect instanceof SVG.MergeNode) 569 | this.add(effect,0) 570 | else 571 | this.add(new SVG.MergeNode(effect),0) 572 | 573 | return this 574 | } 575 | }) 576 | SVG.extend(SVG.CompositeEffect,SVG.BlendEffect,SVG.DisplacementMapEffect,{ 577 | in2: function(effect){ 578 | return effect == null? this.parent() && this.parent().select('[result="'+this.attr('in2')+'"]').get(0) || this.attr('in2') : this.attr('in2', effect) 579 | } 580 | }) 581 | 582 | // Presets 583 | SVG.filter = { 584 | sepiatone: [ .343, .669, .119, 0, 0 585 | , .249, .626, .130, 0, 0 586 | , .172, .334, .111, 0, 0 587 | , .000, .000, .000, 1, 0 ] 588 | } 589 | 590 | // Helpers 591 | function normaliseMatrix(matrix) { 592 | /* convert possible array value to string */ 593 | if (Array.isArray(matrix)) 594 | matrix = new SVG.Array(matrix) 595 | 596 | /* ensure there are no leading, tailing or double spaces */ 597 | return matrix.toString().replace(/^\s+/, '').replace(/\s+$/, '').replace(/\s+/g, ' ') 598 | } 599 | 600 | function foreach(){ //loops through mutiple objects 601 | var fn = function(){} 602 | if(typeof arguments[arguments.length-1] == 'function'){ 603 | fn = arguments[arguments.length-1] 604 | Array.prototype.splice.call(arguments,arguments.length-1,1) 605 | } 606 | for(var k in arguments){ 607 | for(var i in arguments[k]){ 608 | fn(arguments[k][i],i,arguments[k]) 609 | } 610 | } 611 | } 612 | 613 | }).call(this) 614 | -------------------------------------------------------------------------------- /js/svg.filter.min.js: -------------------------------------------------------------------------------- 1 | /*! svg.filter.js - v2.0.2 - 2016-03-02 2 | * https://github.com/wout/svg.filter.js 3 | * Copyright (c) 2016 Wout Fierens; Licensed MIT */ 4 | (function(){function a(a){return Array.isArray(a)&&(a=new SVG.Array(a)),a.toString().replace(/^\s+/,"").replace(/\s+$/,"").replace(/\s+/g," ")}function b(){var a=function(){};"function"==typeof arguments[arguments.length-1]&&(a=arguments[arguments.length-1],Array.prototype.splice.call(arguments,arguments.length-1,1));for(var b in arguments)for(var c in arguments[b])a(arguments[b][c],c,arguments[b])}SVG.Filter=SVG.invent({create:"filter",inherit:SVG.Parent,extend:{source:"SourceGraphic",sourceAlpha:"SourceAlpha",background:"BackgroundImage",backgroundAlpha:"BackgroundAlpha",fill:"FillPaint",stroke:"StrokePaint",autoSetIn:!0,put:function(a,b){return this.add(a,b),!a.attr("in")&&this.autoSetIn&&a.attr("in",this.source),a.attr("result")||a.attr("result",a),a},blend:function(a,b,c){return this.put(new SVG.BlendEffect(a,b,c))},colorMatrix:function(a,b){return this.put(new SVG.ColorMatrixEffect(a,b))},convolveMatrix:function(a){return this.put(new SVG.ConvolveMatrixEffect(a))},componentTransfer:function(a){return this.put(new SVG.ComponentTransferEffect(a))},composite:function(a,b,c){return this.put(new SVG.CompositeEffect(a,b,c))},flood:function(a,b){return this.put(new SVG.FloodEffect(a,b))},offset:function(a,b){return this.put(new SVG.OffsetEffect(a,b))},image:function(a){return this.put(new SVG.ImageEffect(a))},merge:function(){var a=[void 0];for(var b in arguments)a.push(arguments[b]);return this.put(new(SVG.MergeEffect.bind.apply(SVG.MergeEffect,a)))},gaussianBlur:function(a,b){return this.put(new SVG.GaussianBlurEffect(a,b))},morphology:function(a,b){return this.put(new SVG.MorphologyEffect(a,b))},diffuseLighting:function(a,b,c){return this.put(new SVG.DiffuseLightingEffect(a,b,c))},displacementMap:function(a,b,c,d,e){return this.put(new SVG.DisplacementMapEffect(a,b,c,d,e))},specularLighting:function(a,b,c,d){return this.put(new SVG.SpecularLightingEffect(a,b,c,d))},tile:function(){return this.put(new SVG.TileEffect)},turbulence:function(a,b,c,d,e){return this.put(new SVG.TurbulenceEffect(a,b,c,d,e))},toString:function(){return"url(#"+this.attr("id")+")"}}}),SVG.extend(SVG.Defs,{filter:function(a){var b=this.put(new SVG.Filter);return"function"==typeof a&&a.call(b,b),b}}),SVG.extend(SVG.Container,{filter:function(a){return this.defs().filter(a)}}),SVG.extend(SVG.Element,SVG.G,SVG.Nested,{filter:function(a){return this.filterer=a instanceof SVG.Element?a:this.doc().filter(a),this.doc()&&this.filterer.doc()!==this.doc()&&this.doc().defs().add(this.filterer),this.attr("filter",this.filterer),this.filterer},unfilter:function(a){return this.filterer&&a===!0&&this.filterer.remove(),delete this.filterer,this.attr("filter",null)}}),SVG.Effect=SVG.invent({create:function(){this.constructor.call(this)},inherit:SVG.Element,extend:{"in":function(a){return null==a?this.parent()&&this.parent().select('[result="'+this.attr("in")+'"]').get(0)||this.attr("in"):this.attr("in",a)},result:function(a){return null==a?this.attr("result"):this.attr("result",a)},toString:function(){return this.result()}}}),SVG.ParentEffect=SVG.invent({create:function(){this.constructor.call(this)},inherit:SVG.Parent,extend:{"in":function(a){return null==a?this.parent()&&this.parent().select('[result="'+this.attr("in")+'"]').get(0)||this.attr("in"):this.attr("in",a)},result:function(a){return null==a?this.attr("result"):this.attr("result",a)},toString:function(){return this.result()}}});var c={blend:function(a,b){return this.parent()&&this.parent().blend(this,a,b)},colorMatrix:function(a,b){return this.parent()&&this.parent().colorMatrix(a,b)["in"](this)},convolveMatrix:function(a){return this.parent()&&this.parent().convolveMatrix(a)["in"](this)},componentTransfer:function(a){return this.parent()&&this.parent().componentTransfer(a)["in"](this)},composite:function(a,b){return this.parent()&&this.parent().composite(this,a,b)},flood:function(a,b){return this.parent()&&this.parent().flood(a,b)},offset:function(a,b){return this.parent()&&this.parent().offset(a,b)["in"](this)},image:function(a){return this.parent()&&this.parent().image(a)},merge:function(){return this.parent()&&this.parent().merge.apply(this.parent(),[this].concat(arguments))},gaussianBlur:function(a,b){return this.parent()&&this.parent().gaussianBlur(a,b)["in"](this)},morphology:function(a,b){return this.parent()&&this.parent().morphology(a,b)["in"](this)},diffuseLighting:function(a,b,c){return this.parent()&&this.parent().diffuseLighting(a,b,c)["in"](this)},displacementMap:function(a,b,c,d){return this.parent()&&this.parent().displacementMap(this,a,b,c,d)},specularLighting:function(a,b,c,d){return this.parent()&&this.parent().specularLighting(a,b,c,d)["in"](this)},tile:function(){return this.parent()&&this.parent().tile()["in"](this)},turbulence:function(a,b,c,d,e){return this.parent()&&this.parent().turbulence(a,b,c,d,e)["in"](this)}};SVG.extend(SVG.Effect,c),SVG.extend(SVG.ParentEffect,c),SVG.ChildEffect=SVG.invent({create:function(){this.constructor.call(this)},inherit:SVG.Element,extend:{"in":function(a){this.attr("in",a)}}});var d={blend:function(a,b,c){this.attr({"in":a,in2:b,mode:c||"normal"})},colorMatrix:function(b,c){"matrix"==b&&(c=a(c)),this.attr({type:b,values:"undefined"==typeof c?null:c})},convolveMatrix:function(b){b=a(b),this.attr({order:Math.sqrt(b.split(" ").length),kernelMatrix:b})},composite:function(a,b,c){this.attr({"in":a,in2:b,operator:c})},flood:function(a,b){this.attr("flood-color",a),null!=b&&this.attr("flood-opacity",b)},offset:function(a,b){this.attr({dx:a,dy:b})},image:function(a){this.attr("href",a,SVG.xlink)},displacementMap:function(a,b,c,d,e){this.attr({"in":a,in2:b,scale:c,xChannelSelector:d,yChannelSelector:e})},gaussianBlur:function(a,b){a=a||0,b=b||a||0,this.attr("stdDeviation",a+" "+b)},morphology:function(a,b){this.attr({operator:a,radius:b})},tile:function(){},turbulence:function(a,b,c,d,e){this.attr({numOctaves:b,seed:c,stitchTiles:d,baseFrequency:a,type:e})}},e={merge:function(){var a;if(arguments[0]instanceof SVG.Set){var b=this;arguments[0].each(function(a){this instanceof SVG.MergeNode?b.put(this):(this instanceof SVG.Effect||this instanceof SVG.ParentEffect)&&b.put(new SVG.MergeNode(this))})}else{a=Array.isArray(arguments[0])?arguments[0]:arguments;for(var c=0;ce;e++)n+=t[e][0],null!=t[e][1]&&(n+=t[e][1],null!=t[e][2]&&(n+=" ",n+=t[e][2],null!=t[e][3]&&(n+=" ",n+=t[e][3],n+=" ",n+=t[e][4],null!=t[e][5]&&(n+=" ",n+=t[e][5],n+=" ",n+=t[e][6],null!=t[e][7]&&(n+=" ",n+=t[e][7])))));return n+" "}function m(t){for(var e=t.childNodes.length-1;e>=0;e--)t.childNodes[e]instanceof SVGElement&&m(t.childNodes[e]);return v.adopt(t).id(v.eid(t.nodeName))}function x(t){return null==t.x&&(t.x=0,t.y=0,t.width=0,t.height=0),t.w=t.width,t.h=t.height,t.x2=t.x+t.width,t.y2=t.y+t.height,t.cx=t.x+t.width/2,t.cy=t.y+t.height/2,t}function g(t){var e=t.toString().match(v.regex.reference);return e?e[1]:void 0}var v=this.SVG=function(t){return v.supported?(t=new v.Doc(t),v.parser.draw||v.prepare(),t):void 0};if(v.ns="http://www.w3.org/2000/svg",v.xmlns="http://www.w3.org/2000/xmlns/",v.xlink="http://www.w3.org/1999/xlink",v.svgjs="http://svgjs.com/svgjs",v.supported=function(){return!!e.createElementNS&&!!e.createElementNS(v.ns,"svg").createSVGRect}(),!v.supported)return!1;v.did=1e3,v.eid=function(t){return"Svgjs"+s(t)+v.did++},v.create=function(t){var i=e.createElementNS(this.ns,t);return i.setAttribute("id",this.eid(t)),i},v.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];v.Set&&v.Set.inherit&&v.Set.inherit()},v.invent=function(t){var e="function"==typeof t.create?t.create:function(){this.constructor.call(this,v.create(t.create))};return t.inherit&&(e.prototype=new t.inherit),t.extend&&v.extend(e,t.extend),t.construct&&v.extend(t.parent||v.Container,t.construct),e},v.adopt=function(t){if(!t)return null;if(t.instance)return t.instance;var e;return e="svg"==t.nodeName?t.parentNode instanceof SVGElement?new v.Nested:new v.Doc:"linearGradient"==t.nodeName?new v.Gradient("linear"):"radialGradient"==t.nodeName?new v.Gradient("radial"):v[s(t.nodeName)]?new(v[s(t.nodeName)]):new v.Element(t),e.type=t.nodeName,e.node=t,t.instance=e,e instanceof v.Doc&&e.namespace().defs(),e.setData(JSON.parse(t.getAttribute("svgjs:data"))||{}),e},v.prepare=function(){var t=e.getElementsByTagName("body")[0],i=(t?new v.Doc(t):new v.Doc(e.documentElement).nested()).size(2,0);v.parser={body:t||e.documentElement,draw:i.style("opacity:0;position:fixed;left:100%;top:100%;overflow:hidden"),poly:i.polyline().node,path:i.path().node,"native":v.create("svg")}},v.parser={"native":v.create("svg")},e.addEventListener("DOMContentLoaded",function(){v.parser.draw||v.prepare()},!1),v.regex={numberAndUnit:/^([+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?)([a-z%]*)$/i,hex:/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i,rgb:/rgb\((\d+),(\d+),(\d+)\)/,reference:/#([a-z0-9\-_]+)/i,matrix:/matrix\(|\)/g,matrixElements:/,*\s+|,/,whitespace:/\s/g,isHex:/^#[a-f0-9]{3,6}$/i,isRgb:/^rgb\(/,isCss:/[^:]+:[^;]+;?/,isBlank:/^(\s+)?$/,isNumber:/^[+-]?(\d+(\.\d*)?|\.\d+)(e[+-]?\d+)?$/i,isPercent:/^-?[\d\.]+%$/,isImage:/\.(jpg|jpeg|png|gif|svg)(\?[^=]+.*)?/i,negExp:/e\-/gi,comma:/,/g,hyphen:/\-/g,pathLetters:/[MLHVCSQTAZ]/gi,isPathLetter:/[MLHVCSQTAZ]/i,whitespaces:/\s+/,X:/X/g},v.utils={map:function(t,e){var i,n=t.length,r=[];for(i=0;n>i;i++)r.push(e(t[i]));return r},radians:function(t){return t%360*Math.PI/180},degrees:function(t){return 180*t/Math.PI%360},filterSVGElements:function(t){return[].filter.call(t,function(t){return t instanceof SVGElement})}},v.defaults={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","font-size":16,"font-family":"Helvetica, Arial, sans-serif","text-anchor":"start"}},v.Color=function(t){var e;this.r=0,this.g=0,this.b=0,t&&("string"==typeof t?v.regex.isRgb.test(t)?(e=v.regex.rgb.exec(t.replace(/\s/g,"")),this.r=parseInt(e[1]),this.g=parseInt(e[2]),this.b=parseInt(e[3])):v.regex.isHex.test(t)&&(e=v.regex.hex.exec(a(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))},v.extend(v.Color,{toString:function(){return this.toHex()},toHex:function(){return"#"+o(this.r)+o(this.g)+o(this.b)},toRgb:function(){return"rgb("+[this.r,this.g,this.b].join()+")"},brightness:function(){return this.r/255*.3+this.g/255*.59+this.b/255*.11},morph:function(t){return this.destination=new v.Color(t),this},at:function(t){return this.destination?(t=0>t?0:t>1?1:t,new v.Color({r:~~(this.r+(this.destination.r-this.r)*t),g:~~(this.g+(this.destination.g-this.g)*t),b:~~(this.b+(this.destination.b-this.b)*t)})):this}}),v.Color.test=function(t){return t+="",v.regex.isHex.test(t)||v.regex.isRgb.test(t)},v.Color.isRgb=function(t){return t&&"number"==typeof t.r&&"number"==typeof t.g&&"number"==typeof t.b},v.Color.isColor=function(t){return v.Color.isRgb(t)||v.Color.test(t)},v.Array=function(t,e){t=(t||[]).valueOf(),0==t.length&&e&&(t=e.valueOf()),this.value=this.parse(t)},v.extend(v.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.lengtht;t++)-1==i.indexOf(this.value[t])&&i.push(this.value[t]);return this.value=i},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 v.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.trim().split(/\s+/)},reverse:function(){return this.value.reverse(),this}}),v.PointArray=function(t,e){this.constructor.call(this,t,e||[[0,0]])},v.PointArray.prototype=new v.Array,v.extend(v.PointArray,{toString:function(){for(var t=0,e=this.value.length,i=[];e>t;t++)i.push(this.value[t].join(","));return i.join(" ")},toLine:function(){return{x1:this.value[0][0],y1:this.value[0][1],x2:this.value[1][0],y2:this.value[1][1]}},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 v.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();if(t-=i.x,e-=i.y,!isNaN(t)&&!isNaN(e))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.y;return this},bbox:function(){return v.parser.poly.setAttribute("points",this.toString()),v.parser.poly.getBBox()}}),v.PathArray=function(t,e){this.constructor.call(this,t,e||[["M",0,0]])},v.PathArray.prototype=new v.Array,v.extend(v.PathArray,{toString:function(){return p(this.value)},move:function(t,e){var i=this.bbox();if(t-=i.x,e-=i.y,!isNaN(t)&&!isNaN(e))for(var n,r=this.value.length-1;r>=0;r--)n=this.value[r][0],"M"==n||"L"==n||"T"==n?(this.value[r][1]+=t,this.value[r][2]+=e):"H"==n?this.value[r][1]+=t:"V"==n?this.value[r][1]+=e:"C"==n||"S"==n||"Q"==n?(this.value[r][1]+=t,this.value[r][2]+=e,this.value[r][3]+=t,this.value[r][4]+=e,"C"==n&&(this.value[r][5]+=t,this.value[r][6]+=e)):"A"==n&&(this.value[r][6]+=t,this.value[r][7]+=e);return this},size:function(t,e){var i,n,r=this.bbox();for(i=this.value.length-1;i>=0;i--)n=this.value[i][0],"M"==n||"L"==n||"T"==n?(this.value[i][1]=(this.value[i][1]-r.x)*t/r.width+r.x,this.value[i][2]=(this.value[i][2]-r.y)*e/r.height+r.y):"H"==n?this.value[i][1]=(this.value[i][1]-r.x)*t/r.width+r.x:"V"==n?this.value[i][1]=(this.value[i][1]-r.y)*e/r.height+r.y:"C"==n||"S"==n||"Q"==n?(this.value[i][1]=(this.value[i][1]-r.x)*t/r.width+r.x,this.value[i][2]=(this.value[i][2]-r.y)*e/r.height+r.y,this.value[i][3]=(this.value[i][3]-r.x)*t/r.width+r.x,this.value[i][4]=(this.value[i][4]-r.y)*e/r.height+r.y,"C"==n&&(this.value[i][5]=(this.value[i][5]-r.x)*t/r.width+r.x,this.value[i][6]=(this.value[i][6]-r.y)*e/r.height+r.y)):"A"==n&&(this.value[i][1]=this.value[i][1]*t/r.width,this.value[i][2]=this.value[i][2]*e/r.height,this.value[i][6]=(this.value[i][6]-r.x)*t/r.width+r.x,this.value[i][7]=(this.value[i][7]-r.y)*e/r.height+r.y);return this},parse:function(t){if(t instanceof v.PathArray)return t.valueOf();var e,i,n,r,s,a,o=0,h=0,u={M:2,L:2,H:1,V:1,C:6,S:4,Q:4,T:2,A:7};if("string"==typeof t){for(t=t.replace(v.regex.negExp,"X").replace(v.regex.pathLetters," $& ").replace(v.regex.hyphen," -").replace(v.regex.comma," ").replace(v.regex.X,"e-").trim().split(v.regex.whitespaces),e=t.length;--e;)if(t[e].indexOf(".")!=t[e].lastIndexOf(".")){var l=t[e].split("."),c=[l.shift(),l.shift()].join(".");t.splice.apply(t,[e,1].concat(c,l.map(function(t){return"."+t})))}}else t=t.reduce(function(t,e){return[].concat.apply(t,e)},[]);var a=[];do{for(v.regex.isPathLetter.test(t[0])?(r=t[0],t.shift()):"M"==r?r="L":"m"==r&&(r="l"),s=[r.toUpperCase()],e=0;et?-3.4e38:3.4e38:"string"==typeof t?(e=t.match(v.regex.numberAndUnit),e&&(this.value=parseFloat(e[1]),"%"==e[5]?this.value/=100:"s"==e[5]&&(this.value*=1e3),this.unit=e[5])):t instanceof v.Number&&(this.value=t.valueOf(),this.unit=t.unit)},extend:{toString:function(){return("%"==this.unit?~~(1e8*this.value)/1e6:"s"==this.unit?this.value/1e3:this.value)+this.unit},toJSON:function(){return this.toString()},valueOf:function(){return this.value},plus:function(t){return new v.Number(this+new v.Number(t),this.unit)},minus:function(t){return this.plus(-new v.Number(t))},times:function(t){return new v.Number(this*new v.Number(t),this.unit)},divide:function(t){return new v.Number(this/new v.Number(t),this.unit)},to:function(t){var e=new v.Number(this);return"string"==typeof t&&(e.unit=t),e},morph:function(t){return this.destination=new v.Number(t),this},at:function(t){return this.destination?new v.Number(this.destination).minus(this).times(t).plus(this):this}}}),v.Element=v.invent({create:function(t){this._stroke=v.defaults.attrs.stroke,this.dom={},(this.node=t)&&(this.type=t.nodeName,this.node.instance=this,this._stroke=t.getAttribute("stroke")||this._stroke)},extend:{x:function(t){return this.attr("x",t)},y:function(t){return this.attr("y",t)},cx:function(t){return null==t?this.x()+this.width()/2:this.x(t-this.width()/2)},cy:function(t){return null==t?this.y()+this.height()/2:this.y(t-this.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){var i=h(this.bbox(),t,e);return this.width(new v.Number(i.width)).height(new v.Number(i.height))},clone:function(t){var e=m(this.node.cloneNode(!0));return t?t.add(e):this.after(e),e},remove:function(){return this.parent()&&this.parent().removeElement(this),this},replace:function(t){return this.after(t).remove(),t},addTo:function(t){return t.put(this)},putIn:function(t){return t.add(this)},id:function(t){return this.attr("id",t)},inside:function(t,e){var i=this.bbox();return t>i.x&&e>i.y&&t/,"").replace(/<\/svg>$/,"");i.innerHTML=""+t.replace(/\n/,"").replace(/<(\w+)([^<]+?)\/>/g,"<$1$2>")+"";for(var n=0,r=i.firstChild.childNodes.length;r>n;n++)this.node.appendChild(i.firstChild.firstChild);return this},writeDataToDom:function(){if(this.each||this.lines){var t=this.each?this:this.lines();t.each(function(){this.writeDataToDom()})}return this.node.removeAttribute("svgjs:data"),Object.keys(this.dom).length&&this.node.setAttribute("svgjs:data",JSON.stringify(this.dom)),this},setData:function(t){return this.dom=t,this},is:function(t){return i(this,t)}}}),v.easing={"-":function(t){return t},"<>":function(t){return-Math.cos(t*Math.PI)/2+.5},">":function(t){return Math.sin(t*Math.PI/2)},"<":function(t){return-Math.cos(t*Math.PI/2)+1}},v.morph=function(t){return function(e,i){return new v.MorphObj(e,i).at(t)}},v.Situation=v.invent({create:function(t){this.init=!1,this.reversed=!1,this.reversing=!1,this.duration=new v.Number(t.duration).valueOf(),this.delay=new v.Number(t.delay).valueOf(),this.start=+new Date+this.delay,this.finish=this.start+this.duration,this.ease=t.ease,this.loop=!1,this.loops=!1,this.animations={},this.attrs={},this.styles={},this.transforms=[],this.once={}}}),v.Delay=function(t){this.delay=new v.Number(t).valueOf()},v.FX=v.invent({create:function(t){this._target=t,this.situations=[],this.active=!1,this.situation=null,this.paused=!1,this.lastPos=0,this.pos=0},extend:{animate:function(t,e,i){"object"==typeof t&&(e=t.ease,i=t.delay,t=t.duration);var n=new v.Situation({duration:t||1e3,delay:i||0,ease:v.easing[e||"-"]||e});return this.queue(n),this},delay:function(t){var t=new v.Delay(t);return this.queue(t)},target:function(t){return t&&t instanceof v.Element?(this._target=t,this):this._target},timeToPos:function(t){return(t-this.situation.start)/this.situation.duration},posToTime:function(t){return this.situation.duration*t+this.situation.start},startAnimFrame:function(){this.stopAnimFrame(),this.animationFrame=requestAnimationFrame(function(){this.step()}.bind(this))},stopAnimFrame:function(){cancelAnimationFrame(this.animationFrame)},start:function(){return!this.active&&this.situation&&(this.situation.start=+new Date+this.situation.delay,this.situation.finish=this.situation.start+this.situation.duration,this.initAnimations(),this.active=!0,this.startAnimFrame()),this},queue:function(t){return("function"==typeof t||t instanceof v.Situation||t instanceof v.Delay)&&this.situations.push(t),this.situation||(this.situation=this.situations.shift()),this},dequeue:function(){if(this.situation&&this.situation.stop&&this.situation.stop(),this.situation=this.situations.shift(),this.situation){var t=function(){this.situation instanceof v.Situation?this.initAnimations().at(0):this.situation instanceof v.Delay?this.dequeue():this.situation.call(this)}.bind(this);this.situation.delay?setTimeout(function(){t()},this.situation.delay):t()}return this},initAnimations:function(){var t,e=this.situation;if(e.init)return this;for(t in e.animations)"viewbox"==t?e.animations[t]=this.target().viewbox().morph(e.animations[t]):(e.animations[t].value="plot"==t?this.target().array().value:this.target()[t](),e.animations[t].value.value&&(e.animations[t].value=e.animations[t].value.value),e.animations[t].relative&&(e.animations[t].destination.value=e.animations[t].destination.value+e.animations[t].value));for(t in e.attrs)if(e.attrs[t]instanceof v.Color){var i=new v.Color(this.target().attr(t));e.attrs[t].r=i.r,e.attrs[t].g=i.g,e.attrs[t].b=i.b}else e.attrs[t].value=this.target().attr(t);for(t in e.styles)e.styles[t].value=this.target().style(t);return e.initialTransformation=this.target().matrixify(),e.init=!0,this},clearQueue:function(){return this.situations=[],this},clearCurrent:function(){return this.situation=null,this},stop:function(t,e){return this.active||this.start(),e&&this.clearQueue(),this.active=!1,t&&this.situation&&(this.situation.loop=!1,this.situation.loops%2==0&&this.situation.reversing&&(this.situation.reversed=!0),this.at(1)),this.stopAnimFrame(),clearTimeout(this.timeout),this.clearCurrent()},reset:function(){if(this.situation){var t=this.situation;this.stop(),this.situation=t,this.at(0)}return this},finish:function(){for(this.stop(!0,!1);this.dequeue().situation&&this.stop(!0,!1););return this.clearQueue().clearCurrent(),this},at:function(t){return this.pos=t,this.situation.start=+new Date-t*this.situation.duration,this.situation.finish=this.situation.start+this.situation.duration,this.step(!0)},speed:function(t){return this.situation.duration=this.situation.duration*this.pos+(1-this.pos)*this.situation.duration/t,this.situation.finish=this.situation.start+this.situation.duration,this.at(this.pos)},loop:function(t,e){return this.situation.loop=this.situation.loops=t||!0,e&&(this.last().reversing=!0),this},pause:function(){return this.paused=!0,this.stopAnimFrame(),clearTimeout(this.timeout),this},play:function(){return this.paused?(this.paused=!1,this.at(this.pos)):this},reverse:function(t){var e=this.last();return e.reversed="undefined"==typeof t?!e.reversed:t,this},progress:function(t){return t?this.situation.ease(this.pos):this.pos},after:function(t){var e=this.last(),i=function n(i){i.detail.situation==e&&(t.call(this,e),this.off("finished.fx",n))};return this.target().on("finished.fx",i),this},during:function(t){var e=this.last(),i=function(i){i.detail.situation==e&&t.call(this,i.detail.pos,v.morph(i.detail.pos),i.detail.eased,e)};return this.target().off("during.fx",i).on("during.fx",i),this.after(function(){this.off("during.fx",i)})},afterAll:function(t){var e=function i(){t.call(this),this.off("allfinished.fx",i)};return this.target().off("allfinished.fx",e).on("allfinished.fx",e),this},duringAll:function(t){var e=function(e){t.call(this,e.detail.pos,v.morph(e.detail.pos),e.detail.eased,e.detail.situation)};return this.target().off("during.fx",e).on("during.fx",e),this.afterAll(function(){this.off("during.fx",e)})},last:function(){return this.situations.length?this.situations[this.situations.length-1]:this.situation},add:function(t,e,i){return this.last()[i||"animations"][t]=e,setTimeout(function(){this.start()}.bind(this),0),this},step:function(t){if(t||(this.pos=this.timeToPos(+new Date)),this.pos>=1&&(this.situation.loop===!0||"number"==typeof this.situation.loop&&--this.situation.loop))return this.situation.reversing&&(this.situation.reversed=!this.situation.reversed),this.at(this.pos-1);this.situation.reversed&&(this.pos=1-this.pos),this.pos>1&&(this.pos=1),this.pos<0&&(this.pos=0);var e=this.situation.ease(this.pos);for(var i in this.situation.once)i>this.lastPos&&e>=i&&(this.situation.once[i].call(this.target(),this.pos,e),delete this.situation.once[i]);return this.active&&this.target().fire("during",{pos:this.pos,eased:e,fx:this,situation:this.situation}),this.situation?(this.eachAt(),1==this.pos&&!this.situation.reversed||this.situation.reversed&&0==this.pos?(this.stopAnimFrame(),this.target().fire("finished",{fx:this,situation:this.situation}),this.situations.length||(this.target().fire("allfinished"),this.target().off(".fx"),this.active=!1),this.active?this.dequeue():this.clearCurrent()):!this.paused&&this.active&&this.startAnimFrame(),this.lastPos=e,this):this},eachAt:function(){var t,e,i=this,n=this.target(),r=this.situation;for(t in r.animations)e=[].concat(r.animations[t]).map(function(t){return t.at?t.at(r.ease(i.pos),i.pos):t}),n[t].apply(n,e);for(t in r.attrs)e=[t].concat(r.attrs[t]).map(function(t){return t.at?t.at(r.ease(i.pos),i.pos):t}),n.attr.apply(n,e);for(t in r.styles)e=[t].concat(r.styles[t]).map(function(t){return t.at?t.at(r.ease(i.pos),i.pos):t}),n.style.apply(n,e);if(r.transforms.length){e=r.initialTransformation;for(t in r.transforms){var s=r.transforms[t];s instanceof v.Matrix?e=s.relative?e.multiply(s.at(r.ease(this.pos))):e.morph(s).at(r.ease(this.pos)):(s.relative||s.undo(e.extract()),e=e.multiply(s.at(r.ease(this.pos))))}n.matrix(e)}return this},once:function(t,e,i){return i||(t=this.situation.ease(t)),this.situation.once[t]=e,this}},parent:v.Element,construct:{animate:function(t,e,i){return(this.fx||(this.fx=new v.FX(this))).animate(t,e,i)},delay:function(t){return(this.fx||(this.fx=new v.FX(this))).delay(t)},stop:function(t,e){return this.fx&&this.fx.stop(t,e),this},finish:function(){return this.fx&&this.fx.finish(),this},pause:function(){return this.fx&&this.fx.pause(),this},play:function(){return this.fx&&this.fx.play(),this}}}),v.MorphObj=v.invent({create:function(t,e){return v.Color.isColor(e)?new v.Color(t).morph(e):v.regex.numberAndUnit.test(e)?new v.Number(t).morph(e):(this.value=0,this.destination=e,void 0)},extend:{at:function(t,e){return 1>e?this.value:this.destination},valueOf:function(){return this.value}}}),v.extend(v.FX,{attr:function(t,e){if("object"==typeof t)for(var i in t)this.attr(i,t[i]);else this.add(t,new v.MorphObj(null,e),"attrs");return this},style:function(t,e){if("object"==typeof t)for(var i in t)this.style(i,t[i]);else this.add(t,new v.MorphObj(null,e),"styles");return this},x:function(t,e){if(this.target()instanceof v.G)return this.transform({x:t},e),this;var i=(new v.Number).morph(t);return i.relative=e,this.add("x",i)},y:function(t,e){if(this.target()instanceof v.G)return this.transform({y:t},e),this;var i=(new v.Number).morph(t);return i.relative=e,this.add("y",i)},cx:function(t){return this.add("cx",(new v.Number).morph(t))},cy:function(t){return this.add("cy",(new v.Number).morph(t))},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 v.Text)this.attr("font-size",t);else{var i;t&&e||(i=this.target().bbox()),t||(t=i.width/i.height*e),e||(e=i.height/i.width*t),this.add("width",(new v.Number).morph(t)).add("height",(new v.Number).morph(e))}return this},plot:function(t){return this.add("plot",this.target().array().morph(t))},leading:function(t){return this.target().leading?this.add("leading",(new v.Number).morph(t)):this},viewbox:function(t,e,i,n){return this.target()instanceof v.Container&&this.add("viewbox",new v.ViewBox(t,e,i,n)),this},update:function(t){if(this.target()instanceof v.Stop){if("number"==typeof t||t instanceof v.Number)return this.update({offset:arguments[0],color:arguments[1],opacity:arguments[2]});null!=t.opacity&&this.attr("stop-opacity",t.opacity),null!=t.color&&this.attr("stop-color",t.color),null!=t.offset&&this.attr("offset",t.offset)}return this}}),v.BBox=v.invent({create:function(t){if(t){var i;try{if(!e.contains(t.node))throw new Exception("Element not in the dom");i=t.node.getBBox()}catch(n){if(t instanceof v.Shape){var r=t.clone(v.parser.draw);i=r.bbox(),r.remove()}else i={x:t.node.clientLeft,y:t.node.clientTop,width:t.node.clientWidth,height:t.node.clientHeight}}this.x=i.x,this.y=i.y,this.width=i.width,this.height=i.height}x(this)},parent:v.Element,construct:{bbox:function(){return new v.BBox(this)}}}),v.TBox=v.invent({create:function(t){if(t){var e=t.ctm().extract(),i=t.bbox();this.width=i.width*e.scaleX,this.height=i.height*e.scaleY,this.x=i.x+e.x,this.y=i.y+e.y}x(this)},parent:v.Element,construct:{tbox:function(){return new v.TBox(this)}}}),v.RBox=v.invent({create:function(e){if(e){var i=e.doc().parent(),n=e.node.getBoundingClientRect(),r=1;for(this.x=n.left,this.y=n.top,this.x-=i.offsetLeft,this.y-=i.offsetTop;i=i.offsetParent;)this.x-=i.offsetLeft,this.y-=i.offsetTop;for(i=e;i.parent&&(i=i.parent());)i.viewbox&&(r*=i.viewbox().zoom,this.x-=i.x()||0,this.y-=i.y()||0);this.width=n.width/=r,this.height=n.height/=r}x(this),this.x+=t.pageXOffset,this.y+=t.pageYOffset},parent:v.Element,construct:{rbox:function(){return new v.RBox(this)}}}),[v.BBox,v.TBox,v.RBox].forEach(function(t){v.extend(t,{merge:function(e){var i=new t;return i.x=Math.min(this.x,e.x),i.y=Math.min(this.y,e.y),i.width=Math.max(this.x+this.width,e.x+e.width)-i.x,i.height=Math.max(this.y+this.height,e.y+e.height)-i.y,x(i)}})}),v.Matrix=v.invent({create:function(t){var e,i=l([1,0,0,1,0,0]);for(t=t instanceof v.Element?t.matrixify():"string"==typeof t?d(t):6==arguments.length?l([].slice.call(arguments)):"object"==typeof t?t:i,e=w.length-1;e>=0;--e)this[w[e]]=t&&"number"==typeof t[w[e]]?t[w[e]]:i[w[e]]},extend:{extract:function(){var t=u(this,0,1),e=u(this,1,0),i=180/Math.PI*Math.atan2(t.y,t.x)-90;return{x:this.e,y:this.f,transformedX:(this.e*Math.cos(i*Math.PI/180)+this.f*Math.sin(i*Math.PI/180))/Math.sqrt(this.a*this.a+this.b*this.b),transformedY:(this.f*Math.cos(i*Math.PI/180)+this.e*Math.sin(-i*Math.PI/180))/Math.sqrt(this.c*this.c+this.d*this.d),skewX:-i,skewY:180/Math.PI*Math.atan2(e.y,e.x),scaleX:Math.sqrt(this.a*this.a+this.b*this.b),scaleY:Math.sqrt(this.c*this.c+this.d*this.d),rotation:i,a:this.a,b:this.b,c:this.c,d:this.d,e:this.e,f:this.f,matrix:new v.Matrix(this)}},clone:function(){return new v.Matrix(this)},morph:function(t){return this.destination=new v.Matrix(t),this},at:function(t){if(!this.destination)return this;var e=new v.Matrix({a:this.a+(this.destination.a-this.a)*t,b:this.b+(this.destination.b-this.b)*t,c:this.c+(this.destination.c-this.c)*t,d:this.d+(this.destination.d-this.d)*t,e:this.e+(this.destination.e-this.e)*t,f:this.f+(this.destination.f-this.f)*t});if(this.param&&this.param.to){var i={rotation:this.param.from.rotation+(this.param.to.rotation-this.param.from.rotation)*t,cx:this.param.from.cx,cy:this.param.from.cy};e=e.rotate((this.param.to.rotation-2*this.param.from.rotation)*t,i.cx,i.cy),e.param=i}return e},multiply:function(t){return new v.Matrix(this.native().multiply(c(t).native()))},inverse:function(){return new v.Matrix(this.native().inverse())},translate:function(t,e){return new v.Matrix(this.native().translate(t||0,e||0))},scale:function(t,e,i,n){return(1==arguments.length||3==arguments.length)&&(e=t),3==arguments.length&&(n=i,i=e),this.around(i,n,new v.Matrix(t,0,0,e,0,0))},rotate:function(t,e,i){return t=v.utils.radians(t),this.around(e,i,new v.Matrix(Math.cos(t),Math.sin(t),-Math.sin(t),Math.cos(t),0,0))},flip:function(t,e){return"x"==t?this.scale(-1,1,e,0):this.scale(1,-1,0,e)},skew:function(t,e,i,n){return this.around(i,n,this.native().skewX(t||0).skewY(e||0))},skewX:function(t,e,i){return this.around(e,i,this.native().skewX(t||0))},skewY:function(t,e,i){return this.around(e,i,this.native().skewY(t||0))},around:function(t,e,i){return this.multiply(new v.Matrix(1,0,0,1,t||0,e||0)).multiply(i).multiply(new v.Matrix(1,0,0,1,-t||0,-e||0))},"native":function(){for(var t=v.parser.native.createSVGMatrix(),e=w.length-1;e>=0;e--)t[w[e]]=this[w[e]];return t},toString:function(){return"matrix("+this.a+","+this.b+","+this.c+","+this.d+","+this.e+","+this.f+")"}},parent:v.Element,construct:{ctm:function(){return new v.Matrix(this.node.getCTM())},screenCTM:function(){return new v.Matrix(this.node.getScreenCTM())}}}),v.Point=v.invent({create:function(t,e){var i,n={x:0,y:0};i=Array.isArray(t)?{x:t[0],y:t[1]}:"object"==typeof t?{x:t.x,y:t.y}:null!=e?{x:t,y:e}:n,this.x=i.x,this.y=i.y},extend:{clone:function(){return new v.Point(this)},morph:function(t){return this.destination=new v.Point(t),this},at:function(t){if(!this.destination)return this;var e=new v.Point({x:this.x+(this.destination.x-this.x)*t,y:this.y+(this.destination.y-this.y)*t});return e},"native":function(){var t=v.parser.native.createSVGPoint();return t.x=this.x,t.y=this.y,t},transform:function(t){return new v.Point(this.native().matrixTransform(t.native()))}}}),v.extend(v.Element,{point:function(t,e){return new v.Point(t,e).transform(this.screenCTM().inverse())}}),v.extend(v.Element,{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]=v.regex.isNumber.test(e[i].nodeValue)?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 e=this.node.getAttribute(t),null==e?v.defaults.attrs[t]:v.regex.isNumber.test(e)?parseFloat(e):e;"stroke-width"==t?this.attr("stroke",parseFloat(e)>0?this._stroke:null):"stroke"==t&&(this._stroke=e),("fill"==t||"stroke"==t)&&(v.regex.isImage.test(e)&&(e=this.doc().defs().image(e,0,0)),e instanceof v.Image&&(e=this.doc().defs().pattern(0,0,function(){this.add(e)}))),"number"==typeof e?e=new v.Number(e):v.Color.isColor(e)?e=new v.Color(e):Array.isArray(e)?e=new v.Array(e):e instanceof v.Matrix&&e.param&&(this.param=e.param),"leading"==t?this.leading&&this.leading(e):"string"==typeof i?this.node.setAttributeNS(i,t,e.toString()):this.node.setAttribute(t,e.toString()),!this.rebuild||"font-size"!=t&&"x"!=t||this.rebuild(t,e)}return this}}),v.extend(v.Element,{transform:function(t,e){var i,n=this;if("object"!=typeof t)return i=new v.Matrix(n).extract(),"string"==typeof t?i[t]:i;if(i=new v.Matrix(n),e=!!e||!!t.relative,null!=t.a)i=e?i.multiply(new v.Matrix(t)):new v.Matrix(t); 2 | else if(null!=t.rotation)f(t,n),i=e?i.rotate(t.rotation,t.cx,t.cy):i.rotate(t.rotation-i.extract().rotation,t.cx,t.cy);else if(null!=t.scale||null!=t.scaleX||null!=t.scaleY){if(f(t,n),t.scaleX=null!=t.scale?t.scale:null!=t.scaleX?t.scaleX:1,t.scaleY=null!=t.scale?t.scale:null!=t.scaleY?t.scaleY:1,!e){var r=i.extract();t.scaleX=1*t.scaleX/r.scaleX,t.scaleY=1*t.scaleY/r.scaleY}i=i.scale(t.scaleX,t.scaleY,t.cx,t.cy)}else if(null!=t.skewX||null!=t.skewY){if(f(t,n),t.skewX=null!=t.skewX?t.skewX:0,t.skewY=null!=t.skewY?t.skewY:0,!e){var r=i.extract();i=i.multiply((new v.Matrix).skew(r.skewX,r.skewY,t.cx,t.cy).inverse())}i=i.skew(t.skewX,t.skewY,t.cx,t.cy)}else t.flip?i=i.flip(t.flip,null==t.offset?n.bbox()["c"+t.flip]:t.offset):(null!=t.x||null!=t.y)&&(e?i=i.translate(t.x,t.y):(null!=t.x&&(i.e=t.x),null!=t.y&&(i.f=t.y)));return this.attr("transform",i)}}),v.extend(v.FX,{transform:function(t,e){var i,n=this.target();return"object"!=typeof t?(i=new v.Matrix(n).extract(),"string"==typeof t?i[t]:i):(e=!!e||!!t.relative,null!=t.a?i=new v.Matrix(t):null!=t.rotation?(f(t,n),i=new v.Rotate(t.rotation,t.cx,t.cy)):null!=t.scale||null!=t.scaleX||null!=t.scaleY?(f(t,n),t.scaleX=null!=t.scale?t.scale:null!=t.scaleX?t.scaleX:1,t.scaleY=null!=t.scale?t.scale:null!=t.scaleY?t.scaleY:1,i=new v.Scale(t.scaleX,t.scaleY,t.cx,t.cy)):null!=t.skewX||null!=t.skewY?(f(t,n),t.skewX=null!=t.skewX?t.skewX:0,t.skewY=null!=t.skewY?t.skewY:0,i=new v.Skew(t.skewX,t.skewY,t.cx,t.cy)):t.flip?i=(new v.Matrix).morph((new v.Matrix).flip(t.flip,null==t.offset?n.bbox()["c"+t.flip]:t.offset)):(null!=t.x||null!=t.y)&&(i=new v.Translate(t.x,t.y)),i?(i.relative=e,this.last().transforms.push(i),setTimeout(function(){this.start()}.bind(this),0),this):this)}}),v.extend(v.Element,{untransform:function(){return this.attr("transform",null)},matrixify:function(){var t=(this.attr("transform")||"").split(/\)\s*/).slice(0,-1).map(function(t){var e=t.trim().split("(");return[e[0],e[1].split(v.regex.matrixElements).map(function(t){return parseFloat(t)})]}).reduce(function(t,e){return"matrix"==e[0]?t.multiply(l(e[1])):t[e[0]].apply(t,e[1])},new v.Matrix);return t},toParent:function(t){if(this==t)return this;var e=this.screenCTM(),i=t.rect(1,1),n=i.screenCTM().inverse();return i.remove(),this.addTo(t).untransform().transform(n.multiply(e)),this},toDoc:function(){return this.toParent(this.doc())}}),v.Transformation=v.invent({create:function(t,e){if(arguments.length>1&&"boolean"!=typeof e)return this.create([].slice.call(arguments));if("object"==typeof t)for(var i=0,n=this.arguments.length;n>i;++i)this[this.arguments[i]]=t[this.arguments[i]];if(Array.isArray(t))for(var i=0,n=this.arguments.length;n>i;++i)this[this.arguments[i]]=t[i];this.inversed=!1,e===!0&&(this.inversed=!0)},extend:{at:function(t){for(var e=[],i=0,n=this.arguments.length;n>i;++i)e.push(this[this.arguments[i]]);var r=this._undo||new v.Matrix;return r=(new v.Matrix).morph(v.Matrix.prototype[this.method].apply(r,e)).at(t),this.inversed?r.inverse():r},undo:function(t){return this._undo=new(v[s(this.method)])(t,!0).at(1),this}}}),v.Translate=v.invent({parent:v.Matrix,inherit:v.Transformation,create:function(t,e){"object"==typeof t?this.constructor.call(this,t,e):this.constructor.call(this,[].slice.call(arguments))},extend:{arguments:["transformedX","transformedY"],method:"translate"}}),v.Rotate=v.invent({parent:v.Matrix,inherit:v.Transformation,create:function(t,e){"object"==typeof t?this.constructor.call(this,t,e):this.constructor.call(this,[].slice.call(arguments))},extend:{arguments:["rotation","cx","cy"],method:"rotate",at:function(t){var e=(new v.Matrix).rotate((new v.Number).morph(this.rotation-(this._undo?this._undo.rotation:0)).at(t),this.cx,this.cy);return this.inversed?e.inverse():e},undo:function(t){this._undo=t}}}),v.Scale=v.invent({parent:v.Matrix,inherit:v.Transformation,create:function(t,e){"object"==typeof t?this.constructor.call(this,t,e):this.constructor.call(this,[].slice.call(arguments))},extend:{arguments:["scaleX","scaleY","cx","cy"],method:"scale"}}),v.Skew=v.invent({parent:v.Matrix,inherit:v.Transformation,create:function(t,e){"object"==typeof t?this.constructor.call(this,t,e):this.constructor.call(this,[].slice.call(arguments))},extend:{arguments:["skewX","skewY","cx","cy"],method:"skew"}}),v.extend(v.Element,{style:function(t,e){if(0==arguments.length)return this.node.style.cssText||"";if(arguments.length<2)if("object"==typeof t)for(e in t)this.style(e,t[e]);else{if(!v.regex.isCss.test(t))return this.node.style[r(t)];t=t.split(";");for(var i=0;i=0},index:function(t){return this.children().indexOf(t)},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 v.Element&&t.apply(r[i],[i,r]),e&&r[i]instanceof v.Container&&r[i].each(t,e);return this},removeElement:function(t){return this.node.removeChild(t.node),this},clear:function(){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return delete this._defs,this},defs:function(){return this.doc().defs()}}}),v.extend(v.Parent,{ungroup:function(t,e){return 0===e||this instanceof v.Defs?this:(t=t||(this instanceof v.Doc?this:this.parent(v.Parent)),e=e||1/0,this.each(function(){return this instanceof v.Defs?this:this instanceof v.Parent?this.ungroup(t,e-1):this.toParent(t)}),this.node.firstChild||this.remove(),this)},flatten:function(t,e){return this.ungroup(t,e)}}),v.Container=v.invent({create:function(t){this.constructor.call(this,t)},inherit:v.Parent}),v.ViewBox=v.invent({create:function(t){var e,i,n,r,s,a,o,h,u=[0,0,0,0],l=1,c=1,f=/[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?/gi;if(t instanceof v.Element){for(o=t,h=t,a=(t.attr("viewBox")||"").match(f),s=t.bbox,n=new v.Number(t.width()),r=new v.Number(t.height());"%"==n.unit;)l*=n.value,n=new v.Number(o instanceof v.Doc?o.parent().offsetWidth:o.parent().width()),o=o.parent();for(;"%"==r.unit;)c*=r.value,r=new v.Number(h instanceof v.Doc?h.parent().offsetHeight:h.parent().height()),h=h.parent();this.x=0,this.y=0,this.width=n*l,this.height=r*c,this.zoom=1,a&&(e=parseFloat(a[0]),i=parseFloat(a[1]),n=parseFloat(a[2]),r=parseFloat(a[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)}else t="string"==typeof t?t.match(f).map(function(t){return parseFloat(t)}):Array.isArray(t)?t:"object"==typeof t?[t.x,t.y,t.width,t.height]:4==arguments.length?[].slice.call(arguments):u,this.x=t[0],this.y=t[1],this.width=t[2],this.height=t[3]},extend:{toString:function(){return this.x+" "+this.y+" "+this.width+" "+this.height},morph:function(t){var t=1==arguments.length?[t.x,t.y,t.width,t.height]:[].slice.call(arguments);return this.destination=new v.ViewBox(t),this},at:function(t){return this.destination?new v.ViewBox([this.x+(this.destination.x-this.x)*t,this.y+(this.destination.y-this.y)*t,this.width+(this.destination.width-this.width)*t,this.height+(this.destination.height-this.height)*t]):this}},parent:v.Container,construct:{viewbox:function(t){return 0==arguments.length?new v.ViewBox(this):(t=1==arguments.length?[t.x,t.y,t.width,t.height]:[].slice.call(arguments),this.attr("viewBox",t))}}}),["click","dblclick","mousedown","mouseup","mouseover","mouseout","mousemove","touchstart","touchmove","touchleave","touchend","touchcancel"].forEach(function(t){v.Element.prototype[t]=function(e){var i=this;return this.node["on"+t]="function"==typeof e?function(){return e.apply(i,arguments)}:null,this}}),v.listeners=[],v.handlerMap=[],v.listenerId=0,v.on=function(t,e,i,n){var r=i.bind(n||t.instance||t),s=(v.handlerMap.indexOf(t)+1||v.handlerMap.push(t))-1,a=e.split(".")[0],o=e.split(".")[1]||"*";v.listeners[s]=v.listeners[s]||{},v.listeners[s][a]=v.listeners[s][a]||{},v.listeners[s][a][o]=v.listeners[s][a][o]||{},i._svgjsListenerId||(i._svgjsListenerId=++v.listenerId),v.listeners[s][a][o][i._svgjsListenerId]=r,t.addEventListener(a,r,!1)},v.off=function(t,e,i){var n=v.handlerMap.indexOf(t),r=e&&e.split(".")[0],s=e&&e.split(".")[1];if(-1!=n)if(i){if("function"==typeof i&&(i=i._svgjsListenerId),!i)return;v.listeners[n][r]&&v.listeners[n][r][s||"*"]&&(t.removeEventListener(r,v.listeners[n][r][s||"*"][i],!1),delete v.listeners[n][r][s||"*"][i])}else if(s&&r){if(v.listeners[n][r]&&v.listeners[n][r][s]){for(i in v.listeners[n][r][s])v.off(t,[r,s].join("."),i);delete v.listeners[n][r][s]}}else if(s)for(e in v.listeners[n])for(namespace in v.listeners[n][e])s===namespace&&v.off(t,[e,s].join("."));else if(r){if(v.listeners[n][r]){for(namespace in v.listeners[n][r])v.off(t,[r,namespace].join("."));delete v.listeners[n][r]}}else{for(e in v.listeners[n])v.off(t,e);delete v.listeners[n]}},v.extend(v.Element,{on:function(t,e,i){return v.on(this.node,t,e,i),this},off:function(t,e){return v.off(this.node,t,e),this},fire:function(t,e){return t instanceof Event?this.node.dispatchEvent(t):this.node.dispatchEvent(new b(t,{detail:e})),this}}),v.Defs=v.invent({create:"defs",inherit:v.Container}),v.G=v.invent({create:"g",inherit:v.Container,extend:{x:function(t){return null==t?this.transform("x"):this.transform({x:t-this.x()},!0)},y:function(t){return null==t?this.transform("y"):this.transform({y:t-this.y()},!0)},cx:function(t){return null==t?this.gbox().cx:this.x(t-this.gbox().width/2)},cy:function(t){return null==t?this.gbox().cy:this.y(t-this.gbox().height/2)},gbox:function(){var t=this.bbox(),e=this.transform();return t.x+=e.x,t.x2+=e.x,t.cx+=e.x,t.y+=e.y,t.y2+=e.y,t.cy+=e.y,t}},construct:{group:function(){return this.put(new v.G)}}}),v.extend(v.Element,{siblings:function(){return this.parent().children()},position:function(){return this.parent().index(this)},next:function(){return this.siblings()[this.position()+1]},previous:function(){return this.siblings()[this.position()-1]},forward:function(){var t=this.position()+1,e=this.parent();return e.removeElement(this).add(this,t),e instanceof v.Doc&&e.node.appendChild(e.defs().node),this},backward:function(){var t=this.position();return t>0&&this.parent().removeElement(this).add(this,t-1),this},front:function(){var t=this.parent();return t.node.appendChild(this.node),t instanceof v.Doc&&t.node.appendChild(t.defs().node),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}}),v.Mask=v.invent({create:function(){this.constructor.call(this,v.create("mask")),this.targets=[]},inherit:v.Container,extend:{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unmask();return this.targets=[],this.parent().removeElement(this),this}},construct:{mask:function(){return this.defs().put(new v.Mask)}}}),v.extend(v.Element,{maskWith:function(t){return this.masker=t instanceof v.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)}}),v.ClipPath=v.invent({create:function(){this.constructor.call(this,v.create("clipPath")),this.targets=[]},inherit:v.Container,extend:{remove:function(){for(var t=this.targets.length-1;t>=0;t--)this.targets[t]&&this.targets[t].unclip();return this.targets=[],this.parent().removeElement(this),this}},construct:{clip:function(){return this.defs().put(new v.ClipPath)}}}),v.extend(v.Element,{clipWith:function(t){return this.clipper=t instanceof v.ClipPath?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)}}),v.Gradient=v.invent({create:function(t){this.constructor.call(this,v.create(t+"Gradient")),this.type=t},inherit:v.Container,extend:{at:function(t,e,i){return this.put(new v.Stop).update(t,e,i)},update:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this},fill:function(){return"url(#"+this.id()+")"},toString:function(){return this.fill()},attr:function(t,e,i){return"transform"==t&&(t="gradientTransform"),v.Container.prototype.attr.call(this,t,e,i)}},construct:{gradient:function(t,e){return this.defs().gradient(t,e)}}}),v.extend(v.Gradient,v.FX,{from:function(t,e){return"radial"==(this._target||this).type?this.attr({fx:new v.Number(t),fy:new v.Number(e)}):this.attr({x1:new v.Number(t),y1:new v.Number(e)})},to:function(t,e){return"radial"==(this._target||this).type?this.attr({cx:new v.Number(t),cy:new v.Number(e)}):this.attr({x2:new v.Number(t),y2:new v.Number(e)})}}),v.extend(v.Defs,{gradient:function(t,e){return this.put(new v.Gradient(t)).update(e)}}),v.Stop=v.invent({create:"stop",inherit:v.Element,extend:{update:function(t){return("number"==typeof t||t instanceof v.Number)&&(t={offset:arguments[0],color:arguments[1],opacity:arguments[2]}),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 v.Number(t.offset)),this}}}),v.Pattern=v.invent({create:"pattern",inherit:v.Container,extend:{fill:function(){return"url(#"+this.id()+")"},update:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this},toString:function(){return this.fill()},attr:function(t,e,i){return"transform"==t&&(t="patternTransform"),v.Container.prototype.attr.call(this,t,e,i)}},construct:{pattern:function(t,e,i){return this.defs().pattern(t,e,i)}}}),v.extend(v.Defs,{pattern:function(t,e,i){return this.put(new v.Pattern).update(i).attr({x:0,y:0,width:t,height:e,patternUnits:"userSpaceOnUse"})}}),v.Doc=v.invent({create:function(t){t&&(t="string"==typeof t?e.getElementById(t):t,"svg"==t.nodeName?this.constructor.call(this,t):(this.constructor.call(this,v.create("svg")),t.appendChild(this.node),this.size("100%","100%")),this.namespace().defs())},inherit:v.Container,extend:{namespace:function(){return this.attr({xmlns:v.ns,version:"1.1"}).attr("xmlns:xlink",v.xlink,v.xmlns).attr("xmlns:svgjs",v.svgjs,v.xmlns)},defs:function(){if(!this._defs){var t;this._defs=(t=this.node.getElementsByTagName("defs")[0])?v.adopt(t):new v.Defs,this.node.appendChild(this._defs.node)}return this._defs},parent:function(){return"#document"==this.node.parentNode.nodeName?null:this.node.parentNode},spof:function(){var t=this.node.getScreenCTM();return t&&this.style("left",-t.e%1+"px").style("top",-t.f%1+"px"),this},remove:function(){return this.parent()&&this.parent().removeChild(this.node),this}}}),v.Shape=v.invent({create:function(t){this.constructor.call(this,t)},inherit:v.Element}),v.Bare=v.invent({create:function(t,e){if(this.constructor.call(this,v.create(t)),e)for(var i in e.prototype)"function"==typeof e.prototype[i]&&(this[i]=e.prototype[i])},inherit:v.Element,extend:{words:function(t){for(;this.node.hasChildNodes();)this.node.removeChild(this.node.lastChild);return this.node.appendChild(e.createTextNode(t)),this}}}),v.extend(v.Parent,{element:function(t,e){return this.put(new v.Bare(t,e))},symbol:function(){return this.defs().element("symbol",v.Container)}}),v.Use=v.invent({create:"use",inherit:v.Shape,extend:{element:function(t,e){return this.attr("href",(e||"")+"#"+t,v.xlink)}},construct:{use:function(t,e){return this.put(new v.Use).element(t,e)}}}),v.Rect=v.invent({create:"rect",inherit:v.Shape,construct:{rect:function(t,e){return this.put(new v.Rect).size(t,e)}}}),v.Circle=v.invent({create:"circle",inherit:v.Shape,construct:{circle:function(t){return this.put(new v.Circle).rx(new v.Number(t).divide(2)).move(0,0)}}}),v.extend(v.Circle,v.FX,{rx:function(t){return this.attr("r",t)},ry:function(t){return this.rx(t)}}),v.Ellipse=v.invent({create:"ellipse",inherit:v.Shape,construct:{ellipse:function(t,e){return this.put(new v.Ellipse).size(t,e).move(0,0)}}}),v.extend(v.Ellipse,v.Rect,v.FX,{rx:function(t){return this.attr("rx",t)},ry:function(t){return this.attr("ry",t)}}),v.extend(v.Circle,v.Ellipse,{x:function(t){return null==t?this.cx()-this.rx():this.cx(t+this.rx())},y:function(t){return null==t?this.cy()-this.ry():this.cy(t+this.ry())},cx:function(t){return null==t?this.attr("cx"):this.attr("cx",t)},cy:function(t){return null==t?this.attr("cy"):this.attr("cy",t)},width:function(t){return null==t?2*this.rx():this.rx(new v.Number(t).divide(2))},height:function(t){return null==t?2*this.ry():this.ry(new v.Number(t).divide(2))},size:function(t,e){var i=h(this.bbox(),t,e);return this.rx(new v.Number(i.width).divide(2)).ry(new v.Number(i.height).divide(2))}}),v.Line=v.invent({create:"line",inherit:v.Shape,extend:{array:function(){return new v.PointArray([[this.attr("x1"),this.attr("y1")],[this.attr("x2"),this.attr("y2")]])},plot:function(t,e,i,n){return t=4==arguments.length?{x1:t,y1:e,x2:i,y2:n}:new v.PointArray(t).toLine(),this.attr(t)},move:function(t,e){return this.attr(this.array().move(t,e).toLine())},size:function(t,e){var i=h(this.bbox(),t,e);return this.attr(this.array().size(i.width,i.height).toLine())}},construct:{line:function(t,e,i,n){return this.put(new v.Line).plot(t,e,i,n)}}}),v.Polyline=v.invent({create:"polyline",inherit:v.Shape,construct:{polyline:function(t){return this.put(new v.Polyline).plot(t)}}}),v.Polygon=v.invent({create:"polygon",inherit:v.Shape,construct:{polygon:function(t){return this.put(new v.Polygon).plot(t)}}}),v.extend(v.Polyline,v.Polygon,{array:function(){return this._array||(this._array=new v.PointArray(this.attr("points")))},plot:function(t){return this.attr("points",this._array=new v.PointArray(t))},move:function(t,e){return this.attr("points",this.array().move(t,e))},size:function(t,e){var i=h(this.bbox(),t,e);return this.attr("points",this.array().size(i.width,i.height))}}),v.extend(v.Line,v.Polyline,v.Polygon,{morphArray:v.PointArray,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)}}),v.Path=v.invent({create:"path",inherit:v.Shape,extend:{morphArray:v.PathArray,array:function(){return this._array||(this._array=new v.PathArray(this.attr("d")))},plot:function(t){return this.attr("d",this._array=new v.PathArray(t))},move:function(t,e){return this.attr("d",this.array().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){var i=h(this.bbox(),t,e);return this.attr("d",this.array().size(i.width,i.height))},width:function(t){return null==t?this.bbox().width:this.size(t,this.bbox().height)},height:function(t){return null==t?this.bbox().height:this.size(this.bbox().width,t)}},construct:{path:function(t){return this.put(new v.Path).plot(t)}}}),v.Image=v.invent({create:"image",inherit:v.Shape,extend:{load:function(t){if(!t)return this;var i=this,n=e.createElement("img");return n.onload=function(){var e=i.parent(v.Pattern);null!==e&&(0==i.width()&&0==i.height()&&i.size(n.width,n.height),e&&0==e.width()&&0==e.height()&&e.size(i.width(),i.height()),"function"==typeof i._loaded&&i._loaded.call(i,{width:n.width,height:n.height,ratio:n.width/n.height,url:t}))},this.attr("href",n.src=this.src=t,v.xlink)},loaded:function(t){return this._loaded=t,this}},construct:{image:function(t,e,i){return this.put(new v.Image).load(t).size(e||0,i||e||0)}}}),v.Text=v.invent({create:function(){this.constructor.call(this,v.create("text")),this.dom.leading=new v.Number(1.3),this._rebuild=!0,this._build=!1,this.attr("font-family",v.defaults.attrs["font-family"])},inherit:v.Shape,extend:{clone:function(){var t=m(this.node.cloneNode(!0));return this.after(t),t},x:function(t){return null==t?this.attr("x"):(this.textPath||this.lines().each(function(){this.dom.newLined&&this.x(t)}),this.attr("x",t))},y:function(t){var e=this.attr("y"),i="number"==typeof e?e-this.bbox().y:0;return null==t?"number"==typeof e?e-i:e:this.attr("y","number"==typeof t?t+i: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)},text:function(t){if("undefined"==typeof t){for(var t="",e=this.node.childNodes,i=0,n=e.length;n>i;++i)0!=i&&3!=e[i].nodeType&&1==v.adopt(e[i]).dom.newLined&&(t+="\n"),t+=e[i].textContent;return t}if(this.clear().build(!0),"function"==typeof t)t.call(this,this);else{t=t.split("\n");for(var i=0,r=t.length;r>i;i++)this.tspan(t[i]).newLine()}return this.build(!1).rebuild()},size:function(t){return this.attr("font-size",t).rebuild()},leading:function(t){return null==t?this.dom.leading:(this.dom.leading=new v.Number(t),this.rebuild())},lines:function(){var t=(this.textPath&&this.textPath()||this).node,e=v.utils.map(v.utils.filterSVGElements(t.childNodes),function(t){return v.adopt(t)});return new v.Set(e)},rebuild:function(t){if("boolean"==typeof t&&(this._rebuild=t),this._rebuild){var e=this,i=0,n=this.dom.leading*new v.Number(this.attr("font-size"));this.lines().each(function(){this.dom.newLined&&(this.textPath||this.attr("x",e.attr("x")),"\n"==this.text()?i+=n:(this.attr("dy",n+i),i=0))}),this.fire("rebuild")}return this},build:function(t){return this._build=!!t,this},setData:function(t){return this.dom=t,this.dom.leading=new v.Number(t.leading||1.3),this}},construct:{text:function(t){return this.put(new v.Text).text(t)},plain:function(t){return this.put(new v.Text).plain(t)}}}),v.Tspan=v.invent({create:"tspan",inherit:v.Shape,extend:{text:function(t){return null==t?this.node.textContent+(this.dom.newLined?"\n":""):("function"==typeof t?t.call(this,this):this.plain(t),this)},dx:function(t){return this.attr("dx",t)},dy:function(t){return this.attr("dy",t)},newLine:function(){var t=this.parent(v.Text);return this.dom.newLined=!0,this.dy(t.dom.leading*t.attr("font-size")).attr("x",t.x())}}}),v.extend(v.Text,v.Tspan,{plain:function(t){return this._build===!1&&this.clear(),this.node.appendChild(e.createTextNode(t)),this},tspan:function(t){var e=(this.textPath&&this.textPath()||this).node,i=new v.Tspan;return this._build===!1&&this.clear(),e.appendChild(i.node),i.text(t)},clear:function(){for(var t=(this.textPath&&this.textPath()||this).node;t.hasChildNodes();)t.removeChild(t.lastChild);return this},length:function(){return this.node.getComputedTextLength()}}),v.TextPath=v.invent({create:"textPath",inherit:v.Parent,parent:v.Text,construct:{path:function(t){for(var e=new v.TextPath,i=this.doc().defs().path(t);this.node.hasChildNodes();)e.node.appendChild(this.node.firstChild);return this.node.appendChild(e.node),e.attr("href","#"+i,v.xlink),this},plot:function(t){var e=this.track();return e&&e.plot(t),this},track:function(){var t=this.textPath();return t?t.reference("href"):void 0},textPath:function(){return this.node.firstChild&&"textPath"==this.node.firstChild.nodeName?v.adopt(this.node.firstChild):void 0}}}),v.Nested=v.invent({create:function(){this.constructor.call(this,v.create("svg")),this.style("overflow","visible")},inherit:v.Container,construct:{nested:function(){return this.put(new v.Nested)}}}),v.A=v.invent({create:"a",inherit:v.Container,extend:{to:function(t){return this.attr("href",t,v.xlink)},show:function(t){return this.attr("show",t,v.xlink)},target:function(t){return this.attr("target",t)}},construct:{link:function(t){return this.put(new v.A).to(t)}}}),v.extend(v.Element,{linkTo:function(t){var e=new v.A;return"function"==typeof t?t.call(e,e):e.to(t),this.parent().put(e).put(this)}}),v.Marker=v.invent({create:"marker",inherit:v.Container,extend:{width:function(t){return this.attr("markerWidth",t)},height:function(t){return this.attr("markerHeight",t)},ref:function(t,e){return this.attr("refX",t).attr("refY",e)},update:function(t){return this.clear(),"function"==typeof t&&t.call(this,this),this},toString:function(){return"url(#"+this.id()+")"}},construct:{marker:function(t,e,i){return this.defs().marker(t,e,i)}}}),v.extend(v.Defs,{marker:function(t,e,i){return this.put(new v.Marker).size(t,e).ref(t/2,e/2).viewbox(0,0,t,e).attr("orient","auto").update(i)}}),v.extend(v.Line,v.Polyline,v.Polygon,v.Path,{marker:function(t,e,i,n){var r=["marker"];return"all"!=t&&r.push(t),r=r.join("-"),t=arguments[1]instanceof v.Marker?arguments[1]:this.doc().marker(e,i,n),this.attr(r,t)}});var y={stroke:["color","width","opacity","linecap","linejoin","miterlimit","dasharray","dashoffset"],fill:["color","opacity","rule"],prefix:function(t,e){return"color"==e?t:t+"-"+e}};["fill","stroke"].forEach(function(t){var e,i={};i[t]=function(i){if("string"==typeof i||v.Color.isRgb(i)||i&&"function"==typeof i.fill)this.attr(t,i);else for(e=y[t].length-1;e>=0;e--)null!=i[y[t][e]]&&this.attr(y.prefix(t,y[t][e]),i[y[t][e]]);return this},v.extend(v.Element,v.FX,i)}),v.extend(v.Element,v.FX,{rotate:function(t,e,i){return this.transform({rotation:t,cx:e,cy:i})},skew:function(t,e,i,n){return this.transform({skewX:t,skewY:e,cx:i,cy:n})},scale:function(t,e,i,n){return 1==arguments.length||3==arguments.length?this.transform({scale:t,cx:e,cy:i}):this.transform({scaleX:t,scaleY:e,cx:i,cy:n})},translate:function(t,e){return this.transform({x:t,y:e})},flip:function(t,e){return this.transform({flip:t,offset:e})},matrix:function(t){return this.attr("transform",new v.Matrix(t))},opacity:function(t){return this.attr("opacity",t)},dx:function(t){return this.x((this instanceof v.FX?0:this.x())+t,!0)},dy:function(t){return this.y((this instanceof v.FX?0:this.y())+t,!0)},dmove:function(t,e){return this.dx(t).dy(e)}}),v.extend(v.Rect,v.Ellipse,v.Circle,v.Gradient,v.FX,{radius:function(t,e){var i=(this._target||this).type;return"radial"==i||"circle"==i?this.attr("r",new v.Number(t)):this.rx(t).ry(null==e?t:e)}}),v.extend(v.Path,{length:function(){return this.node.getTotalLength()},pointAt:function(t){return this.node.getPointAtLength(t)}}),v.extend(v.Parent,v.Text,v.FX,{font:function(t){for(var e in t)"leading"==e?this.leading(t[e]):"anchor"==e?this.attr("text-anchor",t[e]):"size"==e||"family"==e||"weight"==e||"stretch"==e||"variant"==e||"style"==e?this.attr("font-"+e,t[e]):this.attr(e,t[e]);return this}}),v.Set=v.invent({create:function(t){Array.isArray(t)?this.members=t:this.clear()},extend:{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.index(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},length:function(){return this.members.length},has:function(t){return this.index(t)>=0},index:function(t){return this.members.indexOf(t)},get:function(t){return this.members[t]},first:function(){return this.get(0)},last:function(){return this.get(this.members.length-1)},valueOf:function(){return this.members},bbox:function(){var t=new v.BBox;if(0==this.members.length)return t;var e=this.members[0].rbox();return t.x=e.x,t.y=e.y,t.width=e.width,t.height=e.height,this.each(function(){t=t.merge(this.rbox())}),t}},construct:{set:function(t){return new v.Set(t)}}}),v.FX.Set=v.invent({create:function(t){this.set=t}}),v.Set.inherit=function(){var t,e=[];for(var t in v.Shape.prototype)"function"==typeof v.Shape.prototype[t]&&"function"!=typeof v.Set.prototype[t]&&e.push(t);e.forEach(function(t){v.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 v.FX.Set(this)):this}}),e=[];for(var t in v.FX.prototype)"function"==typeof v.FX.prototype[t]&&"function"!=typeof v.FX.Set.prototype[t]&&e.push(t);e.forEach(function(t){v.FX.Set.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}})},v.extend(v.Element,{data:function(t,e,i){if("object"==typeof t)for(e in t)this.data(e,t[e]);else 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}}),v.extend(v.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={})}}),v.get=function(t){var i=e.getElementById(g(t)||t);return v.adopt(i)},v.select=function(t,i){return new v.Set(v.utils.map((i||e).querySelectorAll(t),function(t){return v.adopt(t)}))},v.extend(v.Parent,{select:function(t){return v.select(t,this.node)}});var w="abcdef".split("");if("function"!=typeof b){var b=function(t,i){i=i||{bubbles:!1,cancelable:!1,detail:void 0};var n=e.createEvent("CustomEvent");return n.initCustomEvent(t,i.bubbles,i.cancelable,i.detail),n};b.prototype=t.Event.prototype,t.CustomEvent=b}return function(e){for(var i=0,n=["moz","webkit"],r=0;r