rgraph-rails 4.64 → 4.67
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +10 -8
- data/lib/rgraph-rails/version.rb +1 -1
- data/vendor/assets/javascripts/RGraph.bar.js +1 -1
- data/vendor/assets/javascripts/RGraph.bipolar.js +11 -11
- data/vendor/assets/javascripts/RGraph.common.dynamic.js +8 -6
- data/vendor/assets/javascripts/RGraph.common.sheets.js +6 -4
- data/vendor/assets/javascripts/RGraph.drawing.background.js +1 -1
- data/vendor/assets/javascripts/RGraph.drawing.marker1.js +1 -1
- data/vendor/assets/javascripts/RGraph.drawing.marker2.js +1 -1
- data/vendor/assets/javascripts/RGraph.drawing.marker3.js +1 -1
- data/vendor/assets/javascripts/RGraph.drawing.poly.js +4 -6
- data/vendor/assets/javascripts/RGraph.drawing.text.js +1 -1
- data/vendor/assets/javascripts/RGraph.drawing.xaxis.js +1 -1
- data/vendor/assets/javascripts/RGraph.drawing.yaxis.js +1 -1
- data/vendor/assets/javascripts/RGraph.fuel.js +1 -1
- data/vendor/assets/javascripts/RGraph.funnel.js +1 -1
- data/vendor/assets/javascripts/RGraph.gantt.js +1 -1
- data/vendor/assets/javascripts/RGraph.gauge.js +8 -8
- data/vendor/assets/javascripts/RGraph.hbar.js +1 -1
- data/vendor/assets/javascripts/RGraph.hprogress.js +1 -1
- data/vendor/assets/javascripts/RGraph.line.js +1 -1
- data/vendor/assets/javascripts/RGraph.meter.js +4 -6
- data/vendor/assets/javascripts/RGraph.odo.js +1 -1
- data/vendor/assets/javascripts/RGraph.pie.js +1 -1
- data/vendor/assets/javascripts/RGraph.radar.js +1 -1
- data/vendor/assets/javascripts/RGraph.rose.js +1 -1
- data/vendor/assets/javascripts/RGraph.rscatter.js +1 -1
- data/vendor/assets/javascripts/RGraph.scatter.js +1 -1
- data/vendor/assets/javascripts/RGraph.semicircularprogress.js +1 -1
- data/vendor/assets/javascripts/RGraph.svg.bar.js +25 -16
- data/vendor/assets/javascripts/RGraph.svg.bipolar.js +104 -0
- data/vendor/assets/javascripts/RGraph.svg.common.core.js +73 -32
- data/vendor/assets/javascripts/RGraph.svg.common.key.js +4 -3
- data/vendor/assets/javascripts/RGraph.svg.common.sheets.js +6 -4
- data/vendor/assets/javascripts/RGraph.svg.common.tooltips.js +2 -1
- data/vendor/assets/javascripts/RGraph.svg.funnel.js +7 -7
- data/vendor/assets/javascripts/RGraph.svg.gauge.js +33 -0
- data/vendor/assets/javascripts/RGraph.svg.hbar.js +15 -12
- data/vendor/assets/javascripts/RGraph.svg.line.js +43 -29
- data/vendor/assets/javascripts/RGraph.svg.pie.js +15 -13
- data/vendor/assets/javascripts/RGraph.svg.radar.js +7 -7
- data/vendor/assets/javascripts/RGraph.svg.rose.js +13 -13
- data/vendor/assets/javascripts/RGraph.svg.scatter.js +14 -8
- data/vendor/assets/javascripts/RGraph.svg.semicircularprogress.js +7 -7
- data/vendor/assets/javascripts/RGraph.svg.waterfall.js +13 -10
- data/vendor/assets/javascripts/RGraph.thermometer.js +1 -1
- data/vendor/assets/javascripts/RGraph.vprogress.js +1 -1
- data/vendor/assets/javascripts/RGraph.waterfall.js +3 -3
- metadata +4 -2
@@ -3,9 +3,10 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};RGraph.SVG.HTML=
|
|
3
3
|
{var RG=RGraph,ua=navigator.userAgent,ma=Math;RG.SVG.drawKey=function(obj)
|
4
4
|
{var prop=obj.properties,key=prop.key,colors=prop.keyColors||prop.colors,defaultFont='Arial',blobSize=0,width=0,keyColorShape=prop.keyColorShape;var centerx=obj.svg.getAttribute('width')/2;if(obj.type==='funnel'){centerx=(obj.graphWidth/2)+prop.gutterLeft;}
|
5
5
|
if(key&&key.length){for(var i=0,length=0;i<key.length;i++){var textDimensions=RG.SVG.measureText({text:key[i],bold:prop.keyTextBold||false,font:prop.keyTextFont||prop.textFont||defaultFont,size:prop.keyTextSize||prop.textSize});blobSize=ma.max(blobSize,textDimensions[1]);width=width+10+blobSize+5+textDimensions[0];}
|
6
|
-
x=centerx-width/2;for(var i=0,y=prop.gutterTop-5;i<key.length;++i){
|
7
|
-
|
8
|
-
|
6
|
+
x=centerx-width/2;for(var i=0,y=prop.gutterTop-5;i<key.length;++i){if(i===0){if(obj.type==='pie'&&prop.highlightStyle=='outline'){y-=prop.highlightStyleOutlineWidth;}}
|
7
|
+
var textDimensions=RG.SVG.measureText({text:key[i],bold:prop.keyTextBold||false,font:prop.keyTextFont||prop.textFont||defaultFont,size:prop.keyTextSize||prop.textSize});var shape=prop.keyColorShape;if(typeof shape==='object'){shape=prop.keyColorShape[i];}
|
8
|
+
if(shape==='circle'){RG.SVG.create({svg:obj.svg,type:'circle',parent:obj.svg.all,attr:{cx:x+(blobSize/2)+prop.keyOffsetx,cy:y-(blobSize/2)+prop.keyOffsety,r:blobSize/2,fill:colors[i]}});}else if(shape==='triangle'){RG.SVG.create({svg:obj.svg,type:'path',parent:obj.svg.all,attr:{d:'M {1} {2} L {3} {4} L {5} {6} z'.format(x+prop.keyOffsetx+(blobSize/2),y-blobSize+prop.keyOffsety,x+prop.keyOffsetx+blobSize,y+prop.keyOffsety,x+prop.keyOffsetx,y+prop.keyOffsety),fill:colors[i]}});}else if(shape==='line'){RG.SVG.create({svg:obj.svg,type:'path',parent:obj.svg.all,attr:{d:'M {1} {2} L {3} {4}'.format(x+prop.keyOffsetx,y-(blobSize/2)+prop.keyOffsety,x+prop.keyOffsetx+blobSize,y-(blobSize/2)+prop.keyOffsety),stroke:colors[i],'stroke-width':2,'stroke-linecap':'round'}});}else if(shape==='dot'){RG.SVG.create({svg:obj.svg,type:'path',parent:obj.svg.all,attr:{d:'M {1} {2} L {3} {4}'.format(x+prop.keyOffsetx,y-(blobSize/2)+prop.keyOffsety,x+prop.keyOffsetx+blobSize,y-(blobSize/2)+prop.keyOffsety),stroke:colors[i],'stroke-width':2,'stroke-linecap':'round'}});RG.SVG.create({svg:obj.svg,type:'circle',parent:obj.svg.all,attr:{cx:x+(blobSize/2)+prop.keyOffsetx,cy:y-(blobSize/2)+prop.keyOffsety,r:blobSize/4,fill:colors[i]}});}else if(shape==='squaredot'||shape==='rectdot'){RG.SVG.create({svg:obj.svg,type:'path',parent:obj.svg.all,attr:{d:'M {1} {2} L {3} {4}'.format(x+prop.keyOffsetx,y-(blobSize/2)+prop.keyOffsety,x+prop.keyOffsetx+blobSize,y-(blobSize/2)+prop.keyOffsety),stroke:colors[i],'stroke-width':2,'stroke-linecap':'round'}});RG.SVG.create({svg:obj.svg,type:'rect',parent:obj.svg.all,attr:{x:x+(blobSize/4)+prop.keyOffsetx,y:y+(blobSize/4)-blobSize+prop.keyOffsety,width:blobSize/2,height:blobSize/2,fill:colors[i]}});}else if(typeof shape==='function'){RG.SVG.create({svg:obj.svg,type:'path',parent:obj.svg.all,attr:{d:'M {1} {2} L {3} {4}'.format(x+prop.keyOffsetx,y-(blobSize/2)+prop.keyOffsety,x+prop.keyOffsetx+blobSize,y-(blobSize/2)+prop.keyOffsety),stroke:colors[i],'stroke-width':2,'stroke-linecap':'round'}});}else{RG.SVG.create({svg:obj.svg,type:'rect',parent:obj.svg.all,attr:{x:x+prop.keyOffsetx,y:y-blobSize+prop.keyOffsety,width:blobSize,height:blobSize,fill:colors[i]}});}
|
9
|
+
RGraph.SVG.text({object:obj,parent:obj.svg.all,tag:'key',size:prop.keyTextSize||prop.textSize,bold:typeof prop.keyTextBold==='boolean'?prop.keyTextBold:prop.textBold,italic:typeof prop.keyTextItalic==='boolean'?prop.keyTextItalic:prop.textItalic,font:prop.keyTextFont||prop.textFont,halign:'left',valign:'bottom',text:key[i],x:x+blobSize+5+prop.keyTextOffsetx+prop.keyOffsetx,y:y+prop.keyTextOffsety+prop.keyOffsety,color:prop.keyTextColor||'black',background:prop.keyTextBackground||'white',padding:0})
|
9
10
|
x+=10+blobSize+5+textDimensions[0];}}};RG.SVG.HTML.key=function(id,prop)
|
10
11
|
{var div=doc.getElementById(id);var str='<table border="0" cellspacing="0" cellpadding="0" id="rgraph_key" style="display: inline;'+(function()
|
11
12
|
{var style=''
|
@@ -12,11 +12,11 @@ for(var j=0;j<maxcols;j++){if(typeof grid[i][j]==='undefined'){grid[i][j]='';}
|
|
12
12
|
if(grid[i][j].match(/^[0-9]+$/)){grid[i][j]=parseInt(grid[i][j]);}else if(grid[i][j].match(/^[0-9.]+$/)){grid[i][j]=parseFloat(grid[i][j]);}}}
|
13
13
|
obj.data=grid;userCallback(obj);};var scriptNode=document.createElement('SCRIPT');scriptNode.src=url;document.body.appendChild(scriptNode);};this.row=function(index,start)
|
14
14
|
{var opt={},row;start=start||1;if(arguments&&typeof arguments[2]==='object'&&typeof arguments[2].trim==='boolean'){opt.trim=arguments[2].trim;}else{opt.trim=true;}
|
15
|
-
row=this.data[index-1].slice(start-1);if(opt.trim){row=RGraph.
|
15
|
+
row=this.data[index-1].slice(start-1);if(opt.trim){row=RGraph.Sheets.arrayRTrim(row);}
|
16
16
|
return row;};this.col=function(index,start)
|
17
17
|
{var opt={},col=[];start=start||1;if(arguments&&typeof arguments[2]==='object'&&typeof arguments[2].trim==='boolean'){opt.trim=arguments[2].trim;}else{opt.trim=true;}
|
18
18
|
for(var i=0;i<this.data.length;++i){col.push(this.data[i][index-1]);}
|
19
|
-
if(opt.trim){col=RGraph.
|
19
|
+
if(opt.trim){col=RGraph.Sheets.arrayRTrim(col);}
|
20
20
|
col=col.slice(start-1);return col;};this.getIndexOfLetters=function(l)
|
21
21
|
{var parts=l.split('');if(parts.length===1){return letters.indexOf(l)+1;}else if(parts.length===2){var idx=((letters.indexOf(parts[0])+1)*26)+(letters.indexOf(parts[1])+1);return idx;}}
|
22
22
|
this.get=function(str)
|
@@ -26,5 +26,7 @@ if(str.match(/^([a-z]{1,2})([0-9]+)$/i)){var letter=RegExp.$1,number=RegExp.$2,c
|
|
26
26
|
if(str.match(/^([a-z]{1,2})([0-9]+):([a-z]{1,2})([0-9]+)$/i)){var letter1=RegExp.$1,number1=RegExp.$2,letter2=RegExp.$3,number2=RegExp.$4
|
27
27
|
if(letter1===letter2){var cells=[],index=this.getIndexOfLetters(letter1),col=this.col(index,null,{trim:false});for(var i=(number1-1);i<=(number2-1);++i){cells.push(col[i]);}}else if(number1===number2){var cells=[],row=this.row(number1,null,{trim:false}),index1=this.getIndexOfLetters(letter1),index2=this.getIndexOfLetters(letter2)
|
28
28
|
for(var i=(index1-1);i<=(index2-1);++i){cells.push(row[i]);}}
|
29
|
-
if(arguments[1]&&arguments[1].trim===false){}else{cells=RGraph.
|
30
|
-
return cells;}};this.load(url,callback);};
|
29
|
+
if(arguments[1]&&arguments[1].trim===false){}else{cells=RGraph.Sheets.arrayRTrim(cells);}
|
30
|
+
return cells;}};this.load(url,callback);};RGraph.Sheets.arrayRTrim=function(arr)
|
31
|
+
{var out=[],content=false;for(var i=(arr.length-1);i>=0;i--){if(arr[i]||content){out.push(arr[i]);content=true;}}
|
32
|
+
arr=out.reverse();return out;};})(window,document);
|
@@ -2,7 +2,8 @@
|
|
2
2
|
RGraph=window.RGraph||{isRGraph:true,isRGraphSVG:true};RGraph.SVG=RGraph.SVG||{};(function(win,doc,undefined)
|
3
3
|
{var RG=RGraph,ua=navigator.userAgent,ma=Math;RG.SVG.tooltips={};RG.SVG.tooltips.style={display:'inline-block',position:'absolute',padding:'6px',fontFamily:'Arial',fontSize:'12pt',fontWeight:'normal',textAlign:'center',left:0,top:0,backgroundColor:'rgb(255,255,239)',color:'black',visibility:'visible',zIndex:3,borderRadius:'5px',boxShadow:'rgba(96,96,96,0.5) 0 0 5px',transition:'left ease-out .25s, top ease-out .25s'};RG.SVG.tooltip=function(opt)
|
4
4
|
{var obj=opt.object;RG.SVG.fireCustomEvent(obj,'onbeforetooltip');if(!opt.text||typeof opt.text==='undefined'||RG.SVG.trim(opt.text).length===0){return;}
|
5
|
-
var prop=obj.properties;if(typeof prop.tooltipsOverride==='function'){
|
5
|
+
var prop=obj.properties;if(typeof prop.tooltipsOverride==='function'){document.body.addEventListener('mouseup',function(e)
|
6
|
+
{obj.removeHighlight();},false);return(prop.tooltipsOverride)(obj,opt);}
|
6
7
|
if(!RG.SVG.REG.get('tooltip')){var tooltipObj=document.createElement('DIV');tooltipObj.className=prop.tooltipsCssClass;for(var i in RG.SVG.tooltips.style){if(typeof i==='string'){tooltipObj.style[i]=RG.SVG.tooltips.style[i];}}}else{var tooltipObj=RG.SVG.REG.get('tooltip');tooltipObj.__object__.removeHighlight();tooltipObj.style.width='';}
|
7
8
|
if(RG.SVG.REG.get('tooltip-lasty')){tooltipObj.style.left=RG.SVG.REG.get('tooltip-lastx')+'px';tooltipObj.style.top=RG.SVG.REG.get('tooltip-lasty')+'px';}
|
8
9
|
tooltipObj.innerHTML=opt.text;tooltipObj.__text__=opt.text;tooltipObj.id='__rgraph_tooltip_'+obj.id+'_'+obj.uid+'_'+opt.index;tooltipObj.__event__=prop.tooltipsEvent||'click';tooltipObj.__object__=obj;if(typeof opt.index==='number'){tooltipObj.__index__=opt.index;}
|
@@ -4,22 +4,22 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,do
|
|
4
4
|
{this.set=function(name,value)
|
5
5
|
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
|
6
6
|
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(conf.data);this.originalData=RG.SVG.arrayClone(conf.data);this.type='funnel';this.coords=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];this.max=0;this.redraw=false;this.highlight_node=null;RG.SVG.OR.add(this);this.container.style.display='inline-block';var obj=this;this.data.forEach(function(val,key,arr)
|
7
|
-
{obj.max=ma.max(obj.max,val);});this.properties={gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundbars:false,backgroundBarsOpacity:0.25,backgroundBarsColors:null,strokestyle:'white',colors:['red','black','orange','green','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],colorsOpacity:1,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],labelsFont:null,labelsSize:null,labelsColor:null,labelsBold:null,labelsItalic:null,labelsBackground:null,labelsAlign:'center',labelsPosition:'section',linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.
|
7
|
+
{obj.max=ma.max(obj.max,val);});this.properties={gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundbars:false,backgroundBarsOpacity:0.25,backgroundBarsColors:null,strokestyle:'white',colors:['red','black','orange','green','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],colorsOpacity:1,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],labelsFont:null,labelsSize:null,labelsColor:null,labelsBold:null,labelsItalic:null,labelsBackground:null,labelsAlign:'center',labelsPosition:'section',linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:null,titleSubtitleSize:10,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
8
8
|
var prop=this.properties;this.draw=function()
|
9
|
-
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.data=RG.SVG.arrayClone(this.originalData);this.coords=[];RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;for(var i=0,len=this.data.length;i<len;++i){if(typeof this.data[i]==='string'){this.data[i]=RG.SVG.stringsToNumbers(this.data[i]);}}
|
9
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(this.originalData);this.coords=[];RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;for(var i=0,len=this.data.length;i<len;++i){if(typeof this.data[i]==='string'){this.data[i]=RG.SVG.stringsToNumbers(this.data[i]);}}
|
10
10
|
RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.drawFunnel();this.drawBackgroundBars();this.drawLabels();RG.SVG.drawTitle(this);if(typeof prop.key!==null&&RG.SVG.drawKey){RG.SVG.drawKey(this);}else if(!RGraph.SVG.isNull(prop.key)){alert('The drawKey() function does not exist - have you forgotten to include the key library?');}
|
11
11
|
var obj=this;doc.body.addEventListener('mousedown',function(e)
|
12
12
|
{obj.hideHighlight(obj);},false);RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawFunnel=function(opt)
|
13
|
-
{var centerx=prop.gutterLeft+(this.graphWidth/2);for(var i=0;i<(this.data.length-1);++i){var value=this.data[i],nextValue=this.data[i+1],maxWidth=this.graphWidth,width=(value/this.max)*this.graphWidth,height=this.graphHeight/(this.data.length-1),nextWidth=(nextValue/this.max)*this.graphWidth,nextHeight=height;var x1=centerx-(width/2),y1=prop.gutterTop+(height*i),x2=centerx+(width/2),y2=prop.gutterTop+(height*i);x3=centerx+(nextWidth/2),y3=prop.gutterTop+(height*(i+1)),x4=centerx-(nextWidth/2),y4=prop.gutterTop+(height*(i+1));this.coords.push({x1:x1,y1:y1,x2:x2,y2:y2,x3:x3,y3:y3,x4:x4,y4:y4,widthTop:x2-x1,widthBottom:x3-x4,height:y3-y2});}
|
14
|
-
for(var i=0,len=this.coords.length,sequentialIndex=0;i<len;++i,++sequentialIndex){if(i<len){var coords=this.coords[i];var path=RG.SVG.create({svg:this.svg,type:'path',parent:this.svg.all,attr:{d:'M {1} {2} L {3} {4} L {5} {6} L {7} {8} z'.format(coords.x1,coords.y1,coords.x2,coords.y2,coords.x3,coords.y3,coords.x4,coords.y4),stroke:prop.strokestyle,fill:prop.colors[i],'stroke-width':prop.linewidth}});coords.
|
13
|
+
{var centerx=prop.gutterLeft+(this.graphWidth/2);for(var i=0;i<(this.data.length-1);++i){var value=this.data[i],nextValue=this.data[i+1],maxWidth=this.graphWidth,width=(value/this.max)*this.graphWidth,height=this.graphHeight/(this.data.length-1),nextWidth=(nextValue/this.max)*this.graphWidth,nextHeight=height;var x1=centerx-(width/2),y1=prop.gutterTop+(height*i),x2=centerx+(width/2),y2=prop.gutterTop+(height*i);x3=centerx+(nextWidth/2),y3=prop.gutterTop+(height*(i+1)),x4=centerx-(nextWidth/2),y4=prop.gutterTop+(height*(i+1));this.coords.push({x1:x1,y1:y1,x2:x2,y2:y2,x3:x3,y3:y3,x4:x4,y4:y4,widthTop:x2-x1,widthBottom:x3-x4,height:y3-y2,object:this});}
|
14
|
+
for(var i=0,len=this.coords.length,sequentialIndex=0;i<len;++i,++sequentialIndex){if(i<len){var coords=this.coords[i];var path=RG.SVG.create({svg:this.svg,type:'path',parent:this.svg.all,attr:{d:'M {1} {2} L {3} {4} L {5} {6} L {7} {8} z'.format(coords.x1,coords.y1,coords.x2,coords.y2,coords.x3,coords.y3,coords.x4,coords.y4),stroke:prop.strokestyle,fill:prop.colors[i],'stroke-width':prop.linewidth,'data-value':this.data[i],'data-index':i}});coords.element=path;if(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips[i]){var obj=this;(function(idx,seq)
|
15
15
|
{path.addEventListener(prop.tooltipsEvent.replace(/^on/,''),function(e)
|
16
16
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,index:idx,group:null,sequentialIndex:seq,text:prop.tooltips[seq],event:e});obj.highlight(e.target);},false);path.addEventListener('mousemove',function(e)
|
17
17
|
{e.target.style.cursor='pointer'},false);})(i,sequentialIndex);}}}};this.redrawFunnel=function()
|
18
18
|
{};this.drawBackgroundBars=function()
|
19
19
|
{if(prop.backgroundBars){for(var i=0;i<this.coords.length;++i){var coords=this.coords[i];RG.SVG.create({svg:this.svg,type:'rect',parent:this.layers.background1,attr:{x:0,y:coords.y1,width:this.width,height:coords.y3-coords.y2,fill:prop.backgroundBarsColors&&typeof prop.backgroundBarsColors==='object'&&typeof prop.backgroundBarsColors[i]==='string'?prop.backgroundBarsColors[i]:prop.colors[i],'fill-opacity':prop.backgroundBarsOpacity}});}}};this.drawLabels=function()
|
20
20
|
{var labelsGroup=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'g'});if(prop.labelsHalign==='left'){var x=15;var halign='left';}else if(prop.labelsHalign==='right'){var x=this.width-15;var halign='right';}else{var x=this.width/2;var halign='center';}
|
21
|
-
if(prop.labels&&prop.labels.length){if(prop.labelsPosition==='section'){var sectionHeight=this.graphHeight/prop.labels.length;for(var i=0;i<prop.labels.length;++i){RG.SVG.text({object:this,svg:this.svg,parent:labelsGroup,text:typeof prop.labels[i]==='string'||prop.labels[i]==='number'?prop.labels[i].toString():'',size:parseInt(prop.labelsSize),x:x,y:prop.gutterTop+(sectionHeight/2)+(i*sectionHeight),halign:halign,valign:'center',background:prop.labelsBackground||'rgba(255,255,255,0.5)',padding:2,color:prop.labelsColor||prop.textColor||'black',bold:RG.SVG.isNull(prop.labelsBold)?prop.textBold:prop.labelsBold,italic:RG.SVG.isNull(prop.labelsItalic)?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}}else{for(var i=0;i<prop.labels.length;++i){RG.SVG.text({object:this,svg:this.svg,parent:labelsGroup,text:typeof prop.labels[i]==='string'||prop.labels[i]==='number'?prop.labels[i].toString():'',size:parseInt(prop.labelsSize),x:x,y:prop.gutterTop+((this.graphHeight/(prop.labels.length-1))*i),halign:halign,valign:'center',background:prop.labelsBackground||'rgba(255,255,255,0.5)',padding:2,color:prop.labelsColor||prop.textColor||'black',bold:RG.SVG.isNull(prop.labelsBold)?prop.textBold:prop.labelsBold,italic:RG.SVG.isNull(prop.labelsItalic)?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}}}};this.highlight=function(path)
|
22
|
-
{var path=path.getAttribute('d');var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.highlightFill,stroke:prop.highlightStroke,'stroke-width':prop.highlightLinewidth}});if(prop.tooltipsEvent==='mousemove'){highlight.addEventListener('mouseout',function(e)
|
21
|
+
if(prop.labels&&prop.labels.length){if(prop.labelsPosition==='section'){var sectionHeight=this.graphHeight/prop.labels.length;for(var i=0;i<prop.labels.length;++i){RG.SVG.text({object:this,svg:this.svg,parent:labelsGroup,tag:'labels',text:typeof prop.labels[i]==='string'||prop.labels[i]==='number'?prop.labels[i].toString():'',size:parseInt(prop.labelsSize),x:x,y:prop.gutterTop+(sectionHeight/2)+(i*sectionHeight),halign:halign,valign:'center',background:prop.labelsBackground||'rgba(255,255,255,0.5)',padding:2,color:prop.labelsColor||prop.textColor||'black',bold:RG.SVG.isNull(prop.labelsBold)?prop.textBold:prop.labelsBold,italic:RG.SVG.isNull(prop.labelsItalic)?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}}else{for(var i=0;i<prop.labels.length;++i){RG.SVG.text({object:this,svg:this.svg,parent:labelsGroup,tag:'labels',text:typeof prop.labels[i]==='string'||prop.labels[i]==='number'?prop.labels[i].toString():'',size:parseInt(prop.labelsSize),x:x,y:prop.gutterTop+((this.graphHeight/(prop.labels.length-1))*i),halign:halign,valign:'center',background:prop.labelsBackground||'rgba(255,255,255,0.5)',padding:2,color:prop.labelsColor||prop.textColor||'black',bold:RG.SVG.isNull(prop.labelsBold)?prop.textBold:prop.labelsBold,italic:RG.SVG.isNull(prop.labelsItalic)?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}}}};this.highlight=function(path)
|
22
|
+
{var path=path.getAttribute('d');var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.highlightFill,stroke:prop.highlightStroke,'stroke-width':prop.highlightLinewidth},style:{pointerEvents:'none'}});if(prop.tooltipsEvent==='mousemove'){highlight.addEventListener('mouseout',function(e)
|
23
23
|
{highlight.parentNode.removeChild(highlight);RG.SVG.hideTooltip();RG.SVG.REG.set('highlight',null);},false);}
|
24
24
|
RG.SVG.REG.set('highlight',highlight);};this.parseColors=function()
|
25
25
|
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),highlightFill:RG.SVG.arrayClone(prop.highlightFill),backgroundBarsColors:RG.SVG.arrayClone(prop.backgroundBarsColors)}}
|
@@ -29,4 +29,4 @@ prop.highlightFill=RG.SVG.parseColorLinear({object:this,color:prop.highlightFill
|
|
29
29
|
{if(type.substr(0,2)!=='on'){type='on'+type;}
|
30
30
|
RG.SVG.addCustomEventListener(this,type,func);return this;};this.exec=function(func)
|
31
31
|
{func(this);return this;};this.removeHighlight=this.hideHighlight=function()
|
32
|
-
{var highlight=RG.SVG.REG.get('highlight');if(highlight
|
32
|
+
{var highlight=RG.SVG.REG.get('highlight');if(highlight){highlight.setAttribute('fill','transparent');highlight.setAttribute('stroke','transparent');RG.SVG.REG.set('highlight',null);}};for(i in conf.options){if(typeof i==='string'){this.set(i,conf.options[i]);}}};return this;})(window,document);
|
@@ -0,0 +1,33 @@
|
|
1
|
+
|
2
|
+
RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,doc,undefined)
|
3
|
+
{var RG=RGraph,ua=navigator.userAgent,ma=Math,win=window,doc=document;RG.SVG.Gauge=function(conf)
|
4
|
+
{this.set=function(name,value)
|
5
|
+
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;}
|
6
|
+
return this;};this.type='gauge';this.innerMin=RG.SVG.stringsToNumbers(conf.innerMin);this.innerMax=RG.SVG.stringsToNumbers(conf.innerMax);this.outerMin=RG.SVG.stringsToNumbers(conf.outerMin);this.outerMax=RG.SVG.stringsToNumbers(conf.outerMax);this.value=RG.SVG.stringsToNumbers(conf.value);this.angleStart=0-RG.SVG.TRIG.HALFPI-(RG.SVG.TRIG.HALFPI/2);this.angleEnd=0+RG.SVG.TRIG.HALFPI+(RG.SVG.TRIG.HALFPI/2);this.angleSpan=this.angleEnd-this.angleStart;this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes={};this.shadowNodes=[];if(this.value>this.innerMax)this.value=this.innerMax;if(this.value<this.innerMin)this.value=this.innerMin;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:10,gutterRight:10,gutterTop:20,gutterBottom:0,rmargin:null,backgroundFill:'Gradient(white:#FEFEFE:#E6E6E6:#dedede)',backgroundStroke:'#ddd',linewidth:1,colors:['black','black'],innerGap:5,tickmarksOuterSize:3,tickmarksInnerSize:3,tickmarksCount:10,textColor:'black',textFont:'sans-serif',textSize:10,textBold:false,textItalic:false,labelsIngraph:true,labelsIngraphFont:null,labelsIngraphSize:null,labelsIngraphBold:null,labelsIngraphItalic:null,labelsIngraphColor:null,labelsIngraphUnitsPre:'',labelsIngraphUnitsPost:'',labelsIngraphThousand:',',labelsIngraphPoint:'.',labelsIngraphFormatter:null,labelsIngraphDecimals:0,labelsIngraphPadding:3,labelsIngraphBackground:'Gradient(#ddd:#eee)',labelsIngraphRounded:2,scaleInnerFont:null,scaleInnerSize:null,scaleInnerBold:null,scaleInnerItalic:null,scaleInnerColor:null,scaleInnerUnitsPre:'',scaleInnerUnitsPost:'',scaleInnerPoint:'.',scaleInnerThousand:',',scaleInnerDecimals:0,scaleInnerFormatter:null,scaleInnerLabelsCount:10,scaleInnerRound:false,scaleOuter:true,scaleOuterFont:null,scaleOuterSize:null,scaleOuterBold:null,scaleOuterItalic:null,scaleOuterColor:null,scaleOuterUnitsPre:'',scaleOuterUnitsPost:'',scaleOuterPoint:'.',scaleOuterThousand:',',scaleOuterDecimals:0,scaleOuterFormatter:null,scaleOuterLabelsCount:10,scaleOuterRound:false,title:'',titleSize:null,titleX:null,titleY:'+5',titleHalign:'center',titleValign:'bottom',titleColor:null,titleFont:null,titleBold:true,titleItalic:false,titleSubtitle:null,titleSubtitleSize:null,titleSubtitleX:null,titleSubtitleY:'+15',titleSubtitleHalign:'center',titleSubtitleValign:'center',titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,needleColor:'#666',centerpinRadius:5,adjustable:false};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
7
|
+
var prop=this.properties;this.draw=function()
|
8
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.nodes={};this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;if(prop.title.length>0){this.graphHeight-=prop.gutterTop;}
|
9
|
+
this.centerx=(this.graphWidth/2)+prop.gutterLeft;this.centery=(this.graphHeight/2)+prop.gutterTop;this.radius=ma.min(this.graphWidth/2,this.graphHeight/2);if(prop.title.length>0){this.centery+=10;this.radius-=10;}
|
10
|
+
this.centerx=typeof prop.centerx==='number'?prop.centerx:this.centerx;this.centery=typeof prop.centery==='number'?prop.centery:this.centery;this.radius=typeof prop.radius==='number'?prop.radius:this.radius;if(typeof prop.radius==='string'&&prop.radius.match(/^\+|-\d+$/))this.radius+=parseFloat(prop.radius);if(typeof prop.centerx==='string'&&prop.centerx.match(/^\+|-\d+$/))this.centery+=parseFloat(prop.centerx);if(typeof prop.centery==='string'&&prop.centery.match(/^\+|-\d+$/))this.centerx+=parseFloat(prop.centery);RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();if(prop.rmargin===null){if(prop.scaleOuter){prop.rmargin=40;}else{prop.rmargin=25;}}
|
11
|
+
this.drawMeter();this.drawNeedle();if(prop.labelsIngraph){this.drawIngraph();}
|
12
|
+
RG.SVG.drawTitle(this);if(prop.adjustable){this.adjusting_mousedown=false;var func=function(e)
|
13
|
+
{var svg=e.currentTarget,obj=svg.__object__,mouseX=e.offsetX,mouseY=e.offsetY;var radius=RG.SVG.TRIG.getHypLength({x1:mouseX,y1:mouseY,x2:obj.centerx,y2:obj.centery,object:obj});if(radius>obj.radius){return;}
|
14
|
+
var value=obj.getValue(e);obj.value=value;obj.drawNeedle();};var obj=this;this.svg.addEventListener('mousedown',function(e)
|
15
|
+
{this.adjusting_mousedown=true;func(e);},false);this.svg.addEventListener('mousemove',function(e)
|
16
|
+
{if(this.adjusting_mousedown){func(e);}},false);this.svg.addEventListener('mouseup',function(e)
|
17
|
+
{this.adjusting_mousedown=false;},false);}
|
18
|
+
RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawMeter=function()
|
19
|
+
{this.scaleInner=RG.SVG.getScale({object:this,numlabels:prop.scaleInnerLabelsCount,unitsPre:prop.scaleInnerUnitsPre,unitsPost:prop.scaleInnerUnitsPost,max:this.innerMax,min:this.innerMin,point:prop.scaleInnerPoint,round:prop.scaleInnerRound,thousand:prop.scaleInnerThousand,decimals:prop.scaleInnerDecimals,strict:true,formatter:prop.scaleInnerFormatter});this.scaleOuter=RG.SVG.getScale({object:this,numlabels:prop.scaleOuterLabelsCount,unitsPre:prop.scaleOuterUnitsPre,unitsPost:prop.scaleOuterUnitsPost,max:this.outerMax,min:this.outerMin,point:prop.scaleOuterPoint,round:prop.scaleOuterRound,thousand:prop.scaleOuterThousand,decimals:prop.scaleOuterDecimals,strict:true,formatter:prop.scaleOuterFormatter});this.nodes.background=RG.SVG.create({svg:this.svg,type:'circle',parent:this.svg.all,attr:{cx:this.centerx,cy:this.centery,r:this.radius,stroke:prop.backgroundStroke,fill:prop.backgroundFill}});this.nodes.innerAxisGroup=RG.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{id:'innerAxisGroup',}});this.nodes.outerAxisGroup=RG.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{id:'outerAxisGroup',}});var innerPath=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.innerGap-prop.rmargin,start:this.angleStart,end:this.angleEnd,anticlockwise:false,lineto:false});var inner=RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.innerAxisGroup,attr:{d:innerPath,stroke:prop.colors[1],fill:'transparent','stroke-width':prop.linewidth}});var outerPath=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.rmargin,start:this.angleStart,end:this.angleEnd,anticlockwise:false,lineto:false});var outer=RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.outerAxisGroup,attr:{d:outerPath,stroke:prop.colors[0],fill:'transparent','stroke-width':prop.linewidth}});this.nodes.outerAxis=outerPath;this.nodes.innerAxis=innerPath;var numticks=prop.tickmarksCount,gap=this.angleSpan/numticks,numlabels=prop.tickmarksCount;for(var i=0;i<=numticks;++i){if(prop.scaleOuter){var path_a=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.rmargin,start:this.angleStart+(i*gap),end:this.angleStart+(i*gap),anticlockwise:false,lineto:false});var path_b=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius+prop.tickmarksOuterSize-prop.rmargin,start:this.angleStart+(i*gap),end:this.angleStart+(i*gap),anticlockwise:false,lineto:true});RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.outerAxisGroup,attr:{d:path_a+' '+path_b,stroke:prop.colors[0],fill:'transparent','stroke-width':prop.linewidth,'stroke-linecap':'square'}});var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius+prop.tickmarksOuterSize+10-prop.rmargin,angle:this.angleStart-RG.SVG.TRIG.HALFPI+(i*gap)});var halign=(coords.x>this.centerx?'left':'right');if(i/numlabels===0.5){halign='center';}
|
20
|
+
RG.SVG.text({object:this,svg:this.svg,parent:this.nodes.outerAxisGroup,tag:'scale.outer',text:(i===0?RG.SVG.numberFormat({object:this,prepend:prop.scaleOuterUnitsPre,append:prop.scaleOuterUnitsPost,num:this.outerMin.toFixed(prop.scaleOuterDecimals),point:prop.scaleOuterPoint,thousand:prop.scaleOuterThousand}):this.scaleOuter.labels[i-1]),size:prop.scaleOuterSize||prop.textSize,x:coords.x,y:coords.y,halign:halign,valign:'center',padding:2,color:prop.scaleOuterColor||prop.textColor,bold:typeof prop.scaleOuterBold==='boolean'?prop.scaleOuterBold:prop.textBold,italic:typeof prop.scaleOuterItalic==='boolean'?prop.scaleOuterItalic:prop.textItalic,font:prop.scaleOuterFont||prop.textFont});}else{var path_a=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.rmargin,start:this.angleStart,end:this.angleStart,anticlockwise:false,lineto:false});var path_b=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.innerGap-prop.rmargin,start:this.angleStart,end:this.angleStart,anticlockwise:false,lineto:true});RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.innerAxisGroup,attr:{d:path_a+path_b,stroke:prop.colors[1],fill:'transparent','stroke-width':prop.linewidth,'stroke-linecap':'square'}});var path_a=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.rmargin,start:this.angleEnd,end:this.angleEnd,anticlockwise:false,lineto:false});var path_b=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.innerGap-prop.rmargin,start:this.angleEnd,end:this.angleEnd,anticlockwise:false,lineto:true});RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.innerAxisGroup,attr:{d:path_a+path_b,stroke:prop.colors[1],fill:'transparent','stroke-width':prop.linewidth,'stroke-linecap':'square'}});}
|
21
|
+
var path_a=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.rmargin-prop.innerGap,start:this.angleStart+(i*gap),end:this.angleStart+(i*gap),anticlockwise:false,lineto:false});var path_b=RG.SVG.TRIG.getArcPath3({cx:this.centerx,cy:this.centery,r:this.radius-prop.innerGap-prop.tickmarksOuterSize-prop.rmargin,start:this.angleStart+(i*gap),end:this.angleStart+(i*gap),anticlockwise:false,lineto:true});RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.innerAxisGroup,attr:{d:path_a+' '+path_b,stroke:prop.colors[1],fill:'transparent','stroke-width':prop.linewidth,'stroke-linecap':'square'}});var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius-prop.innerGap-prop.tickmarksInnerSize-10-prop.rmargin,angle:this.angleStart-RG.SVG.TRIG.HALFPI+(i*gap)});var halign=(coords.x>this.centerx?'right':'left');if(i/numlabels===0.5){halign='center';}
|
22
|
+
RG.SVG.text({object:this,svg:this.svg,parent:this.nodes.innerAxisGroup,tag:'scale.inner',text:(i===0?RG.SVG.numberFormat({object:this,prepend:prop.scaleInnerUnitsPre,append:prop.scaleInnerUnitsPost,num:this.innerMin.toFixed(prop.scaleInnerDecimals),point:prop.scaleInnerPoint,thousand:prop.scaleInnerThousand}):this.scaleInner.labels[i-1]),size:prop.scaleInnerSize||prop.textSize,x:coords.x,y:coords.y,halign:halign,valign:'center',padding:2,color:prop.scaleInnerColor||prop.textColor,bold:typeof prop.scaleInnerBold==='boolean'?prop.scaleInnerBold:prop.textBold,italic:typeof prop.scaleInnerItalic==='boolean'?prop.scaleInnerItalic:prop.textItalic,font:prop.scaleInnerFont||prop.textFont});}};this.drawIngraph=function()
|
23
|
+
{if(this.nodes.labelsIngraphGroup){this.nodes.labelsIngraphGroup.parentNode.removeChild(this.nodes.labelsIngraphGroup);}
|
24
|
+
this.nodes.labelsIngraphGroup=RG.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{id:'labelsIngraphGroup',}});this.nodes.labelsIngraph=RG.SVG.text({object:this,parent:this.nodes.labelsIngraphGroup,text:RG.SVG.numberFormat({prepend:prop.labelsIngraphUnitsPre,append:prop.labelsIngraphUnitsPost,decimal_seperator:prop.labelsIngraphPoint,thousand_seperator:prop.labelsIngraphThousand,formatter:prop.labelsIngraphFormatter,num:this.value.toFixed(prop.labelsIngraphDecimals)}),x:this.centerx,y:this.centery+this.radius-prop.rmargin-30,background:prop.labelsIngraphBackground,backgroundRounded:prop.labelsIngraphRounded,padding:prop.labelsIngraphPadding,halign:'center',valign:'center',size:prop.labelsIngraphSize||prop.textSize+2,bold:typeof prop.labelsIngraphBold==='boolean'?prop.labelsIngraphBold:prop.textBold,italic:typeof prop.labelsIngraphItalic==='boolean'?prop.labelsIngraphItalic:prop.textItalic,font:prop.labelsIngraphFont||prop.textFont,color:prop.labelsIngraphColor||prop.textColor});var rect=this.nodes.labelsIngraph.previousSibling;rect.setAttribute('stroke','#aaa');var func=function(e){e.stopPropagation();};rect.addEventListener('mousedown',func,false);this.nodes.labelsIngraph.addEventListener('mousedown',func,false);};this.drawNeedle=function()
|
25
|
+
{if(this.nodes.needleGroup){this.nodes.needleGroup.parentNode.removeChild(this.nodes.needleGroup);}
|
26
|
+
this.nodes.needleGroup=RG.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{id:'needle-group',fill:prop.needleColor,stroke:prop.needleColor}});var angle=(this.value-this.innerMin)/(this.innerMax-this.innerMin)*this.angleSpan;angle+=RG.SVG.TRIG.HALFPI+(RG.SVG.TRIG.HALFPI/2);var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius-60,angle:angle});var coords2=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:prop.centerpinRadius,angle:angle-RG.SVG.TRIG.HALFPI});var coords3=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:prop.centerpinRadius,angle:angle+RG.SVG.TRIG.HALFPI});RG.SVG.create({svg:this.svg,type:'path',parent:this.nodes.needleGroup,attr:{'stroke-width':1,'stroke-linecap':"round",d:'M{1} {2} L{3} {4} L{5} {6} z'.format(coords.x,coords.y,coords2.x,coords2.y,coords3.x,coords3.y)}});RG.SVG.create({svg:this.svg,type:'circle',parent:this.nodes.needleGroup,attr:{cx:this.centerx,cy:this.centery,r:prop.centerpinRadius}});if(prop.labelsIngraph){this.drawIngraph();}};this.parseColors=function()
|
27
|
+
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),backgroundFill:RG.SVG.arrayClone(prop.backgroundFill),backgroundStroke:RG.SVG.arrayClone(prop.backgroundStroke),labelsIngraphBackground:RG.SVG.arrayClone(prop.labelsIngraphBackground)}}
|
28
|
+
prop.backgroundFill=RG.SVG.parseColorLinear({object:this,color:prop.backgroundFill,start:prop.gutterTop,end:this.height-prop.gutterBottom,direction:'vertical'});prop.backgroundStroke=RG.SVG.parseColorLinear({object:this,color:prop.backgroundStroke,start:prop.gutterTop,end:this.height-prop.gutterBottom,direction:'vertical'});prop.labelsIngraphBackground=RG.SVG.parseColorLinear({object:this,color:prop.labelsIngraphBackground,direction:'vertical',gradientUnits:'objectBoundingBox'});};this.getValue=function(e)
|
29
|
+
{var mouseX=e.offsetX,mouseY=e.offsetY;var angle=RG.SVG.TRIG.getAngleByXY({cx:this.centerx,cy:this.centery,x:mouseX,y:mouseY});if(mouseX<this.centerx){angle=angle-RG.SVG.TRIG.TWOPI;}
|
30
|
+
var value=((angle-this.angleStart)/(this.angleEnd-this.angleStart));value=value*(this.innerMax-this.innerMin);value=value+this.innerMin;if(value<this.innerMin)value=this.innerMin;if(value>this.innerMax)value=this.innerMax;return value;};this.on=function(type,func)
|
31
|
+
{if(type.substr(0,2)!=='on'){type='on'+type;}
|
32
|
+
RG.SVG.addCustomEventListener(this,type,func);return this;};this.exec=function(func)
|
33
|
+
{func(this);return this;};for(i in conf.options){if(typeof i==='string'){this.set(i,conf.options[i]);}}};return this;})(window,document);
|
@@ -3,10 +3,10 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,do
|
|
3
3
|
{var RG=RGraph,ua=navigator.userAgent,ma=Math,win=window,doc=document;RG.SVG.HBar=function(conf)
|
4
4
|
{this.set=function(name,value)
|
5
5
|
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
|
6
|
-
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=conf.data;this.type='hbar';this.coords=[];this.stackedBackfaces=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={gutterLeft:100,gutterRight:35,gutterTop:35,gutterBottom:35,gutterLeftAutosize:true,backgroundColor:null,backgroundImage:null,backgroundImageAspect:'none',backgroundImageStretch:true,backgroundImageOpacity:null,backgroundImageX:null,backgroundImageY:null,backgroundImageW:null,backgroundImageH:null,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridLinewidth:1,backgroundGridHlines:true,backgroundGridHlinesCount:null,backgroundGridVlines:true,backgroundGridVlinesCount:null,backgroundGridBorder:true,backgroundGridDashed:false,backgroundGridDotted:false,backgroundGridDashArray:null,colors:['red','#0f0','#00f','#ff0','#0ff','#0f0','pink','orange','gray','black','red','#0f0','#00f','#ff0','#0ff','#0f0','pink','orange','gray','black'],colorsSequential:false,strokestyle:'rgba(0,0,0,0)',vmargin:3,vmarginGrouped:2,vmarginTop:0,vmarginBottom:0,xaxis:true,xaxisTickmarks:true,xaxisTickmarksLength:5,xaxisColor:'black',xaxisLabels:[],xaxisLabelsOffsetx:0,xaxisLabelsOffsety:0,xaxisLabelsCount:5,xaxisScale:true,xaxisUnitsPre:'',xaxisUnitsPost:'',xaxisStrict:false,xaxisDecimals:0,xaxisPoint:'.',xaxisThousand:',',xaxisRound:false,xaxisMax:null,xaxisMin:0,xaxisFormatter:null,xaxisLabelsPositionEdgeTickmarksCount:null,xaxisTextColor:null,xaxisTextBold:null,xaxisTextItalic:null,xaxisTextFont:null,xaxisTextSize:null,yaxis:true,yaxisTickmarks:true,yaxisTickmarksLength:3,yaxisLabels:[],yaxisLabelsPosition:'section',yaxisLabelsOffsetx:0,yaxisLabelsOffsety:0,yaxisScale:false,yaxisLabelsPositionSectionTickmarksCount:null,yaxisColor:'black',yaxisTextFont:null,yaxisTextSize:null,yaxisTextColor:null,yaxisTextBold:null,yaxisTextItalic:null,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labelsAbove:false,labelsAboveFont:null,labelsAboveSize:null,labelsAboveBold:null,labelsAboveItalic:null,labelsAboveColor:null,labelsAboveBackground:null,labelsAboveBackgroundPadding:0,labelsAboveUnitsPre:null,labelsAboveUnitsPost:null,labelsAbovePoint:null,labelsAboveThousand:null,labelsAboveFormatter:null,labelsAboveDecimals:null,labelsAboveOffsetx:0,labelsAboveOffsety:0,labelsAboveHalign:'left',labelsAboveValign:'center',labelsAboveSpecific:null,linewidth:1,grouping:'grouped',tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:
|
6
|
+
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=conf.data;this.type='hbar';this.coords=[];this.coords2=[];this.stackedBackfaces=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={gutterLeft:100,gutterRight:35,gutterTop:35,gutterBottom:35,gutterLeftAutosize:true,backgroundColor:null,backgroundImage:null,backgroundImageAspect:'none',backgroundImageStretch:true,backgroundImageOpacity:null,backgroundImageX:null,backgroundImageY:null,backgroundImageW:null,backgroundImageH:null,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridLinewidth:1,backgroundGridHlines:true,backgroundGridHlinesCount:null,backgroundGridVlines:true,backgroundGridVlinesCount:null,backgroundGridBorder:true,backgroundGridDashed:false,backgroundGridDotted:false,backgroundGridDashArray:null,colors:['red','#0f0','#00f','#ff0','#0ff','#0f0','pink','orange','gray','black','red','#0f0','#00f','#ff0','#0ff','#0f0','pink','orange','gray','black'],colorsSequential:false,strokestyle:'rgba(0,0,0,0)',vmargin:3,vmarginGrouped:2,vmarginTop:0,vmarginBottom:0,xaxis:true,xaxisTickmarks:true,xaxisTickmarksLength:5,xaxisColor:'black',xaxisLabels:[],xaxisLabelsOffsetx:0,xaxisLabelsOffsety:0,xaxisLabelsCount:5,xaxisScale:true,xaxisUnitsPre:'',xaxisUnitsPost:'',xaxisStrict:false,xaxisDecimals:0,xaxisPoint:'.',xaxisThousand:',',xaxisRound:false,xaxisMax:null,xaxisMin:0,xaxisFormatter:null,xaxisLabelsPositionEdgeTickmarksCount:null,xaxisTextColor:null,xaxisTextBold:null,xaxisTextItalic:null,xaxisTextFont:null,xaxisTextSize:null,yaxis:true,yaxisTickmarks:true,yaxisTickmarksLength:3,yaxisLabels:[],yaxisLabelsPosition:'section',yaxisLabelsOffsetx:0,yaxisLabelsOffsety:0,yaxisScale:false,yaxisLabelsPositionSectionTickmarksCount:null,yaxisColor:'black',yaxisTextFont:null,yaxisTextSize:null,yaxisTextColor:null,yaxisTextBold:null,yaxisTextItalic:null,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labelsAbove:false,labelsAboveFont:null,labelsAboveSize:null,labelsAboveBold:null,labelsAboveItalic:null,labelsAboveColor:null,labelsAboveBackground:null,labelsAboveBackgroundPadding:0,labelsAboveUnitsPre:null,labelsAboveUnitsPost:null,labelsAbovePoint:null,labelsAboveThousand:null,labelsAboveFormatter:null,labelsAboveDecimals:null,labelsAboveOffsetx:0,labelsAboveOffsety:0,labelsAboveHalign:'left',labelsAboveValign:'center',labelsAboveSpecific:null,linewidth:1,grouping:'grouped',tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:null,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleSize:10,titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
7
7
|
var prop=this.properties;this.draw=function()
|
8
|
-
{RG.SVG.fireCustomEvent(this,'onbeforedraw');RG.SVG.createDefs(this);if(prop.gutterLeftAutosize){for(var i=0,len=prop.yaxisLabels.length,maxLength=0;i<len;++i){var sizes=RG.SVG.measureText({text:prop.yaxisLabels[i],bold:prop.yaxisTextBold||prop.textBold,size:prop.yaxisTextSize||prop.textSize,font:prop.yaxisTextFont||prop.textFont});maxLength=ma.max(maxLength,sizes[0]);}
|
9
|
-
prop.gutterLeft=maxLength+15;}
|
8
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.coords=[];this.coords2=[];RG.SVG.createDefs(this);if(prop.gutterLeftAutosize){for(var i=0,len=prop.yaxisLabels.length,maxLength=0;i<len;++i){var sizes=RG.SVG.measureText({text:prop.yaxisLabels[i],bold:prop.yaxisTextBold||prop.textBold,size:prop.yaxisTextSize||prop.textSize,font:prop.yaxisTextFont||prop.textFont});maxLength=ma.max(maxLength,sizes[0]);}
|
9
|
+
prop.gutterLeft=maxLength+15-prop.yaxisLabelsOffsetx;if(prop.gutterLeft<15){prop.gutterLeft=15;}}
|
10
10
|
this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();var values=[];for(var i=0,max=0;i<this.data.length;++i){if(typeof this.data[i]==='number'){values.push(this.data[i]);}else if(RG.SVG.isArray(this.data[i])&&prop.grouping==='grouped'){values.push(RG.SVG.arrayMax(this.data[i]));}else if(RG.SVG.isArray(this.data[i])&&prop.grouping==='stacked'){values.push(RG.SVG.arraySum(this.data[i]));}}
|
11
11
|
var max=RG.SVG.arrayMax(values);if(typeof prop.xaxisMax==='number'){max=prop.xaxisMax;}
|
12
12
|
if(prop.xaxisMin==='mirror'||prop.xaxisMin==='middle'||prop.xaxisMin==='center'){var mirrorScale=true;prop.xaxisMin=prop.xaxisMax* -1;}
|
@@ -16,16 +16,19 @@ RG.SVG.attribution(this);var obj=this;document.body.addEventListener('mousedown'
|
|
16
16
|
{RG.SVG.removeHighlight(obj);},false);RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawBars=function()
|
17
17
|
{if(prop.shadow){RG.SVG.setShadow({object:this,offsetx:prop.shadowOffsetx,offsety:prop.shadowOffsety,blur:prop.shadowBlur,opacity:prop.shadowOpacity,id:'dropShadow'});}
|
18
18
|
for(var i=0,sequentialIndex=0;i<this.data.length;++i,++sequentialIndex){if(typeof this.data[i]==='number'){var outerSegment=(this.graphHeight-prop.vmarginTop-prop.vmarginBottom)/this.data.length,width=this.getWidth(this.data[i]),height=((this.graphHeight-prop.vmarginTop-prop.vmarginBottom)/this.data.length)-prop.vmargin-prop.vmargin,x=this.getXCoord((this.scale.min<0&&this.scale.max<0)||(this.scale.min>0&&this.scale.max>0)?this.scale.min:0)-(this.data[i]<0?width:0),y=prop.gutterTop+prop.vmarginTop+prop.vmargin+(outerSegment*i);if(this.scale.min<0&&this.scale.max<0){x=this.width-prop.gutterRight-width;}
|
19
|
-
var rect=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'rect',attr:{stroke:prop.strokestyle,fill:prop.colorsSequential?(prop.colors[sequentialIndex]?prop.colors[sequentialIndex]:prop.colors[prop.colors.length-1]):prop.colors[0],x:x,y:y,width:width,height:height,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-index':i,'data-original-width':width,'data-original-height':height,'data-sequential-index':sequentialIndex,'data-value':this.data[i],filter:prop.shadow?'url(#dropShadow)':''}});this.coords.push({object:rect,x:x,y:
|
19
|
+
var rect=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'rect',attr:{stroke:prop.strokestyle,fill:prop.colorsSequential?(prop.colors[sequentialIndex]?prop.colors[sequentialIndex]:prop.colors[prop.colors.length-1]):prop.colors[0],x:x,y:y,width:width,height:height,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-index':i,'data-original-width':width,'data-original-height':height,'data-sequential-index':sequentialIndex,'data-value':this.data[i],filter:prop.shadow?'url(#dropShadow)':''}});this.coords.push({object:this,element:rect,x:parseFloat(rect.getAttribute('x')),y:parseFloat(rect.getAttribute('y')),width:parseFloat(rect.getAttribute('width')),height:parseFloat(rect.getAttribute('height'))});if(!this.coords2[0]){this.coords2[0]=[];}
|
20
|
+
this.coords2[0].push({object:this,element:rect,x:parseFloat(rect.getAttribute('x')),y:parseFloat(rect.getAttribute('y')),width:parseFloat(rect.getAttribute('width')),height:parseFloat(rect.getAttribute('height'))});if(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips[sequentialIndex]){var obj=this;(function(idx,seq)
|
20
21
|
{rect.addEventListener(prop.tooltipsEvent.replace(/^on/,''),function(e)
|
21
22
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,index:idx,group:null,sequentialIndex:seq,text:prop.tooltips[seq],event:e});obj.highlight(e.target);},false);rect.addEventListener('mousemove',function(e)
|
22
23
|
{e.target.style.cursor='pointer';},false);})(i,sequentialIndex);}}else if(RG.SVG.isArray(this.data[i])&&prop.grouping==='grouped'){var outerSegment=((this.graphHeight-prop.vmarginTop-prop.vmarginBottom)/this.data.length),innerSegment=outerSegment-(2*prop.vmargin);for(var j=0;j<this.data[i].length;++j,++sequentialIndex){var width=ma.abs((this.data[i][j]/(this.max-this.min))*this.graphWidth),height=((innerSegment-((this.data[i].length-1)*prop.vmarginGrouped))/this.data[i].length),y=prop.gutterTop+prop.vmargin+prop.vmarginTop+(outerSegment*i)+(j*height)+(j*prop.vmarginGrouped),x=this.getXCoord(0)-(this.data[i][j]<0?width:0);if(this.scale.max<0&&this.scale.min<this.scale.max){var x1=this.getXCoord(this.data[i][j]);var x2=this.getXCoord(this.scale.max);x=x1;width=x2-x1;}else if(this.scale.min>0&&this.scale.max>this.scale.min){var x1=this.getXCoord(this.data[i][j]);var x2=this.getXCoord(this.scale.min);x=this.getXCoord(this.scale.min);width=x1-x2;}
|
23
|
-
var rect=RG.SVG.create({svg:this.svg,type:'rect',parent:this.svg.all,attr:{stroke:prop['strokestyle'],fill:(prop.colorsSequential&&prop.colors[sequentialIndex])?prop.colors[sequentialIndex]:(prop.colors[j]?prop.colors[j]:prop.colors[prop.colors.length-1]),x:x,y:y,width:width,height:height,'stroke-width':prop.linewidth,'data-index':i,'data-original-width':width,'data-sequential-index':sequentialIndex,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[sequentialIndex]:'','data-value':this.data[i][j],filter:prop.shadow?'url(#dropShadow)':''}});this.coords.push({object:rect,x:x,y:
|
24
|
+
var rect=RG.SVG.create({svg:this.svg,type:'rect',parent:this.svg.all,attr:{stroke:prop['strokestyle'],fill:(prop.colorsSequential&&prop.colors[sequentialIndex])?prop.colors[sequentialIndex]:(prop.colors[j]?prop.colors[j]:prop.colors[prop.colors.length-1]),x:x,y:y,width:width,height:height,'stroke-width':prop.linewidth,'data-index':i,'data-original-width':width,'data-sequential-index':sequentialIndex,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[sequentialIndex]:'','data-value':this.data[i][j],filter:prop.shadow?'url(#dropShadow)':''}});this.coords.push({object:this,element:rect,x:parseFloat(rect.getAttribute('x')),y:parseFloat(rect.getAttribute('y')),width:parseFloat(rect.getAttribute('width')),height:parseFloat(rect.getAttribute('height'))});if(!this.coords2[i]){this.coords2[i]=[];}
|
25
|
+
this.coords2[i].push({object:this,element:rect,x:parseFloat(rect.getAttribute('x')),y:parseFloat(rect.getAttribute('y')),width:parseFloat(rect.getAttribute('width')),height:parseFloat(rect.getAttribute('height'))});if(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips[sequentialIndex]){var obj=this;(function(idx,seq)
|
24
26
|
{var indexes=RG.SVG.sequentialIndexToGrouped(seq,obj.data);rect.addEventListener(prop.tooltipsEvent.replace(/^on/,''),function(e)
|
25
27
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,group:idx,index:indexes[1],sequentialIndex:seq,text:prop.tooltips[seq],event:e});obj.highlight(e.target);},false);rect.addEventListener('mousemove',function(e)
|
26
28
|
{e.target.style.cursor='pointer'},false);})(i,sequentialIndex);}}
|
27
29
|
--sequentialIndex;}else if(RG.SVG.isArray(this.data[i])&&prop.grouping==='stacked'){var section=((this.graphHeight-prop.vmarginTop-prop.vmarginBottom)/this.data.length);var x=this.getXCoord(0);for(var j=0;j<this.data[i].length;++j,++sequentialIndex){var outerHeight=(this.graphHeight-prop.vmarginTop-prop.vmarginBottom)/this.data.length,width=ma.abs((this.data[i][j]/(this.max-this.min))*this.graphWidth),height=outerHeight-(2*prop.vmargin),y=prop.gutterTop+prop.vmargin+prop.vmarginTop+(outerHeight*i);if(j===0&&prop.shadow){var fullWidth=ma.abs((RG.SVG.arraySum(this.data[i])/(this.max-this.min))*this.graphWidth);var rect=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'rect',attr:{x:x,y:y,width:fullWidth,height:height,fill:'white','stroke-width':0,'data-index':i,filter:'url(#dropShadow)'}});this.stackedBackfaces[i]=rect;}
|
28
|
-
var rect=RG.SVG.create({svg:this.svg,type:'rect',parent:this.svg.all,attr:{stroke:prop['strokestyle'],fill:prop.colorsSequential?(prop.colors[sequentialIndex]?prop.colors[sequentialIndex]:prop.colors[prop.colors.length-1]):(prop.colors[j]?prop.colors[j]:prop.colors[prop.colors.length-1]),x:x,y:y,width:width,height:height,'stroke-width':prop.linewidth,'data-original-width':width,'data-original-height':height,'data-original-x':x,'data-original-y':y,'data-index':i,'data-sequential-index':sequentialIndex,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[sequentialIndex]:'','data-value':this.data[i][j]}});this.coords.push({object:rect,x:x,y:y,width:width,height:height});if(!
|
30
|
+
var rect=RG.SVG.create({svg:this.svg,type:'rect',parent:this.svg.all,attr:{stroke:prop['strokestyle'],fill:prop.colorsSequential?(prop.colors[sequentialIndex]?prop.colors[sequentialIndex]:prop.colors[prop.colors.length-1]):(prop.colors[j]?prop.colors[j]:prop.colors[prop.colors.length-1]),x:x,y:y,width:width,height:height,'stroke-width':prop.linewidth,'data-original-width':width,'data-original-height':height,'data-original-x':x,'data-original-y':y,'data-index':i,'data-sequential-index':sequentialIndex,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[sequentialIndex]:'','data-value':this.data[i][j]}});this.coords.push({object:this,element:rect,x:parseFloat(rect.getAttribute('x')),y:parseFloat(rect.getAttribute('y')),width:parseFloat(rect.getAttribute('width')),height:parseFloat(rect.getAttribute('height'))});if(!this.coords2[i]){this.coords2[i]=[];}
|
31
|
+
this.coords2[i].push({object:this,element:rect,x:parseFloat(rect.getAttribute('x')),y:parseFloat(rect.getAttribute('y')),width:parseFloat(rect.getAttribute('width')),height:parseFloat(rect.getAttribute('height'))});if(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips[sequentialIndex]){var obj=this;(function(idx,seq)
|
29
32
|
{rect.addEventListener(prop.tooltipsEvent.replace(/^on/,''),function(e)
|
30
33
|
{obj.removeHighlight();var indexes=RG.SVG.sequentialIndexToGrouped(seq,obj.data);RG.SVG.tooltip({object:obj,index:indexes[1],group:idx,sequentialIndex:seq,text:prop.tooltips[seq],event:e});obj.highlight(e.target);},false);rect.addEventListener('mousemove',function(e)
|
31
34
|
{e.target.style.cursor='pointer'},false);})(i,sequentialIndex);}
|
@@ -36,25 +39,25 @@ var x;if(value<this.scale.min){return null;}
|
|
36
39
|
x=((value-this.scale.min)/(this.scale.max-this.scale.min));x*=this.graphWidth;x+=prop.gutterLeft;return x;};this.getWidth=function(value)
|
37
40
|
{if(this.scale.max<=0&&this.scale.min<this.scale.max){var x1=this.getXCoord(this.scale.max);var x2=this.getXCoord(value);}else if(this.scale.min>0&&this.scale.max>this.scale.min){var x1=this.getXCoord(this.scale.min);var x2=this.getXCoord(value);}else{var x1=this.getXCoord(0);var x2=this.getXCoord(value);}
|
38
41
|
return ma.abs(x1-x2);};this.highlight=function(rect)
|
39
|
-
{var x=rect.getAttribute('x'),y=rect.getAttribute('y'),width=rect.getAttribute('width'),height=rect.getAttribute('height');var highlight=RG.SVG.create({svg:this.svg,type:'rect',parent:this.svg.all,attr:{stroke:prop.highlightStroke,fill:prop.highlightFill,x:x,y:y,width:width,height:height,'stroke-width':prop.highlightLinewidth}});RG.SVG.REG.set('highlight',highlight);};this.parseColors=function()
|
42
|
+
{var x=rect.getAttribute('x'),y=rect.getAttribute('y'),width=rect.getAttribute('width'),height=rect.getAttribute('height');var highlight=RG.SVG.create({svg:this.svg,type:'rect',parent:this.svg.all,attr:{stroke:prop.highlightStroke,fill:prop.highlightFill,x:x,y:y,width:width,height:height,'stroke-width':prop.highlightLinewidth},style:{pointerEvents:'none'}});RG.SVG.REG.set('highlight',highlight);};this.parseColors=function()
|
40
43
|
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),backgroundGridColor:RG.SVG.arrayClone(prop.backgroundGridColor),highlightFill:RG.SVG.arrayClone(prop.highlightFill),backgroundColor:RG.SVG.arrayClone(prop.backgroundColor)}}
|
41
44
|
var colors=prop.colors;if(colors){for(var i=0;i<colors.length;++i){colors[i]=RG.SVG.parseColorLinear({object:this,color:colors[i],direction:'horizontal',start:prop.gutterLeft,end:this.width-prop.gutterRight});}}
|
42
45
|
prop.backgroundGridColor=RG.SVG.parseColorLinear({object:this,color:prop.backgroundGridColor,direction:'horizontal',start:prop.gutterLeft,end:this.width-prop.gutterRight});prop.highlightFill=RG.SVG.parseColorLinear({object:this,color:prop.highlightFill,direction:'horizontal',start:prop.gutterLeft,end:this.width-prop.gutterRight});prop.backgroundColor=RG.SVG.parseColorLinear({object:this,color:prop.backgroundColor});};this.drawLabelsAbove=function()
|
43
46
|
{if(prop.labelsAbove){var data=RG.SVG.arrayLinearize(this.data);for(var i=0;i<this.coords.length;++i){var value=data[i].toFixed(typeof prop.labelsAboveDecimals==='number'?prop.labelsAboveDecimals:prop.xaxisDecimals);var indexes=RG.SVG.sequentialIndexToGrouped(i,this.data);if(RG.SVG.isArray(this.data[indexes[0]])&&prop.grouping==='stacked'){if((indexes[1]+1)===this.data[indexes[0]].length){value=RG.SVG.arraySum(this.data[indexes[0]]);value=value.toFixed(typeof prop.labelsAboveDecimals==='number'?prop.labelsAboveDecimals:prop.xaxisDecimals);}else{continue;}}
|
44
|
-
var str=prop.labelsAboveSpecific?prop.labelsAboveSpecific[i].toString():RG.SVG.numberFormat({object:this,num:value,prepend:typeof prop.labelsAboveUnitsPre==='string'?prop.labelsAboveUnitsPre:null,append:typeof prop.labelsAboveUnitsPost==='string'?prop.labelsAboveUnitsPost:null,point:typeof prop.labelsAbovePoint==='string'?prop.labelsAbovePoint:null,thousand:typeof prop.labelsAboveThousand==='string'?prop.labelsAboveThousand:null,formatter:typeof prop.labelsAboveFormatter==='function'?prop.labelsAboveFormatter:null});var bold=typeof prop.labelsAboveBold==='boolean'?prop.labelsAboveBold:prop.textBold,italic=typeof prop.labelsAboveItalic==='boolean'?prop.labelsAboveItalic:prop.textItalic,size=prop.labelsAboveSize||prop.textSize,font=prop.labelsAboveFont||prop.textFont,halign=prop.labelsAboveHalign,valign=prop.labelsAboveValign;var dimensions=RG.SVG.measureText({text:str,bold:bold,font:font,size:size});var x=(value>=0)?(parseFloat(this.coords[i].
|
45
|
-
var text=RG.SVG.text({object:this,parent:this.svg.all,text:str,x:x,y:y,halign:halign,valign:valign,font:font,size:size,bold:bold,italic:italic,color:prop.labelsAboveColor||prop.textColor,background:prop.labelsAboveBackground||null,padding:prop.labelsAboveBackgroundPadding||0});}}};this.on=function(type,func)
|
47
|
+
var str=prop.labelsAboveSpecific?prop.labelsAboveSpecific[i].toString():RG.SVG.numberFormat({object:this,num:value,prepend:typeof prop.labelsAboveUnitsPre==='string'?prop.labelsAboveUnitsPre:null,append:typeof prop.labelsAboveUnitsPost==='string'?prop.labelsAboveUnitsPost:null,point:typeof prop.labelsAbovePoint==='string'?prop.labelsAbovePoint:null,thousand:typeof prop.labelsAboveThousand==='string'?prop.labelsAboveThousand:null,formatter:typeof prop.labelsAboveFormatter==='function'?prop.labelsAboveFormatter:null});var bold=typeof prop.labelsAboveBold==='boolean'?prop.labelsAboveBold:prop.textBold,italic=typeof prop.labelsAboveItalic==='boolean'?prop.labelsAboveItalic:prop.textItalic,size=prop.labelsAboveSize||prop.textSize,font=prop.labelsAboveFont||prop.textFont,halign=prop.labelsAboveHalign,valign=prop.labelsAboveValign;var dimensions=RG.SVG.measureText({text:str,bold:bold,font:font,size:size});var x=(value>=0)?(parseFloat(this.coords[i].element.getAttribute('x'))+parseFloat(this.coords[i].element.getAttribute('width'))+7+prop.labelsAboveOffsetx):parseFloat(this.coords[i].element.getAttribute('x')-7-prop.labelsAboveOffsetx),y=parseFloat(this.coords[i].element.getAttribute('y'))+parseFloat(this.coords[i].element.getAttribute('height')/2)+prop.labelsAboveOffsety,width=dimensions[0],height=dimensions[1],halign=(value>=0)?'left':'right';if(x+width>this.width&&value>0){halign='right';x=this.width-5;prop.labelsAboveBackground=prop.labelsAboveBackground||'rgba(255,255,255,0.95)';}
|
48
|
+
var text=RG.SVG.text({object:this,parent:this.svg.all,tag:'labels.above',text:str,x:x,y:y,halign:halign,valign:valign,font:font,size:size,bold:bold,italic:italic,color:prop.labelsAboveColor||prop.textColor,background:prop.labelsAboveBackground||null,padding:prop.labelsAboveBackgroundPadding||0});}}};this.on=function(type,func)
|
46
49
|
{if(type.substr(0,2)!=='on'){type='on'+type;}
|
47
50
|
RG.SVG.addCustomEventListener(this,type,func);return this;};this.exec=function(func)
|
48
51
|
{func(this);return this;};this.removeHighlight=function()
|
49
52
|
{var highlight=RG.SVG.REG.get('highlight');if(highlight&&highlight.parentNode){highlight.parentNode.removeChild(highlight);}
|
50
53
|
RG.SVG.REG.set('highlight',null);};this.grow=function()
|
51
54
|
{var opt=arguments[0]||{},frames=opt.frames||30,frame=0,obj=this,data=[],height=null,seq=0;data=RG.SVG.arrayClone(this.data);this.draw();var iterate=function()
|
52
|
-
{for(var i=0,seq=0,len=obj.coords.length;i<len;++i,++seq){var multiplier=(frame/frames)*RG.SVG.FX.getEasingMultiplier(frames,frame)*RG.SVG.FX.getEasingMultiplier(frames,frame);if(typeof data[i]==='number'){width=ma.abs(obj.getXCoord(data[i])-obj.getXCoord(0));obj.data[i]=data[i]*multiplier;width=multiplier*width;obj.coords[seq].
|
55
|
+
{for(var i=0,seq=0,len=obj.coords.length;i<len;++i,++seq){var multiplier=(frame/frames)*RG.SVG.FX.getEasingMultiplier(frames,frame)*RG.SVG.FX.getEasingMultiplier(frames,frame);if(typeof data[i]==='number'){width=ma.abs(obj.getXCoord(data[i])-obj.getXCoord(0));obj.data[i]=data[i]*multiplier;width=multiplier*width;obj.coords[seq].element.setAttribute('width',width);obj.coords[seq].element.setAttribute('x',data[i]>0?obj.getXCoord(0):obj.getXCoord(0)-width);}else if(typeof data[i]==='object'){var accumulativeWidth=0;for(var j=0,len2=data[i].length;j<len2;++j,++seq){width=ma.abs(obj.getXCoord(data[i][j])-obj.getXCoord(0));width=multiplier*width;obj.data[i][j]=data[i][j]*multiplier;obj.coords[seq].element.setAttribute('width',width);obj.coords[seq].element.setAttribute('x',data[i][j]>0?(obj.getXCoord(0)+accumulativeWidth):(obj.getXCoord(0)-width-accumulativeWidth));accumulativeWidth+=(prop.grouping==='stacked'?width:0);}
|
53
56
|
if(obj.stackedBackfaces[i]){obj.stackedBackfaces[i].setAttribute('width',accumulativeWidth);obj.stackedBackfaces[i].setAttribute('x',prop.gutterLeft);}
|
54
57
|
--seq;}}
|
55
58
|
if(frame++<frames){RG.SVG.FX.update(iterate);}else if(opt.callback){(opt.callback)(obj);}};iterate();return this;};this.wave=function()
|
56
|
-
{this.draw();var obj=this,opt=arguments[0]||{};opt.frames=opt.frames||60;opt.startFrames=[];opt.counters=[];var framesperbar=opt.frames/3,frame=-1,callback=opt.callback||function(){},width;for(var i=0,len=this.coords.length;i<len;i+=1){opt.startFrames[i]=((opt.frames/2)/(obj.coords.length-1))*i;opt.counters[i]=0;this.coords[i].
|
59
|
+
{this.draw();var obj=this,opt=arguments[0]||{};opt.frames=opt.frames||60;opt.startFrames=[];opt.counters=[];var framesperbar=opt.frames/3,frame=-1,callback=opt.callback||function(){},width;for(var i=0,len=this.coords.length;i<len;i+=1){opt.startFrames[i]=((opt.frames/2)/(obj.coords.length-1))*i;opt.counters[i]=0;this.coords[i].element.setAttribute('width',0);}
|
57
60
|
function iterator()
|
58
|
-
{++frame;for(var i=0,len=obj.coords.length;i<len;i+=1){if(frame>opt.startFrames[i]){var originalWidth=obj.coords[i].
|
61
|
+
{++frame;for(var i=0,len=obj.coords.length;i<len;i+=1){if(frame>opt.startFrames[i]){var originalWidth=obj.coords[i].element.getAttribute('data-original-width'),value=parseFloat(obj.coords[i].element.getAttribute('data-value'));obj.coords[i].element.setAttribute('width',width=ma.min(((frame-opt.startFrames[i])/framesperbar)*originalWidth,originalWidth));obj.coords[i].element.setAttribute('x',value>=0?obj.getXCoord(0):obj.getXCoord(0)-width);if(prop.grouping==='stacked'){var seq=obj.coords[i].element.getAttribute('data-sequential-index');var indexes=RG.SVG.sequentialIndexToGrouped(seq,obj.data);if(indexes[1]>0){obj.coords[i].element.setAttribute('x',parseInt(obj.coords[i-1].element.getAttribute('x'))+parseInt(obj.coords[i-1].element.getAttribute('width')));}}}}
|
59
62
|
if(frame>=opt.frames){callback(obj);}else{RG.SVG.FX.update(iterator);}}
|
60
63
|
iterator();return this;};for(i in conf.options){if(typeof i==='string'){this.set(i,conf.options[i]);}}};return this;})(window,document);
|
@@ -4,48 +4,58 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,do
|
|
4
4
|
{this.set=function(name,value)
|
5
5
|
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
|
6
6
|
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));if(RG.SVG.isArray(conf.data)&&RG.SVG.isArray(conf.data[0])){this.data=RG.SVG.arrayClone(conf.data);}else if(RG.SVG.isArray(conf.data)){this.data=[RG.SVG.arrayClone(conf.data)];}else{this.data=[[]];}
|
7
|
-
this.type='line';this.coords=[];this.coords2=[];this.coordsSpline=[];this.hasMultipleDatasets=typeof this.data[0]==='object'&&typeof this.data[1]==='object'?true:false;this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.originalData=RG.SVG.arrayClone(this.data);RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundColor:null,backgroundImage:null,backgroundImageStretch:true,backgroundImageAspect:'none',backgroundImageOpacity:null,backgroundImageX:null,backgroundImageY:null,backgroundImageW:null,backgroundImageH:null,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridLinewidth:1,backgroundGridHlines:true,backgroundGridHlinesCount:null,backgroundGridVlines:true,backgroundGridVlinesCount:null,backgroundGridBorder:true,backgroundGridDashed:false,backgroundGridDotted:false,backgroundGridDashArray:null,colors:['red','#0f0','blue','#ff0','#0ff','green'],filled:false,filledColors:[],filledClick:null,filledOpacity:1,filledAccumulative:false,hmargin:0,yaxis:true,yaxisTickmarks:true,yaxisTickmarksLength:3,yaxisColor:'black',yaxisScale:true,yaxisLabels:null,yaxisLabelsOffsetx:0,yaxisLabelsOffsety:0,yaxisLabelsCount:5,yaxisUnitsPre:'',yaxisUnitsPost:'',yaxisStrict:false,yaxisDecimals:0,yaxisPoint:'.',yaxisThousand:',',yaxisRound:false,yaxisMax:null,yaxisMin:0,yaxisFormatter:null,xaxis:true,xaxisTickmarks:true,xaxisTickmarksLength:5,xaxisLabels:null,xaxisLabelsOffsetx:0,xaxisLabelsOffsety:0,xaxisLabelsPosition:'edge',xaxisLabelsPositionEdgeTickmarksCount:null,xaxisColor:'black',textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'mousemove',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,tickmarksStyle:'none',tickmarksSize:5,tickmarksFill:'white',tickmarksLinewidth:1,labelsAbove:false,labelsAboveFont:null,labelsAboveSize:null,labelsAboveBold:null,labelsAboveItalic:null,labelsAboveColor:null,labelsAboveBackground:'rgba(255,255,255,0.7)',labelsAboveBackgroundPadding:2,labelsAboveUnitsPre:null,labelsAboveUnitsPost:null,labelsAbovePoint:null,labelsAboveThousand:null,labelsAboveFormatter:null,labelsAboveDecimals:null,labelsAboveOffsetx:0,labelsAboveOffsety:-10,labelsAboveHalign:'center',labelsAboveValign:'bottom',labelsAboveSpecific:null,shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,spline:false,title:'',titleSize:null,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:null,titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:
|
7
|
+
this.type='line';this.coords=[];this.coords2=[];this.coordsSpline=[];this.hasMultipleDatasets=typeof this.data[0]==='object'&&typeof this.data[1]==='object'?true:false;this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.originalData=RG.SVG.arrayClone(this.data);this.filledGroups=[];RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundColor:null,backgroundImage:null,backgroundImageStretch:true,backgroundImageAspect:'none',backgroundImageOpacity:null,backgroundImageX:null,backgroundImageY:null,backgroundImageW:null,backgroundImageH:null,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridLinewidth:1,backgroundGridHlines:true,backgroundGridHlinesCount:null,backgroundGridVlines:true,backgroundGridVlinesCount:null,backgroundGridBorder:true,backgroundGridDashed:false,backgroundGridDotted:false,backgroundGridDashArray:null,colors:['red','#0f0','blue','#ff0','#0ff','green'],filled:false,filledColors:[],filledClick:null,filledOpacity:1,filledAccumulative:false,hmargin:0,yaxis:true,yaxisTickmarks:true,yaxisTickmarksLength:3,yaxisColor:'black',yaxisScale:true,yaxisLabels:null,yaxisLabelsOffsetx:0,yaxisLabelsOffsety:0,yaxisLabelsCount:5,yaxisUnitsPre:'',yaxisUnitsPost:'',yaxisStrict:false,yaxisDecimals:0,yaxisPoint:'.',yaxisThousand:',',yaxisRound:false,yaxisMax:null,yaxisMin:0,yaxisFormatter:null,xaxis:true,xaxisTickmarks:true,xaxisTickmarksLength:5,xaxisLabels:null,xaxisLabelsOffsetx:0,xaxisLabelsOffsety:0,xaxisLabelsPosition:'edge',xaxisLabelsPositionEdgeTickmarksCount:null,xaxisColor:'black',textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'mousemove',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,tickmarksStyle:'none',tickmarksSize:5,tickmarksFill:'white',tickmarksLinewidth:1,labelsAbove:false,labelsAboveFont:null,labelsAboveSize:null,labelsAboveBold:null,labelsAboveItalic:null,labelsAboveColor:null,labelsAboveBackground:'rgba(255,255,255,0.7)',labelsAboveBackgroundPadding:2,labelsAboveUnitsPre:null,labelsAboveUnitsPost:null,labelsAbovePoint:null,labelsAboveThousand:null,labelsAboveFormatter:null,labelsAboveDecimals:null,labelsAboveOffsetx:0,labelsAboveOffsety:-10,labelsAboveHalign:'center',labelsAboveValign:'bottom',labelsAboveSpecific:null,shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,spline:false,stepped:false,title:'',titleSize:null,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:null,titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:null,titleSubtitleSize:10,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,errorbars:null,errorbarsColor:'black',errorbarsLinewidth:1,errorbarsCapwidth:10,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
8
8
|
var prop=this.properties;this.draw=function()
|
9
|
-
{RG.SVG.fireCustomEvent(this,'onbeforedraw');RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.coords=[];this.coords2=[];this.coordsSpline=[];this.data=RG.SVG.arrayClone(this.originalData);this.tooltipsSequentialIndex=0;
|
10
|
-
|
9
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.coords=[];this.coords2=[];this.coordsSpline=[];this.data=RG.SVG.arrayClone(this.originalData);this.tooltipsSequentialIndex=0;for(var i=0,tmp=[];i<this.data.length;++i){for(var j=0;j<this.data[i].length;++j){if(typeof tmp[j]==='undefined'){tmp[j]=0;}
|
10
|
+
if(prop.filled&&prop.filledAccumulative){tmp[j]+=this.data[i][j];if(i===(this.data.length-1)){tmp[j]+=(prop.errorbars?prop.errorbars[RG.SVG.groupedIndexToSequential({object:this,dataset:i,index:j})].max:0)}}else{tmp[j]=ma.max(tmp[j],this.data[i][j]+(prop.errorbars?prop.errorbars[RG.SVG.groupedIndexToSequential({object:this,dataset:i,index:j})].max:0));}}}
|
11
|
+
var values=[];for(var i=0,max=0;i<this.data.length;++i){if(RG.SVG.isArray(this.data[i])&&!prop.filledAccumulative){values.push(RG.SVG.arrayMax(tmp));}else if(RG.SVG.isArray(this.data[i])&&prop.filled&&prop.filledAccumulative){for(var j=0;j<this.data[i].length;++j){values[j]=values[j]||0;values[j]=values[j]+this.data[i][j];this.data[i][j]=values[j];}}}
|
12
|
+
if(prop.filled&&prop.filledAccumulative){var max=RG.SVG.arrayMax(tmp)}else{var max=RG.SVG.arrayMax(values);}
|
13
|
+
if(typeof prop.yaxisMax==='number'){max=prop.yaxisMax;}
|
11
14
|
if(prop.yaxisMin==='mirror'){var mirrorScale=true;prop.yaxisMin=0;}
|
12
15
|
this.scale=RG.SVG.getScale({object:this,numlabels:prop.yaxisLabelsCount,unitsPre:prop.yaxisUnitsPre,unitsPost:prop.yaxisUnitsPost,max:max,min:prop.yaxisMin,point:prop.yaxisPoint,round:prop.yaxisRound,thousand:prop.yaxisThousand,decimals:prop.yaxisDecimals,strict:typeof prop.yaxisMax==='number',formatter:prop.yaxisFormatter});if(mirrorScale){this.scale=RG.SVG.getScale({object:this,numlabels:prop.yaxisLabelsCount,unitsPre:prop.yaxisUnitsPre,unitsPost:prop.yaxisUnitsPost,max:this.scale.max,min:this.scale.max* -1,point:prop.yaxisPoint,round:false,thousand:prop.yaxisThousand,decimals:prop.yaxisDecimals,strict:typeof prop.yaxisMax==='number',formatter:prop.yaxisFormatter});}
|
13
|
-
this.max=this.scale.max;this.min=this.scale.min;
|
16
|
+
this.max=this.scale.max;this.min=this.scale.min;RG.SVG.drawBackground(this);RG.SVG.drawXAxis(this);RG.SVG.drawYAxis(this);for(var i=0;i<this.data.length;++i){this.drawLine(this.data[i],i);}
|
14
17
|
this.redrawLines();if(typeof prop.key!==null&&RG.SVG.drawKey){RG.SVG.drawKey(this);}else if(!RGraph.SVG.isNull(prop.key)){alert('The drawKey() function does not exist - have you forgotten to include the key library?');}
|
15
18
|
this.drawLabelsAbove();var obj=this;document.body.addEventListener('mousedown',function(e)
|
16
19
|
{RG.SVG.removeHighlight(obj);},false);RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawLine=function(data,index)
|
17
20
|
{var coords=[],path=[];for(var i=0,len=data.length;i<len;++i){var val=data[i],x=(((this.graphWidth-prop.hmargin-prop.hmargin)/(len-1))*i)+prop.gutterLeft+prop.hmargin,y=this.getYCoord(val);coords.push([x,y]);}
|
18
|
-
for(var i=0;i<coords.length;++i){if(i===0||RG.SVG.isNull(data[i])||RG.SVG.isNull(data[i-1])){var action='M';}else{
|
19
|
-
|
20
|
-
|
21
|
+
for(var i=0;i<coords.length;++i){if(i===0||RG.SVG.isNull(data[i])||RG.SVG.isNull(data[i-1])){var action='M';}else{if(prop.stepped){path.push('L {1} {2}'.format(coords[i][0],coords[i-1][1]));}
|
22
|
+
var action='L';}
|
23
|
+
path.push(action+'{1} {2}'.format(coords[i][0],RG.SVG.isNull(data[i])?0:coords[i][1]));}
|
24
|
+
for(var k=0;k<coords.length;++k){this.coords.push(RG.SVG.arrayClone(coords[k]));this.coords[this.coords.length-1].x=coords[k][0];this.coords[this.coords.length-1].y=coords[k][1];this.coords[this.coords.length-1].object=this;this.coords[this.coords.length-1].value=data[k];this.coords[this.coords.length-1].index=k;this.coords[this.coords.length-1].path=path;}
|
25
|
+
this.coords2[index]=RG.SVG.arrayClone(coords);for(var k=0;k<coords.length;++k){this.coords2[index][k].x=coords[k][0];this.coords2[index][k].y=coords[k][1];this.coords2[index][k].object=this;this.coords2[index][k].value=data[k];this.coords2[index][k].index=k;this.coords2[index][k].path=path;if(prop.errorbars){this.drawErrorbar({object:this,dataset:index,index:k,x:x,y:y});}}
|
26
|
+
if(prop.spline){this.coordsSpline[index]=this.drawSpline(coords);}
|
21
27
|
if(prop.filled===true||(typeof prop.filled==='object'&&prop.filled[index])){if(prop.spline){var fillPath=['M{1} {2}'.format(this.coordsSpline[index][0][0],this.coordsSpline[index][0][1])];for(var i=1;i<this.coordsSpline[index].length;++i){fillPath.push('L{1} {2}'.format(this.coordsSpline[index][i][0]+((i===(this.coordsSpline[index].length)-1)?1:0),this.coordsSpline[index][i][1]));}}else{var fillPath=RG.SVG.arrayClone(path);}
|
22
|
-
fillPath.push('L{1} {2}'.format(this.
|
23
|
-
fillPath.push('L{1} {2}'.format(this.
|
24
|
-
|
28
|
+
fillPath.push('L{1} {2}'.format(this.coords2[index][this.coords2[index].length-1][0]+1,index>0&&prop.filledAccumulative?(prop.spline?this.coordsSpline[index-1][this.coordsSpline[index-1].length-1][1]:this.coords2[index-1][this.coords2[index-1].length-1][1]):this.getYCoord(prop.yaxisMin>0?prop.yaxisMin:0)+(prop.xaxis?0:1)));if(index>0&&prop.filledAccumulative){var path2=RG.SVG.arrayClone(path);if(index>0&&prop.filledAccumulative){if(prop.spline){for(var i=this.coordsSpline[index-1].length-1;i>=0;--i){fillPath.push('L{1} {2}'.format(this.coordsSpline[index-1][i][0],this.coordsSpline[index-1][i][1]));}}else{for(var i=this.coords2[index-1].length-1;i>=0;--i){fillPath.push('L{1} {2}'.format(this.coords2[index-1][i][0],this.coords2[index-1][i][1]));if(prop.stepped&&i>0){fillPath.push('L{1} {2}'.format(this.coords2[index-1][i][0],this.coords2[index-1][i-1][1]));}}}}}else{fillPath.push('L{1} {2}'.format(this.coords2[index][0][0]+(prop.yaxis?1:0),this.getYCoord(prop.yaxisMin>0?prop.yaxisMin:0)+(prop.xaxis?0:1)));}
|
29
|
+
fillPath.push('L{1} {2}'.format(this.coords2[index][0][0]+(prop.yaxis?1:0),this.coords2[index][0][1]));for(var i=0;i<this.data[index].length;++i){if(!RG.SVG.isNull(this.data[index][i])){fillPath.push('L{1} {2}'.format(this.coords2[index][i][0],this.getYCoord(0)));break;}}
|
30
|
+
this.filledGroups[index]=RG.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{'class':'rgraph_filled_line_'+index}});var fillPathObject=RG.SVG.create({svg:this.svg,parent:this.filledGroups[index],type:'path',attr:{d:fillPath.join(' '),stroke:'rgba(0,0,0,0)','fill':prop.filledColors&&prop.filledColors[index]?prop.filledColors[index]:prop.colors[index],'fill-opacity':prop.filledOpacity,'stroke-width':1,'clip-path':this.isTrace?'url(#trace-effect-clip)':''}});if(prop.filledClick){var obj=this;fillPathObject.addEventListener('click',function(e)
|
25
31
|
{prop.filledClick(e,obj,index);},false);fillPathObject.addEventListener('mousemove',function(e)
|
26
32
|
{e.target.style.cursor='pointer';},false);}}
|
27
33
|
if(prop.shadow){RG.SVG.setShadow({object:this,offsetx:prop.shadowOffsetx,offsety:prop.shadowOffsety,blur:prop.shadowBlur,opacity:prop.shadowOpacity,id:'dropShadow'});}
|
28
34
|
if(prop.spline){var str=['M{1} {2}'.format(this.coordsSpline[index][0][0],this.coordsSpline[index][0][1])];for(var i=1;i<this.coordsSpline[index].length;++i){str.push('L{1} {2}'.format(this.coordsSpline[index][i][0],this.coordsSpline[index][i][1]));}
|
29
|
-
str=str.join(' ');var line=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:str,stroke:prop['colors'][index],'fill':'none','stroke-width':this.hasMultipleDatasets&&prop.filled&&prop.filledAccumulative?0.1:(RG.SVG.isArray(prop.linewidth)?prop.linewidth[index]:prop.linewidth+0.01),'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}else{var path2=RG.SVG.arrayClone(path);if(prop.filled&&prop.filledAccumulative&&index>0){for(var i=this.
|
30
|
-
path2=path2.join(' ');var line=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path2,stroke:prop.colors[index],'fill':'none','stroke-width':this.hasMultipleDatasets&&prop.filled&&prop.filledAccumulative?0.1:(RG.SVG.isArray(prop.linewidth)?prop.linewidth[index]:prop.linewidth+0.01),'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
31
|
-
if(prop.tooltips&&prop.tooltips.length){var group=RG.SVG.create({svg:this.svg,
|
35
|
+
str=str.join(' ');var line=RG.SVG.create({svg:this.svg,parent:prop.filled?this.filledGroups[index]:this.svg.all,type:'path',attr:{d:str,stroke:prop['colors'][index],'fill':'none','stroke-width':this.hasMultipleDatasets&&prop.filled&&prop.filledAccumulative?0.1:(RG.SVG.isArray(prop.linewidth)?prop.linewidth[index]:prop.linewidth+0.01),'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}else{var path2=RG.SVG.arrayClone(path);if(prop.filled&&prop.filledAccumulative&&index>0){for(var i=this.coords2[index-1].length-1;i>=0;--i){path2.push('L{1} {2}'.format(this.coords2[index-1][i][0],this.coords2[index-1][i][1]));}}
|
36
|
+
path2=path2.join(' ');var line=RG.SVG.create({svg:this.svg,parent:prop.filled?this.filledGroups[index]:this.svg.all,type:'path',attr:{d:path2,stroke:prop.colors[index],'fill':'none','stroke-width':this.hasMultipleDatasets&&prop.filled&&prop.filledAccumulative?0.1:(RG.SVG.isArray(prop.linewidth)?prop.linewidth[index]:prop.linewidth+0.01),'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
37
|
+
if(prop.tooltips&&prop.tooltips.length){if(!this.svg.all.line_tooltip_hotspots){var group=RG.SVG.create({svg:this.svg,type:'g',attr:{'fill':'transparent',className:"rgraph_hotspots"},style:{cursor:'pointer'}});this.svg.all.line_tooltip_hotspots=group;}else{group=this.svg.all.line_tooltip_hotspots;}
|
38
|
+
for(var i=0;i<this.coords2[index].length&&this.tooltipsSequentialIndex<prop.tooltips.length;++i,++this.tooltipsSequentialIndex){if(!RG.SVG.isNull(this.originalData[index][i])&&prop.tooltips[this.tooltipsSequentialIndex]&&this.coords2[index][i][0]&&this.coords2[index][i][1]){var hotspot=RG.SVG.create({svg:this.svg,parent:group,type:'circle',attr:{cx:this.coords2[index][i][0],cy:this.coords2[index][i][1],r:10,fill:'transparent','data-dataset':index,'data-index':i},style:{cursor:'pointer'}});var obj=this;(function(sequentialIndex)
|
32
39
|
{hotspot.addEventListener(prop.tooltipsEvent,function(e)
|
33
40
|
{var indexes=RG.SVG.sequentialIndexToGrouped(sequentialIndex,obj.data),index=indexes[1],dataset=indexes[0];if(RG.SVG.REG.get('tooltip')&&RG.SVG.REG.get('tooltip').__index__===index&&RG.SVG.REG.get('tooltip').__dataset__===dataset){return;}
|
34
|
-
RG.SVG.hideTooltip();if(prop.tooltips[sequentialIndex]){var text=prop.tooltips[sequentialIndex];}
|
35
|
-
RG.SVG.tooltip({object:obj,index:index,dataset:dataset,sequentialIndex:sequentialIndex,text:text,event:e});var outer_highlight1=RG.SVG.create({svg:obj.svg,parent:obj.svg.all,type:'circle',attr:{cx:obj.
|
36
|
-
{for(var i=0;i<data.length;++i){if(typeof data[i]==='number'){switch(
|
37
|
-
break;case'circle':case'endcircle':if(
|
38
|
-
break;case'endrect':case'rect':if(
|
39
|
-
break;case'filledendrect':case'filledrect':if(
|
41
|
+
obj.removeHighlight();RG.SVG.hideTooltip();if(prop.tooltips[sequentialIndex]){var text=prop.tooltips[sequentialIndex];}
|
42
|
+
RG.SVG.tooltip({object:obj,index:index,dataset:dataset,sequentialIndex:sequentialIndex,text:text,event:e});var outer_highlight1=RG.SVG.create({svg:obj.svg,parent:obj.svg.all,type:'circle',attr:{cx:obj.coords2[dataset][index][0],cy:obj.coords2[dataset][index][1],r:5,fill:obj.properties.colors[dataset],'fill-opacity':0.5},style:{cursor:'pointer'}});var outer_highlight2=RG.SVG.create({svg:obj.svg,parent:obj.svg.all,type:'circle',attr:{cx:obj.coords2[dataset][index][0],cy:obj.coords2[dataset][index][1],r:14,fill:'white','fill-opacity':0.75},style:{cursor:'pointer'}});var inner_highlight1=RG.SVG.create({svg:obj.svg,parent:obj.svg.all,type:'circle',attr:{cx:obj.coords2[dataset][index][0],cy:obj.coords2[dataset][index][1],r:6,fill:'white'},style:{cursor:'pointer'}});var inner_highlight2=RG.SVG.create({svg:obj.svg,parent:obj.svg.all,type:'circle',attr:{cx:obj.coords2[dataset][index][0],cy:obj.coords2[dataset][index][1],r:5,fill:obj.properties.colors[dataset]},style:{cursor:'pointer'}});RG.SVG.REG.set('highlight',[outer_highlight1,outer_highlight2,inner_highlight1,inner_highlight2]);},false);})(this.tooltipsSequentialIndex);}}}};this.drawTickmarks=function(index,data,coords)
|
43
|
+
{var style=typeof prop.tickmarksStyle==='object'?prop.tickmarksStyle[index]:prop.tickmarksStyle,size=typeof prop.tickmarksSize==='object'?prop.tickmarksSize[index]:prop.tickmarksSize,fill=typeof prop.tickmarksFill==='object'?prop.tickmarksFill[index]:prop.tickmarksFill,linewidth=typeof prop.tickmarksLinewidth==='object'?prop.tickmarksLinewidth[index]:prop.tickmarksLinewidth;for(var i=0;i<data.length;++i){if(typeof data[i]==='number'){switch(style){case'filledcircle':case'filledendcircle':if(style==='filledcircle'||(i===0||i===data.length-1)){var circle=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'circle',attr:{cx:coords[index][i][0],cy:coords[index][i][1],r:size,'fill':prop.colors[index],filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
44
|
+
break;case'circle':case'endcircle':if(style==='circle'||(style==='endcircle'&&(i===0||i===data.length-1))){var outerCircle=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'circle',attr:{cx:coords[index][i][0],cy:coords[index][i][1],r:size+linewidth,'fill':prop.colors[index],filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});var innerCircle=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'circle',attr:{cx:coords[index][i][0],cy:coords[index][i][1],r:size,'fill':fill,'clip-path':this.isTrace?'url(#trace-effect-clip)':''}});break;}
|
45
|
+
break;case'endrect':case'rect':if(style==='rect'||(style==='endrect'&&(i===0||i===data.length-1))){var fill=typeof fill==='object'&&typeof fill[index]==='string'?fill[index]:fill;var rect=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'rect',attr:{x:coords[index][i][0]-size,y:coords[index][i][1]-size,width:size+size+linewidth,height:size+size+linewidth,'stroke-width':linewidth,'stroke':prop.colors[index],'fill':fill,'clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
46
|
+
break;case'filledendrect':case'filledrect':if(style==='filledrect'||(style==='filledendrect'&&(i===0||i===data.length-1))){var fill=prop.colors[index];var rect=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'rect',attr:{x:coords[index][i][0]-size,y:coords[index][i][1]-size,width:size+size+linewidth,height:size+size+linewidth,'fill':fill,'clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}}}}};this.redrawLines=function()
|
40
47
|
{if(prop.spline){for(var i=0;i<this.coordsSpline.length;++i){var linewidth=RG.SVG.isArray(prop.linewidth)?prop.linewidth[i]:prop.linewidth,color=prop['colors'][i],path='';for(var j=0;j<this.coordsSpline[i].length;++j){if(j===0){path+='M{1} {2} '.format(this.coordsSpline[i][j][0],this.coordsSpline[i][j][1]);}else{path+='L{1} {2} '.format(this.coordsSpline[i][j][0],this.coordsSpline[i][j][1]);}}
|
41
|
-
RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,stroke:color,'fill':'none','stroke-width':linewidth+0.01,'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
42
|
-
for(var dataset=0;dataset<this.
|
43
|
-
|
44
|
-
|
48
|
+
RG.SVG.create({svg:this.svg,parent:prop.filled?this.filledGroups[i]:this.svg.all,type:'path',attr:{d:path,stroke:color,'fill':'none','stroke-width':linewidth+0.01,'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropShadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
49
|
+
for(var dataset=0;dataset<this.coords2.length;++dataset){this.drawTickmarks(dataset,this.data[dataset],this.coords2);}}else{for(var i=0;i<this.coords2.length;++i){var linewidth=RG.SVG.isArray(prop.linewidth)?prop.linewidth[i]:prop.linewidth,color=prop['colors'][i],path='';for(var j=0;j<this.coords2[i].length;++j){if(j===0||RG.SVG.isNull(this.data[i][j])||RG.SVG.isNull(this.data[i][j-1])){path+='M{1} {2} '.format(this.coords2[i][j][0],RG.SVG.isNull(this.data[i][j])?0:this.coords2[i][j][1]);}else{if(prop.stepped){path+='L{1} {2} '.format(this.coords2[i][j][0],this.coords2[i][j-1][1]);}
|
50
|
+
path+='L{1} {2} '.format(this.coords2[i][j][0],this.coords2[i][j][1]);}}
|
51
|
+
RG.SVG.create({svg:this.svg,parent:prop.filled?this.filledGroups[i]:this.svg.all,type:'path',attr:{d:path,stroke:color,'fill':'none','stroke-width':linewidth+0.01,'stroke-linecap':'round','stroke-linejoin':'round',filter:prop.shadow?'url(#dropshadow)':'','clip-path':this.isTrace?'url(#trace-effect-clip)':''}});}
|
52
|
+
for(var dataset=0;dataset<this.coords2.length;++dataset){this.drawTickmarks(dataset,this.data[dataset],this.coords2);}}};this.getYCoord=function(value)
|
45
53
|
{var prop=this.properties,y;if(value>this.scale.max){return null;}
|
46
54
|
if(value<this.scale.min){return null;}
|
47
55
|
y=((value-this.scale.min)/(this.scale.max-this.scale.min));y*=(this.height-prop.gutterTop-prop.gutterBottom);y=this.height-prop.gutterBottom-y;return y;};this.highlight=function(rect)
|
48
|
-
{var x=rect.getAttribute('x'),y=rect.getAttribute('y');};this.
|
56
|
+
{var x=rect.getAttribute('x'),y=rect.getAttribute('y');};this.removeHighlight=function()
|
57
|
+
{var highlight=RG.SVG.REG.get('highlight');if(highlight&&highlight.parentNode){highlight.parentNode.removeChild(highlight);}else if(highlight){for(var i=0;i<highlight.length;++i){if(highlight[i]&&highlight[i].parentNode){highlight[i].parentNode.removeChild(highlight[i]);}}}
|
58
|
+
RG.SVG.REG.set('highlight',null);};this.drawSpline=function(coords)
|
49
59
|
{var xCoords=[];gutterLeft=prop.gutterLeft,gutterRight=prop.gutterRight,hmargin=prop.hmargin,interval=(this.graphWidth-(2*hmargin))/(coords.length-1),coordsSpline=[];for(var i=0,len=coords.length;i<len;i+=1){if(typeof coords[i]=='object'&&coords[i]&&coords[i].length==2){coords[i]=Number(coords[i][1]);}}
|
50
60
|
var P=[coords[0]];for(var i=0;i<coords.length;++i){P.push(coords[i]);}
|
51
61
|
P.push(coords[coords.length-1]+(coords[coords.length-1]-coords[coords.length-2]));for(var j=1;j<P.length-2;++j){for(var t=0;t<10;++t){var yCoord=spline(t/10,P[j-1],P[j],P[j+1],P[j+2]);xCoords.push(((j-1)*interval)+(t*(interval/10))+gutterLeft+hmargin);coordsSpline.push([xCoords[xCoords.length-1],yCoord]);if(typeof index==='number'){coordsSpline[index].push([xCoords[xCoords.length-1],yCoord]);}}}
|
@@ -55,17 +65,21 @@ function spline(t,P0,P1,P2,P3)
|
|
55
65
|
((0-P0)+P2)*t+
|
56
66
|
((2*P0-(5*P1)+(4*P2)-P3)*(t*t)+
|
57
67
|
((0-P0)+(3*P1)-(3*P2)+P3)*(t*t*t)));}
|
68
|
+
for(var i=0;i<coordsSpline.length;++i){coordsSpline[i].object=this;coordsSpline[i].x=this;coordsSpline[i].y=this;}
|
58
69
|
return coordsSpline;};this.parseColors=function()
|
59
70
|
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),filledColors:RG.SVG.arrayClone(prop.filledColors),backgroundGridColor:RG.SVG.arrayClone(prop.backgroundGridColor),highlightFill:RG.SVG.arrayClone(prop.highlightFill),backgroundColor:RG.SVG.arrayClone(prop.backgroundColor)}}
|
60
71
|
var colors=prop.colors;if(colors){for(var i=0;i<colors.length;++i){colors[i]=RG.SVG.parseColorLinear({object:this,color:colors[i]});}}
|
61
72
|
var filledColors=prop.filledColors;if(filledColors){for(var i=0;i<filledColors.length;++i){filledColors[i]=RG.SVG.parseColorLinear({object:this,color:filledColors[i]});}}
|
62
73
|
prop.backgroundGridColor=RG.SVG.parseColorLinear({object:this,color:prop.backgroundGridColor});prop.highlightFill=RG.SVG.parseColorLinear({object:this,color:prop.highlightFill});prop.backgroundColor=RG.SVG.parseColorLinear({object:this,color:prop.backgroundColor});};this.drawLabelsAbove=function()
|
63
|
-
{if(prop.labelsAbove){var data_seq=RG.SVG.arrayLinearize(this.data),seq=0;for(var dataset=0;dataset<this.
|
64
|
-
RG.SVG.text({object:this,parent:this.svg.all,text:str,x:parseFloat(this.
|
74
|
+
{if(prop.labelsAbove){var data_seq=RG.SVG.arrayLinearize(this.data),seq=0;for(var dataset=0;dataset<this.coords2.length;++dataset,seq++){for(var i=0;i<this.coords2[dataset].length;++i,seq++){var str=RG.SVG.numberFormat({object:this,num:this.data[dataset][i].toFixed(prop.labelsAboveDecimals),prepend:typeof prop.labelsAboveUnitsPre==='string'?prop.labelsAboveUnitsPre:null,append:typeof prop.labelsAboveUnitsPost==='string'?prop.labelsAboveUnitsPost:null,point:typeof prop.labelsAbovePoint==='string'?prop.labelsAbovePoint:null,thousand:typeof prop.labelsAboveThousand==='string'?prop.labelsAboveThousand:null,formatter:typeof prop.labelsAboveFormatter==='function'?prop.labelsAboveFormatter:null});if(prop.labelsAboveSpecific&&prop.labelsAboveSpecific.length&&(typeof prop.labelsAboveSpecific[seq]==='string'||typeof prop.labelsAboveSpecific[seq]==='number')){str=prop.labelsAboveSpecific[seq];}else if(prop.labelsAboveSpecific&&prop.labelsAboveSpecific.length&&typeof prop.labelsAboveSpecific[seq]!=='string'&&typeof prop.labelsAboveSpecific[seq]!=='number'){continue;}
|
75
|
+
RG.SVG.text({object:this,parent:this.svg.all,tag:'labels.above',text:str,x:parseFloat(this.coords2[dataset][i][0])+prop.labelsAboveOffsetx,y:parseFloat(this.coords2[dataset][i][1])+prop.labelsAboveOffsety,halign:prop.labelsAboveHalign,valign:prop.labelsAboveValign,font:prop.labelsAboveFont||prop.textFont,size:prop.labelsAboveSize||prop.textSize,bold:prop.labelsAboveBold||prop.textBold,italic:prop.labelsAboveItalic||prop.textItalic,color:prop.labelsAboveColor||prop.textColor,background:prop.labelsAboveBackground||null,padding:prop.labelsAboveBackgroundPadding||0});}
|
65
76
|
seq--;}}};this.on=function(type,func)
|
66
77
|
{if(type.substr(0,2)!=='on'){type='on'+type;}
|
67
78
|
RG.SVG.addCustomEventListener(this,type,func);return this;};this.exec=function(func)
|
68
|
-
{func(this);return this;};this.
|
69
|
-
{var opt=
|
70
|
-
|
79
|
+
{func(this);return this;};this.drawErrorbar=function(opt)
|
80
|
+
{var linewidth=RG.SVG.getErrorbarsLinewidth({object:this,index:opt.index}),color=RG.SVG.getErrorbarsColor({object:this,index:opt.index}),capwidth=RG.SVG.getErrorbarsCapWidth({object:this,index:opt.index}),index=opt.index,dataset=opt.dataset,x=opt.x,y=opt.y,value=this.data[dataset][index],seq=RG.SVG.groupedIndexToSequential({dataset:dataset,index:index,object:this});var y=this.getYCoord(y);var max=RG.SVG.getErrorbarsMaxValue({object:this,index:seq});var min=RG.SVG.getErrorbarsMinValue({object:this,index:seq});if(!max&&!min){return;}
|
81
|
+
var x=this.coords2[dataset][index].x,y=this.coords2[dataset][index].y,halfCapWidth=capwidth/2,y1=this.getYCoord(value+max),y3=this.getYCoord(value-min)===null?y:this.getYCoord(value-min);if(max>0){var errorbarLine=RG.SVG.create({svg:this.svg,type:'line',parent:this.svg.all,attr:{x1:x,y1:y,x2:x,y2:y1,stroke:color,'stroke-width':linewidth}});var errorbarCap=RG.SVG.create({svg:this.svg,type:'line',parent:this.svg.all,attr:{x1:x-halfCapWidth,y1:y1,x2:x+halfCapWidth,y2:y1,stroke:color,'stroke-width':linewidth}});}
|
82
|
+
if(typeof min==='number'){var errorbarLine=RG.SVG.create({svg:this.svg,type:'line',parent:this.svg.all,attr:{x1:x,y1:y,x2:x,y2:y3,stroke:color,'stroke-width':linewidth}});var errorbarCap=RG.SVG.create({svg:this.svg,type:'line',parent:this.svg.all,attr:{x1:x-halfCapWidth,y1:y3,x2:x+halfCapWidth,y2:y3,stroke:color,'stroke-width':linewidth}});}};this.trace=function()
|
83
|
+
{var opt=arguments[0]||{},frame=1,frames=opt.frames||60,obj=this;this.isTrace=true;this.draw();var clippath=RG.SVG.create({svg:this.svg,parent:this.svg.defs,type:'clipPath',attr:{id:'trace-effect-clip'}});var clippathrect=RG.SVG.create({svg:this.svg,parent:clippath,type:'rect',attr:{x:0,y:0,width:0,height:this.height}});var iterator=function()
|
84
|
+
{var width=(frame++)/frames*obj.width;clippathrect.setAttribute("width",width);if(frame<=frames){RG.SVG.FX.update(iterator);}else{clippath.parentNode.removeChild(clippath);if(opt.callback){(opt.callback)(obj);}}};iterator();return this;};for(i in conf.options){if(typeof i==='string'){this.set(i,conf.options[i]);}}}
|
71
85
|
return this;})(window,document);
|
@@ -3,45 +3,47 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,do
|
|
3
3
|
{var RG=RGraph,ua=navigator.userAgent,ma=Math,win=window,doc=document;RG.SVG.Pie=function(conf)
|
4
4
|
{this.set=function(name,value)
|
5
5
|
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
|
6
|
-
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=conf.data;this.type='pie';this.angles=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,colors:['#f66','#6f6','#66f','#ff6','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],strokestyle:'rgba(0,0,0,0)',margin:3,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],labelsSticks:true,labelsSticksHlength:50,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:
|
6
|
+
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=conf.data;this.type='pie';this.angles=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,colors:['#f66','#6f6','#66f','#ff6','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],strokestyle:'rgba(0,0,0,0)',margin:3,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],labelsSticks:true,labelsSticksHlength:50,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,highlightStyle:'normal',highlightStyleOutlineWidth:7,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:null,titleSubtitleSize:10,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,exploded:0,roundRobinMultiplier:1,donut:false,donutWidth:75,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
7
7
|
var prop=this.properties;this.draw=function()
|
8
|
-
{RG.SVG.fireCustomEvent(this,'onbeforedraw');RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;this.centerx=(this.graphWidth/2)+prop.gutterLeft;this.centery=(this.graphHeight/2)+prop.gutterTop;this.radius=ma.min(this.graphWidth,this.graphHeight)/2;this.centerx=typeof prop.centerx==='number'?prop.centerx:this.centerx;this.centery=typeof prop.centery==='number'?prop.centery:this.centery;this.radius=typeof prop.radius==='number'?prop.radius:this.radius;if(typeof prop.radius==='string'&&prop.radius.match(/^\+|-\d+$/))this.radius+=parseFloat(prop.radius);if(typeof prop.centerx==='string'&&prop.centerx.match(/^\+|-\d+$/))this.centerx+=parseFloat(prop.centerx);if(typeof prop.centery==='string'&&prop.centery.match(/^\+|-\d+$/))this.centery+=parseFloat(prop.centery);RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.max=RG.SVG.arrayMax(this.data);this.total=RG.SVG.arraySum(this.data);if(typeof prop.exploded==='number'&&prop.exploded>0){var val=prop.exploded;prop.exploded=[];for(var i=0;i<this.data.length;++i){prop.exploded[i]=val;}}
|
8
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.angles=[];this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;this.centerx=(this.graphWidth/2)+prop.gutterLeft;this.centery=(this.graphHeight/2)+prop.gutterTop;this.radius=ma.min(this.graphWidth,this.graphHeight)/2;this.centerx=typeof prop.centerx==='number'?prop.centerx:this.centerx;this.centery=typeof prop.centery==='number'?prop.centery:this.centery;this.radius=typeof prop.radius==='number'?prop.radius:this.radius;if(typeof prop.radius==='string'&&prop.radius.match(/^\+|-\d+$/))this.radius+=parseFloat(prop.radius);if(typeof prop.centerx==='string'&&prop.centerx.match(/^\+|-\d+$/))this.centerx+=parseFloat(prop.centerx);if(typeof prop.centery==='string'&&prop.centery.match(/^\+|-\d+$/))this.centery+=parseFloat(prop.centery);RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.max=RG.SVG.arrayMax(this.data);this.total=RG.SVG.arraySum(this.data);if(typeof prop.exploded==='number'&&prop.exploded>0){var val=prop.exploded;prop.exploded=[];for(var i=0;i<this.data.length;++i){prop.exploded[i]=val;}}
|
9
9
|
this.drawSegments({shadow:true});RG.SVG.drawTitle(this);if(prop.labelsSticks){this.drawLabelsSticks();}else{this.drawLabels();}
|
10
10
|
this.drawIngraphLabels();if(typeof prop.key!==null&&RG.SVG.drawKey){RG.SVG.drawKey(this);}else if(!RGraph.SVG.isNull(prop.key)){alert('The drawKey() function does not exist - have you forgotten to include the key library?');}
|
11
11
|
var obj=this;document.body.addEventListener('mousedown',function(e)
|
12
12
|
{RG.SVG.removeHighlight(obj);},false);RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawSegments=function(opt)
|
13
|
-
{var start=0,end=0,angle=0,sum=RG.SVG.arraySum(this.data),segment=0;for(var i=0,len=this.data.length;i<len;++i){var value=this.data[i]*prop.roundRobinMultiplier;start=angle;segment=((value/sum)*RG.SVG.TRIG.TWOPI);end=start+segment;var explosion=RG.SVG.TRIG.getRadiusEndPoint({angle:start+(segment/2),r:prop.exploded[i]});var explosionX=explosion[1],explosionY=explosion[0];this.angles[i]={start:start,end:end,angle:end-start,halfway:((end-start)/2)+start,cx:this.centerx+(parseFloat(explosionX)||0),cy:this.centery-(parseFloat(explosionY)||0),radius:this.radius};angle+=(end-start);}
|
13
|
+
{var start=0,end=0,angle=0,sum=RG.SVG.arraySum(this.data),segment=0;for(var i=0,len=this.data.length;i<len;++i){var value=this.data[i]*prop.roundRobinMultiplier;start=angle;segment=((value/sum)*RG.SVG.TRIG.TWOPI);end=start+segment;var explosion=RG.SVG.TRIG.getRadiusEndPoint({angle:start+(segment/2),r:prop.exploded[i]});var explosionX=explosion[1],explosionY=explosion[0];this.angles[i]={start:start,end:end,angle:end-start,halfway:((end-start)/2)+start,cx:this.centerx+(parseFloat(explosionX)||0),cy:this.centery-(parseFloat(explosionY)||0),radius:this.radius,object:this};angle+=(end-start);}
|
14
14
|
if(opt.shadow){RG.SVG.setShadow({object:this,offsetx:prop.shadowOffsetx,offsety:prop.shadowOffsety,blur:prop.shadowBlur,opacity:prop.shadowOpacity,id:'dropShadow'});}
|
15
|
-
for(var i=0;i<this.angles.length;++i){var path=RG.SVG.TRIG.getArcPath({cx:this.angles[i].cx,cy:this.angles[i].cy,r:this.radius,start:this.angles[i].start,end:this.angles[i].end});if(prop.donut){var donutWidth=prop.donutWidth;var donut_path=RG.SVG.TRIG.
|
15
|
+
for(var i=0;i<this.angles.length;++i){var path=RG.SVG.TRIG.getArcPath({cx:this.angles[i].cx,cy:this.angles[i].cy,r:this.radius,start:this.angles[i].start,end:this.angles[i].end});if(prop.donut){var donutWidth=prop.donutWidth;var donut_path=RG.SVG.TRIG.getArcPath3({cx:this.angles[i].cx,cy:this.angles[i].cy,r:this.radius-donutWidth,start:this.angles[i].end,end:this.angles[i].start,moveto:false,anticlockwise:true});var xy=RG.SVG.TRIG.getRadiusEndPoint({angle:this.angles[i].end-RG.SVG.TRIG.HALFPI,r:this.radius-donutWidth});path=path
|
16
16
|
+" L {1} {2} ".format(xy[0]+this.angles[i].cx,xy[1]+this.angles[i].cy)
|
17
17
|
+donut_path
|
18
18
|
+" Z";}else{path=path+" L {1} {2} ".format(this.angles[i].cx,this.angles[i].cy)+" Z"}
|
19
|
-
var arc=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.colors[i],stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-index':i,'data-value':value,'data-start-angle':this.angles[i].start,'data-end-angle':this.angles[i].end,'data-radius':this.radius,filter:(prop.shadow&&opt.shadow)?'url(#dropShadow)':''}});if(prop.shadow&&opt.shadow){this.shadowNodes[i]=arc;}else{this.nodes[i]=arc;}
|
19
|
+
var arc=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.colors[i],stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-index':i,'data-value':value,'data-start-angle':this.angles[i].start,'data-end-angle':this.angles[i].end,'data-radius':this.radius,filter:(prop.shadow&&opt.shadow)?'url(#dropShadow)':''}});this.angles[i].element=arc;if(prop.shadow&&opt.shadow){this.shadowNodes[i]=arc;}else{this.nodes[i]=arc;}
|
20
20
|
if(prop.tooltips&&prop.tooltips[i]&&(!opt.shadow||!prop.shadow)){if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
|
21
21
|
(function(index,obj)
|
22
22
|
{arc.addEventListener(prop.tooltipsEvent,function(e)
|
23
|
-
{
|
23
|
+
{var tooltip=RG.SVG.REG.get('tooltip');if(tooltip&&prop.tooltipsEvent==='mousemove'&&index===tooltip.__index__){return;}
|
24
|
+
obj.removeHighlight();RG.SVG.tooltip({object:obj,index:index,sequentialIndex:index,text:prop.tooltips[index],event:e});obj.highlight(e.target);var highlight=RG.SVG.REG.get('highlight');if(prop.tooltipsEvent==='mousemove'){highlight.style.cursor='pointer';}},false);if(prop.tooltipsEvent==='click'){arc.addEventListener('mousemove',function(e)
|
24
25
|
{e.target.style.cursor='pointer';},false);}}(i,this));}}
|
25
26
|
if(prop.shadow&&opt.shadow){this.redrawSegments();}};this.redrawSegments=function()
|
26
27
|
{this.drawSegments({shadow:false});};this.drawLabels=function()
|
27
28
|
{var angles=this.angles,prop=this.properties,labels=prop.labels;for(var i=0;i<angles.length;++i){var endpoint=RG.SVG.TRIG.getRadiusEndPoint({angle:angles[i].halfway-RG.SVG.TRIG.HALFPI,r:angles[i].radius+15});var x=endpoint[0]+angles[i].cx,y=endpoint[1]+angles[i].cy,valign,halign;if(angles[i].halfway>0&&angles[i].halfway<RG.SVG.TRIG.HALFPI){halign='left';valign='bottom';}else if(angles[i].halfway>RG.SVG.TRIG.HALFPI&&angles[i].halfway<RG.SVG.TRIG.PI){halign='left';valign='top';}else if(angles[i].halfway>RG.SVG.TRIG.PI&&angles[i].halfway<(RG.SVG.TRIG.HALFPI+RG.SVG.TRIG.PI)){halign='right';valign='top';}else if(angles[i].halfway>(RG.SVG.TRIG.HALFPI+RG.SVG.TRIG.PI)&&angles[i].halfway<RG.SVG.TRIG.TWOPI){halign='right';valign='top';}
|
28
|
-
RG.SVG.text({object:this,parent:this.svg.all,text:typeof labels[i]==='string'?labels[i]:'',font:prop.textFont,size:prop.textSize,x:x,y:y,valign:valign,halign:halign,bold:prop.textBold,italic:prop.textItalic,color:prop.textColor});}};this.drawIngraphLabels=function()
|
29
|
+
RG.SVG.text({object:this,parent:this.svg.all,tag:'labels',text:typeof labels[i]==='string'?labels[i]:'',font:prop.textFont,size:prop.textSize,x:x,y:y,valign:valign,halign:halign,bold:prop.textBold,italic:prop.textItalic,color:prop.textColor});}};this.drawIngraphLabels=function()
|
29
30
|
{if(prop.labelsIngraph){for(var i=0;i<this.angles.length;++i){var halign=prop.labelsIngraphHalign||'center',valign=prop.labelsIngraphValign||'center',font=prop.labelsIngraphFont||prop.textFont,size=prop.labelsIngraphSize||prop.textSize,italic=typeof prop.labelsIngraphItalic==='boolean'?prop.labelsIngraphItalic:prop.textItalic,bold=typeof prop.labelsIngraphBold==='boolean'?prop.labelsIngraphBold:prop.textBold,color=prop.labelsIngraphColor||prop.textColor,bgcolor=prop.labelsIngraphBackground||'transparent',decimals=prop.labelsIngraphDecimals||0,padding=typeof prop.labelsIngraphBackground==='string'?3:0;var xy=RG.SVG.TRIG.getRadiusEndPoint({angle:this.angles[i].halfway-RG.SVG.TRIG.HALFPI,r:this.angles[i].radius*(typeof prop.labelsIngraphRadiusPos==='number'?prop.labelsIngraphRadiusPos:0.5)});if(typeof prop.labelsIngraphSpecific==='object'&&prop.labelsIngraphSpecific){if(typeof prop.labelsIngraphSpecific[i]==='string'){var str=prop.labelsIngraphSpecific[i];}else{var str='';}}else{if(typeof prop.labelsIngraphFormatter==='function'){var str=prop.labelsIngraphFormatter({object:this,number:this.data[i].toFixed(decimals)})}else{var str=RG.SVG.numberFormat({prepend:prop.labelsIngraphUnitsPre,append:prop.labelsIngraphUnitsPost,point:prop.labelsIngraphPoint,thousand:prop.labelsIngraphThousand,num:this.data[i].toFixed(decimals),object:this});}}
|
30
|
-
RG.SVG.text({object:this,parent:this.svg.all,x:this.angles[i].cx+xy[0],y:this.angles[i].cy+xy[1],text:str,halign:halign,valign:valign,font:font,size:size,bold:bold,italic:italic,color:color,background:bgcolor,padding:padding});}}};this.drawLabelsSticks=function()
|
31
|
+
RG.SVG.text({object:this,parent:this.svg.all,tag:'labels.ingraph',x:this.angles[i].cx+xy[0],y:this.angles[i].cy+xy[1],text:str,halign:halign,valign:valign,font:font,size:size,bold:bold,italic:italic,color:color,background:bgcolor,padding:padding});}}};this.drawLabelsSticks=function()
|
31
32
|
{var labels_right=[],labels_left=[],labels_coords=[];for(var i=0;i<this.angles.length;++i){var angle=(this.angles[i].start+((this.angles[i].end-this.angles[i].start)/2))-RGraph.SVG.TRIG.HALFPI,endpoint_inner=RG.SVG.TRIG.getRadiusEndPoint({angle:angle,r:this.radius+5}),endpoint_outer=RG.SVG.TRIG.getRadiusEndPoint({angle:angle,r:this.radius+20}),explosion=[(typeof prop.exploded==='number'?prop.exploded:prop.exploded[i]),ma.cos(angle)*(typeof prop.exploded==='number'?prop.exploded:prop.exploded[i]),ma.sin(angle)*(typeof prop.exploded==='number'?prop.exploded:prop.exploded[i])];labels_coords[i]=[];var labels={};if(angle>RG.SVG.TRIG.HALFPI){var index=labels_left.length;labels_left[index]=[];labels_left[index].text=prop.labels[i];labels_left[index].halign='right';labels=labels_left;labels_coords[i].halign='right';}else{var index=labels_right.length;labels_right[index]=[];labels_right[index].text=prop.labels[i];labels_right[index].halign='right';labels=labels_right;labels_coords[i].halign='left';}
|
32
33
|
endpoint_inner[0]+=(explosion[1]||0);endpoint_inner[1]+=(explosion[2]||0);endpoint_outer[0]+=(explosion[1]||0);endpoint_outer[1]+=(explosion[2]||0);var x,y;if(labels[index].text){var stick=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:'M {1} {2} L {3} {4}'.format(this.centerx+endpoint_inner[0],this.centery+endpoint_inner[1],this.centerx+endpoint_outer[0],this.centery+endpoint_outer[1]),stroke:'#999',fill:'rgba(0,0,0,0)'}});}
|
33
34
|
if(stick){labels[index].stick=stick;}
|
34
35
|
x=(this.centerx+endpoint_outer[0]+(angle>1.57?-50:50));y=(this.centery+endpoint_outer[1]);labels_coords[i].x=x;labels_coords[i].y=y;labels_coords[i].text=prop.labels[i];}
|
35
|
-
var vspace_right=(this.height-prop.gutterTop-prop.gutterBottom)/labels_right.length;var vspace_left=(this.height-prop.gutterTop-prop.gutterBottom)/labels_left.length;x=y=0;for(var i=0;i<labels_right.length;++i){if(labels_right[i]&&labels_right[i].text){x=this.centerx+this.radius+100;y=prop.gutterTop+(vspace_right*i)+(vspace_right/2);RGraph.SVG.text({object:this,parent:this.svg.all,text:typeof labels_right[i].text==='string'?labels_right[i].text:'',font:prop.textFont,size:prop.textSize,x:x,y:y,valign:'center',halign:labels_right[i].text,bold:prop.textBold,italic:prop.textItalic,color:prop.textColor});labels_right[i].stick.setAttribute('d',
|
36
|
-
for(var i=0;i<labels_left.length;++i){if(labels_left[i]&&labels_left[i].text){x=this.centerx-this.radius-100;y=this.height-(prop.gutterTop+(vspace_left*i)+(vspace_left/2));RGraph.SVG.text({object:this,parent:this.svg.all,text:typeof labels_left[i].text==='string'?labels_left[i].text:'',font:prop.textFont,size:prop.textSize,x:x-7,y:y,valign:'center',halign:labels_left[i].halign,bold:prop.textBold,italic:prop.textItalic,color:prop.textColor});labels_left[i].stick.setAttribute('d',
|
37
|
-
{var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:segment.getAttribute('d'),fill:prop.highlightFill,stroke:prop.highlightStroke,'stroke-width':prop.highlightLinewidth}
|
36
|
+
var vspace_right=(this.height-prop.gutterTop-prop.gutterBottom)/labels_right.length;var vspace_left=(this.height-prop.gutterTop-prop.gutterBottom)/labels_left.length;x=y=0;for(var i=0;i<labels_right.length;++i){if(labels_right[i]&&labels_right[i].text){x=this.centerx+this.radius+100;y=prop.gutterTop+(vspace_right*i)+(vspace_right/2);RGraph.SVG.text({object:this,parent:this.svg.all,tag:'labels.sticks',text:typeof labels_right[i].text==='string'?labels_right[i].text:'',font:prop.textFont,size:prop.textSize,x:x,y:y,valign:'center',halign:labels_right[i].text,bold:prop.textBold,italic:prop.textItalic,color:prop.textColor});labels_right[i].stick.setAttribute('d','{1} L {2} {3}'.format(labels_right[i].stick.getAttribute('d'),x-5,y,this.centerx+this.radius+prop.labelsSticksHlength));}}
|
37
|
+
for(var i=0;i<labels_left.length;++i){if(labels_left[i]&&labels_left[i].text){x=this.centerx-this.radius-100;y=this.height-(prop.gutterTop+(vspace_left*i)+(vspace_left/2));RGraph.SVG.text({object:this,parent:this.svg.all,tag:'labels.sticks',text:typeof labels_left[i].text==='string'?labels_left[i].text:'',font:prop.textFont,size:prop.textSize,x:x-7,y:y,valign:'center',halign:labels_left[i].halign,bold:prop.textBold,italic:prop.textItalic,color:prop.textColor});labels_left[i].stick.setAttribute('d','{1} L {2} {3} '.format(labels_left[i].stick.getAttribute('d'),x-5,y));}}};this.highlight=function(segment)
|
38
|
+
{if(prop.highlightStyle==='outline'){var index=segment.getAttribute('data-index');var path=RGraph.SVG.TRIG.getArcPath3({start:this.angles[index].start,end:this.angles[index].end,cx:this.angles[index].cx,cy:this.angles[index].cy,r:this.angles[index].radius+2,anticlockwise:false,lineto:false});path+=RGraph.SVG.TRIG.getArcPath3({start:this.angles[index].end,end:this.angles[index].start,cx:this.angles[index].cx,cy:this.angles[index].cy,r:this.angles[index].radius+2+prop.highlightStyleOutlineWidth,anticlockwise:true});var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.colors[index],stroke:'transparent'},style:{pointerEvents:'none'}});}else{var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:segment.getAttribute('d'),fill:prop.highlightFill,stroke:prop.highlightStroke,'stroke-width':prop.highlightLinewidth},style:{pointerEvents:'none'}});}
|
39
|
+
if(prop.tooltipsEvent==='mousemove'){highlight.addEventListener('mouseout',function(e)
|
38
40
|
{highlight.parentNode.removeChild(highlight);RG.SVG.hideTooltip();RG.SVG.REG.set('highlight',null);},false);}
|
39
41
|
RG.SVG.REG.set('highlight',highlight);};this.parseColors=function()
|
40
42
|
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),highlightFill:RG.SVG.arrayClone(prop.highlightFill)}}
|
41
43
|
var colors=prop.colors;if(colors){for(var i=0;i<colors.length;++i){colors[i]=RG.SVG.parseColorRadial({object:this,color:colors[i]});}}
|
42
44
|
prop.highlightFill=RG.SVG.parseColorRadial({object:this,color:prop.highlightFill});};this.roundRobin=function()
|
43
|
-
{var obj=this,opt=arguments[0]||{},data=RG.SVG.arrayClone(this.data),prop=this.properties,frame=1,frames=opt.frames||30,callback=typeof opt.callback==='function'?opt.callback:function(){},dataSum=RG.SVG.arraySum(this.data),textColor=prop.textColor,ingraph=prop.labelsIngraph;
|
44
|
-
{
|
45
|
+
{var obj=this,opt=arguments[0]||{},data=RG.SVG.arrayClone(this.data),prop=this.properties,frame=1,frames=opt.frames||30,callback=typeof opt.callback==='function'?opt.callback:function(){},dataSum=RG.SVG.arraySum(this.data),textColor=prop.textColor,ingraph=prop.labelsIngraph,multiplier=0;prop.textColor='rgba(0,0,0,0)';prop.labelsIngraph=false;obj.draw();var angles=RG.SVG.arrayClone(this.angles);function iterator()
|
46
|
+
{multiplier=(1/frames)*frame++;for(var i=0;i<angles.length;++i){var value=obj.data[i];obj.angles[i].start=angles[i].start*multiplier;obj.angles[i].end=angles[i].end*multiplier;var segment=((obj.angles[i].end-obj.angles[i].start)/2),explodedX=ma.cos(obj.angles[i].start+segment-RG.SVG.TRIG.HALFPI)*(prop.exploded[i]||0),explodedY=ma.sin(obj.angles[i].start+segment-RG.SVG.TRIG.HALFPI)*(prop.exploded[i]||0);var path=RG.SVG.TRIG.getArcPath({cx:obj.centerx+explodedX,cy:obj.centery+explodedY,r:obj.radius,start:obj.angles[i].start,end:obj.angles[i].end});if(prop.donut){var donutWidth=prop.donutWidth;var donut_path=RG.SVG.TRIG.getArcPath3({cx:obj.angles[i].cx,cy:obj.angles[i].cy,r:obj.radius-donutWidth,start:obj.angles[i].end,end:obj.angles[i].start,moveto:false,anticlockwise:true});var xy=RG.SVG.TRIG.getRadiusEndPoint({angle:obj.angles[i].end-RG.SVG.TRIG.HALFPI,r:obj.radius-donutWidth});path=path
|
45
47
|
+" L {1} {2} ".format(xy[0]+obj.angles[i].cx,xy[1]+obj.angles[i].cy)
|
46
48
|
+donut_path
|
47
49
|
+" Z";}else{path=path+" L {1} {2} ".format(obj.angles[i].cx,obj.angles[i].cy)+" Z"}
|
@@ -3,10 +3,10 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,do
|
|
3
3
|
{var RG=RGraph,ua=navigator.userAgent,ma=Math,win=window,doc=document;RG.SVG.Radar=function(conf)
|
4
4
|
{this.set=function(name,value)
|
5
5
|
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
|
6
|
-
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(conf.data);this.originalData=RG.SVG.arrayClone(conf.data);this.type='radar';this.coords=[];this.coords2=[];this.angles=[];this.angles2=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];this.max=0;this.redraw=false;this.highlight_node=null;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridRadialsCount:null,backgroundGridConcentricsCount:5,backgroundGridLinewidth:1,backgroundGridPoly:true,colors:['red','black','orange','green','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],filled:false,filledOpacity:0.25,filledAccumulative:true,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],scaleVisible:true,scaleUnitsPre:'',scaleUnitsPost:'',scaleMax:null,scaleMin:0,scalePoint:'.',scaleThousand:',',scaleRound:false,scaleDecimals:0,scaleFormatter:null,scaleBold:null,scaleItalic:null,scaleColor:null,scaleSize:null,scaleFont:null,scaleLabelsCount:5,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'mousemove',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,tickmarks:'circle',tickmarksLinewidth:1,tickmarksSize:6,tickmarksFill:'white',title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:
|
6
|
+
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(conf.data);this.originalData=RG.SVG.arrayClone(conf.data);this.type='radar';this.coords=[];this.coords2=[];this.angles=[];this.angles2=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];this.max=0;this.redraw=false;this.highlight_node=null;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridRadialsCount:null,backgroundGridConcentricsCount:5,backgroundGridLinewidth:1,backgroundGridPoly:true,colors:['red','black','orange','green','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],filled:false,filledOpacity:0.25,filledAccumulative:true,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],scaleVisible:true,scaleUnitsPre:'',scaleUnitsPost:'',scaleMax:null,scaleMin:0,scalePoint:'.',scaleThousand:',',scaleRound:false,scaleDecimals:0,scaleFormatter:null,scaleBold:null,scaleItalic:null,scaleColor:null,scaleSize:null,scaleFont:null,scaleLabelsCount:5,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'mousemove',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,tickmarks:'circle',tickmarksLinewidth:1,tickmarksSize:6,tickmarksFill:'white',title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:null,titleSubtitleSize:10,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,grouping:'normal',shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
7
7
|
var prop=this.properties;this.draw=function()
|
8
|
-
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.data=RG.SVG.arrayClone(this.originalData);if(this.data.length>1){var len=this.data[0].length;for(var i=1;i<this.data.length;++i){if(this.data[i].length!==len){alert('[ERROR] The Radar chart datasets must have the same number of elements!');}}}
|
9
|
-
this.angles=[];this.coords=[];this.coords2=[];RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;this.centerx=(this.graphWidth/2)+prop.gutterLeft;this.centery=(this.graphHeight/2)+prop.gutterTop;this.radius=ma.min(this.graphWidth,this.graphHeight)/2;this.centerx=typeof prop.centerx==='number'?prop.centerx:this.centerx;this.centery=typeof prop.centery==='number'?prop.centery:this.centery;this.radius=typeof prop.radius==='number'?prop.radius:this.radius;if(typeof prop.radius==='string'&&prop.radius.match(/^\+|-\d+$/))this.radius+=parseFloat(prop.radius);if(typeof prop.centerx==='string'&&prop.centerx.match(/^\+|-\d+$/))this.centery+=parseFloat(prop.centerx);if(typeof prop.centery==='string'&&prop.centery.match(/^\+|-\d+$/))this.centerx+=parseFloat(prop.centery);if(RG.SVG.isArray(this.data)&&(typeof this.data[0]==='number'||typeof this.data[0]==='string')){this.data=[this.data];}
|
8
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(this.originalData);if(this.data.length>1){var len=this.data[0].length;for(var i=1;i<this.data.length;++i){if(this.data[i].length!==len){alert('[ERROR] The Radar chart datasets must have the same number of elements!');}}}
|
9
|
+
this.angles=[];this.angles2=[];this.coords=[];this.coords2=[];RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;this.centerx=(this.graphWidth/2)+prop.gutterLeft;this.centery=(this.graphHeight/2)+prop.gutterTop;this.radius=ma.min(this.graphWidth,this.graphHeight)/2;this.centerx=typeof prop.centerx==='number'?prop.centerx:this.centerx;this.centery=typeof prop.centery==='number'?prop.centery:this.centery;this.radius=typeof prop.radius==='number'?prop.radius:this.radius;if(typeof prop.radius==='string'&&prop.radius.match(/^\+|-\d+$/))this.radius+=parseFloat(prop.radius);if(typeof prop.centerx==='string'&&prop.centerx.match(/^\+|-\d+$/))this.centery+=parseFloat(prop.centerx);if(typeof prop.centery==='string'&&prop.centery.match(/^\+|-\d+$/))this.centerx+=parseFloat(prop.centery);if(RG.SVG.isArray(this.data)&&(typeof this.data[0]==='number'||typeof this.data[0]==='string')){this.data=[this.data];}
|
10
10
|
for(var i=0;i<this.data.length;++i){for(var j=0;j<this.data[i].length;++j){if(typeof this.data[i][j]==='string'){this.data[i][j]=RG.SVG.stringsToNumbers(this.data[i][j]);}}}
|
11
11
|
if(prop.filled&&prop.filledAccumulative){for(var dataset=1;dataset<this.data.length;++dataset){for(var i=0;i<this.data[dataset].length;++i){this.data[dataset][i]+=this.data[dataset-1][i];}}}
|
12
12
|
this.getMaxValue();RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.scale=RG.SVG.getScale({object:this,numlabels:typeof prop.scaleLabelsCount==='number'?prop.scaleLabelsCount:prop.backgroundGridConcentricCount,unitsPre:prop.scaleUnitsPre,unitsPost:prop.scaleUnitsPost,max:typeof prop.scaleMax==='number'?prop.scaleMax:this.max,min:prop.scaleMin,point:prop.scalePoint,round:prop.scaleRound,thousand:prop.scaleThousand,decimals:prop.scaleDecimals,strict:typeof prop.scaleMax==='number',formatter:prop.scaleFormatter});this.max=this.scale.max;this.drawBackground();this.drawRadar();this.drawTickmarks();this.drawLabels();RG.SVG.drawTitle(this);this.addTooltipHotspots();if(typeof prop.key!==null&&RG.SVG.drawKey){RG.SVG.drawKey(this);}else if(!RGraph.SVG.isNull(prop.key)){alert('The drawKey() function does not exist - have you forgotten to include the key library?');}
|
@@ -16,7 +16,7 @@ var obj=this;doc.body.addEventListener('mousedown',function(e)
|
|
16
16
|
{if(prop.backgroundGrid){var grid=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'g',attr:{className:'rgraph_radar_grid',fill:'rgba(0,0,0,0)',stroke:prop.backgroundGridColor}});var origin=0-(RG.SVG.TRIG.PI/2),radials=(typeof prop.backgroundGridRadialsCount==='number'?prop.backgroundGridRadialsCount:this.data[0].length),concentrics=prop.backgroundGridConcentricsCount,step=RG.SVG.TRIG.TWOPI/radials;if(radials>0){for(var i=0,len=radials;i<len;++i){var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius,angle:origin+(i*step)});var str='M {1} {2} L {3} {4}'.format(this.centerx,this.centery,coords.x,coords.y);RG.SVG.create({svg:this.svg,type:'path',parent:grid,attr:{d:str,stroke:prop.backgroundGridColor,'stroke-width':prop.backgroundGridLinewidth}});}}
|
17
17
|
if(concentrics>0){if(prop.backgroundGridPoly){for(var j=1;j<=concentrics;j++){for(var i=0,len=radials,path=[];i<len;++i){var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius*(j/concentrics),angle:origin+(i*step)});path.push('{1} {2} {3}'.format(i===0?'M':'L',coords.x,coords.y));}
|
18
18
|
RG.SVG.create({svg:this.svg,type:'path',parent:grid,attr:{d:path.join(' ')+' z',fill:'transparent',stroke:prop.backgroundGridColor,'stroke-width':prop.backgroundGridLinewidth}});}}else{for(var j=1;j<=concentrics;j++){RG.SVG.create({svg:this.svg,type:'circle',parent:grid,attr:{cx:this.centerx,cy:this.centery,r:this.radius*(j/concentrics),fill:'transparent',stroke:prop.backgroundGridColor,'stroke-width':prop.backgroundGridLinewidth}});}}}}};this.drawRadar=function(opt)
|
19
|
-
{for(var dataset=0,len=this.data.length;dataset<len;++dataset){this.coords2[dataset]=[];this.angles2[dataset]=[];var path=[];for(var i=0,len2=this.data[dataset].length;i<len2;++i){var value=this.data[dataset][i];var xy=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.getRadius(this.data[dataset][i]),angle:(RG.SVG.TRIG.TWOPI/len2)*i-RG.SVG.TRIG.HALFPI});xy.r=(((value-prop.scaleMin)/(this.max-prop.scaleMin)))*this.radius;xy.angle=(RG.SVG.TRIG.TWOPI/len2)*i-RG.SVG.TRIG.HALFPI;path.push('{1}{2} {3}'.format(i===0?'M':'L',xy.x,xy.y));this.angles.push({cx:this.centerx,cy:this.centery,r:xy.r,angle:xy.angle});this.angles2[dataset].push({cx:this.centerx,cy:this.centery,r:xy.r,angle:xy.angle});this.coords.push([xy.x,xy.y]);this.coords2[dataset].push([xy.x,xy.y]);}
|
19
|
+
{for(var dataset=0,len=this.data.length;dataset<len;++dataset){this.coords2[dataset]=[];this.angles2[dataset]=[];var path=[];for(var i=0,len2=this.data[dataset].length;i<len2;++i){var value=this.data[dataset][i];var xy=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.getRadius(this.data[dataset][i]),angle:(RG.SVG.TRIG.TWOPI/len2)*i-RG.SVG.TRIG.HALFPI});xy.r=(((value-prop.scaleMin)/(this.max-prop.scaleMin)))*this.radius;xy.angle=(RG.SVG.TRIG.TWOPI/len2)*i-RG.SVG.TRIG.HALFPI;path.push('{1}{2} {3}'.format(i===0?'M':'L',xy.x,xy.y));this.angles.push({object:this,dataset:dataset,index:i,x:xy.x,y:xy.y,cx:this.centerx,cy:this.centery,r:xy.r,angle:xy.angle});this.angles2[dataset].push({object:this,dataset:dataset,index:i,x:xy.x,y:xy.y,cx:this.centerx,cy:this.centery,r:xy.r,angle:xy.angle});this.coords.push([xy.x,xy.y]);this.coords2[dataset].push([xy.x,xy.y]);}
|
20
20
|
if(dataset>0&&prop.filled&&prop.filledAccumulative){path.push('L {1} {2}'.format(this.coords2[dataset][0][0],this.coords2[dataset][0][1]));path.push('M {1} {2}'.format(this.coords2[dataset-1][0][0],this.coords2[dataset-1][0][1]));for(var i=this.coords2[dataset-1].length-1;i>=0;--i){path.push('L {1} {2}'.format(this.coords2[dataset-1][i][0],this.coords2[dataset-1][i][1]));}
|
21
21
|
this.redraw=true;}else{path.push('z');}
|
22
22
|
var path=RG.SVG.create({svg:this.svg,type:'path',parent:this.svg.all,attr:{d:path.join(" "),stroke:prop.colors[dataset],fill:prop.filled?prop.colors[dataset]:'transparent','fill-opacity':prop.filledOpacity,'stroke-width':prop.linewidth,'clip-path':this.isTrace?'url(#trace-effect-clip)':'',filter:prop.shadow?'url(#dropShadow)':'',}});path.setAttribute('data-dataset',dataset);}
|
@@ -32,9 +32,9 @@ if((i/len)===0){halign='center';}
|
|
32
32
|
if((i/len)===0.25){valign='center';}
|
33
33
|
if((i/len)===0.5){halign='center';}
|
34
34
|
if((i/len)===0.75){valign='center';}
|
35
|
-
RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,text:labels[i],size:typeof prop.labelsSize==='number'?prop.labelsSize:prop.textSize,x:x,y:y,halign:halign,valign:'center',color:prop.labelsColor||prop.textColor,bold:typeof prop.labelsBold==='boolean'?prop.labelsBold:prop.textBold,italic:typeof prop.labelsItalic==='boolean'?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}
|
36
|
-
if(prop.scaleVisible){for(var i=0;i<this.scale.labels.length;++i){var x=this.centerx;var y=this.centery-(this.radius/this.scale.labels.length*(i+1));RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,text:this.scale.labels[i],size:prop.scaleSize||prop.textSize-2,x:x,y:y,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}
|
37
|
-
var str=RG.SVG.numberFormat({object:this,num:this.scale.min.toFixed(prop.scaleDecimals),prepend:prop.scaleUnitsPre,append:prop.scaleUnitsPost,point:prop.scalePoint,thousand:prop.scaleThousand,formatter:prop.scaleFormatter});RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,text:str,size:prop.scaleSize||prop.textSize-2,x:this.centerx,y:this.centery,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}};this.highlight=function(circle)
|
35
|
+
RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,tag:'labels',text:labels[i],size:typeof prop.labelsSize==='number'?prop.labelsSize:prop.textSize,x:x,y:y,halign:halign,valign:'center',color:prop.labelsColor||prop.textColor,bold:typeof prop.labelsBold==='boolean'?prop.labelsBold:prop.textBold,italic:typeof prop.labelsItalic==='boolean'?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}
|
36
|
+
if(prop.scaleVisible){for(var i=0;i<this.scale.labels.length;++i){var x=this.centerx;var y=this.centery-(this.radius/this.scale.labels.length*(i+1));RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,tag:'labels.scale',text:this.scale.labels[i],size:prop.scaleSize||prop.textSize-2,x:x,y:y,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}
|
37
|
+
var str=RG.SVG.numberFormat({object:this,num:this.scale.min.toFixed(prop.scaleDecimals),prepend:prop.scaleUnitsPre,append:prop.scaleUnitsPost,point:prop.scalePoint,thousand:prop.scaleThousand,formatter:prop.scaleFormatter});RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,tag:'labels.scale',text:str,size:prop.scaleSize||prop.textSize-2,x:this.centerx,y:this.centery,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}};this.highlight=function(circle)
|
38
38
|
{circle.setAttribute('fill',prop.highlightFill);circle.setAttribute('stroke',prop.highlightStroke);circle.setAttribute('stroke-width',prop.highlightLinewidth);this.highlight_node=circle;RG.SVG.REG.set('highlight',circle);};this.parseColors=function()
|
39
39
|
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),highlightFill:RG.SVG.arrayClone(prop.highlightFill)}}
|
40
40
|
var colors=prop.colors;if(colors){for(var i=0;i<colors.length;++i){colors[i]=RG.SVG.parseColorRadial({object:this,color:colors[i]});}}
|
@@ -3,16 +3,16 @@ RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,do
|
|
3
3
|
{var RG=RGraph,ua=navigator.userAgent,ma=Math,win=window,doc=document;RG.SVG.Rose=function(conf)
|
4
4
|
{this.set=function(name,value)
|
5
5
|
{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
|
6
|
-
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(conf.data);this.originalData=RG.SVG.arrayClone(conf.data);this.type='rose';this.angles=[];this.angles2=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];this.max=0;this.redraw=false;this.highlight_node=null;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridRadialsCount:null,backgroundGridRadialsAngleOffset:0,backgroundGridConcentricsCount:5,backgroundGridLinewidth:1,strokestyle:'white',colors:['red','black','orange','green','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],colorsOpacity:1,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],labelsFont:null,labelsSize:null,labelsColor:null,labelsBold:null,labelsItalic:null,labelsRadialMargin:10,labelsAngleOffset:0,scaleVisible:true,scaleUnitsPre:'',scaleUnitsPost:'',scaleMax:null,scaleMin:0,scalePoint:'.',scaleThousand:',',scaleRound:false,scaleDecimals:0,scaleFormatter:null,scaleBold:null,scaleItalic:null,scaleColor:null,scaleSize:null,scaleFont:null,scaleLabelsCount:5,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:
|
6
|
+
return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(conf.data);this.originalData=RG.SVG.arrayClone(conf.data);this.type='rose';this.angles=[];this.angles2=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.nodes=[];this.shadowNodes=[];this.max=0;this.redraw=false;this.highlight_node=null;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={centerx:null,centery:null,radius:null,gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridRadialsCount:null,backgroundGridRadialsAngleOffset:0,backgroundGridConcentricsCount:5,backgroundGridLinewidth:1,strokestyle:'white',colors:['red','black','orange','green','#6ff','#ccc','pink','orange','cyan','maroon','olive','teal'],colorsOpacity:1,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labels:[],labelsFont:null,labelsSize:null,labelsColor:null,labelsBold:null,labelsItalic:null,labelsRadialMargin:10,labelsAngleOffset:0,scaleVisible:true,scaleUnitsPre:'',scaleUnitsPost:'',scaleMax:null,scaleMin:0,scalePoint:'.',scaleThousand:',',scaleRound:false,scaleDecimals:0,scaleFormatter:null,scaleBold:null,scaleItalic:null,scaleColor:null,scaleSize:null,scaleFont:null,scaleLabelsCount:5,linewidth:1,tooltips:null,tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'click',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:null,titleSubtitleSize:10,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,shadow:false,shadowOffsetx:2,shadowOffsety:2,shadowBlur:2,shadowOpacity:0.25,margin:0,exploded:0,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null,segmentsAngleOffset:0,variant:'normal'};RG.SVG.getGlobals(this);if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
|
7
7
|
var prop=this.properties;this.draw=function()
|
8
|
-
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.data=RG.SVG.arrayClone(this.originalData);this.angles=[];for(var i=0;i<this.data.length;++i){this.angles2[i]=[];}
|
8
|
+
{RG.SVG.fireCustomEvent(this,'onbeforedraw');this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=RG.SVG.arrayClone(this.originalData);this.angles=[];for(var i=0;i<this.data.length;++i){this.angles2[i]=[];}
|
9
9
|
RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;this.centerx=(this.graphWidth/2)+prop.gutterLeft;this.centery=(this.graphHeight/2)+prop.gutterTop;this.radius=ma.min(this.graphWidth,this.graphHeight)/2;this.centerx=typeof prop.centerx==='number'?prop.centerx:this.centerx;this.centery=typeof prop.centery==='number'?prop.centery:this.centery;this.radius=typeof prop.radius==='number'?prop.radius:this.radius;if(typeof prop.radius==='string'&&prop.radius.match(/^\+|-\d+$/))this.radius+=parseFloat(prop.radius);if(typeof prop.centerx==='string'&&prop.centerx.match(/^\+|-\d+$/))this.centery+=parseFloat(prop.centerx);if(typeof prop.centery==='string'&&prop.centery.match(/^\+|-\d+$/))this.centerx+=parseFloat(prop.centery);if(typeof prop.margin==='string'&&prop.margin.match(/([0-9.]+)deg/)){prop.margin=RegExp.$1/(180/ma.PI);}
|
10
10
|
for(var i=0;i<this.data.length;++i){if(typeof this.data[i]==='object'){for(var j=0;j<this.data[i].length;++j){if(typeof this.data[i][j]==='string'){this.data[i][j]=RG.SVG.stringsToNumbers(this.data[i][j]);}}}else if(typeof this.data[i]==='string'){this.data[i]=RG.SVG.stringsToNumbers(this.data[i]);}}
|
11
11
|
this.getMaxValue();RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();this.scale=RG.SVG.getScale({object:this,numlabels:typeof prop.scaleLabelsCount==='number'?prop.scaleLabelsCount:prop.backgroundGridConcentricCount,unitsPre:prop.scaleUnitsPre,unitsPost:prop.scaleUnitsPost,max:typeof prop.scaleMax==='number'?prop.scaleMax:this.max,min:prop.scaleMin,point:prop.scalePoint,round:prop.scaleRound,thousand:prop.scaleThousand,decimals:prop.scaleDecimals,strict:typeof prop.scaleMax==='number',formatter:prop.scaleFormatter});this.max=this.scale.max;this.drawBackground();this.drawRose();this.drawLabels();RG.SVG.drawTitle(this);if(typeof prop.key!==null&&RG.SVG.drawKey){RG.SVG.drawKey(this);}else if(!RGraph.SVG.isNull(prop.key)){alert('The drawKey() function does not exist - have you forgotten to include the key library?');}
|
12
12
|
RG.SVG.attribution(this);if(prop.shadow){RG.SVG.setShadow({object:this,offsetx:prop.shadowOffsetx,offsety:prop.shadowOffsety,blur:prop.shadowBlur,opacity:prop.shadowOpacity,id:'dropShadow'});}
|
13
13
|
var obj=this;doc.body.addEventListener('mousedown',function(e)
|
14
14
|
{obj.hideHighlight(obj);},false);RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawBackground=function()
|
15
|
-
{if(prop.backgroundGrid){var grid=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'g',attr:{className:'rgraph_radar_grid',fill:'rgba(0,0,0,0)',stroke:prop.backgroundGridColor}});var origin=0-(RG.SVG.TRIG.PI/2),radials=(typeof prop.backgroundGridRadialsCount==='number'?prop.backgroundGridRadialsCount:this.data.length),concentrics=prop.backgroundGridConcentricsCount,step=RG.SVG.TRIG.TWOPI/radials;if(radials>0){if(prop.variant==='non-equi-angular'){var radials=this.data.length;for(var i=0,total=0;i<this.data.length;++i){total+=this.data[i][1];}
|
15
|
+
{if(prop.backgroundGrid){var grid=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'g',attr:{className:'rgraph_radar_grid',fill:'rgba(0,0,0,0)',stroke:prop.backgroundGridColor},style:{pointerEvents:'none'}});var origin=0-(RG.SVG.TRIG.PI/2),radials=(typeof prop.backgroundGridRadialsCount==='number'?prop.backgroundGridRadialsCount:this.data.length),concentrics=prop.backgroundGridConcentricsCount,step=RG.SVG.TRIG.TWOPI/radials;if(radials>0){if(prop.variant==='non-equi-angular'){var radials=this.data.length;for(var i=0,total=0;i<this.data.length;++i){total+=this.data[i][1];}
|
16
16
|
for(var i=0,sum=0;i<this.data.length;++i){var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius,angle:origin+((sum/total)*RG.SVG.TRIG.TWOPI)+prop.backgroundGridRadialsAngleOffset});var str='M {1} {2} L {3} {4}'.format(this.centerx,this.centery,coords.x,coords.y);RG.SVG.create({svg:this.svg,type:'path',parent:grid,attr:{d:str,stroke:prop.backgroundGridColor,'stroke-width':prop.backgroundGridLinewidth}});sum+=this.data[i][1];}}else{for(var i=0,len=radials;i<len;++i){var coords=RG.SVG.TRIG.toCartesian({cx:this.centerx,cy:this.centery,r:this.radius,angle:origin+(i*step)+prop.backgroundGridRadialsAngleOffset});var str='M {1} {2} L {3} {4}'.format(this.centerx,this.centery,coords.x,coords.y);RG.SVG.create({svg:this.svg,type:'path',parent:grid,attr:{d:str,stroke:prop.backgroundGridColor,'stroke-width':prop.backgroundGridLinewidth}});}}}
|
17
17
|
if(concentrics>0){for(var j=1;j<=concentrics;j++){RG.SVG.create({svg:this.svg,type:'circle',parent:grid,attr:{cx:this.centerx,cy:this.centery,r:this.radius*(j/concentrics),fill:'transparent',stroke:prop.backgroundGridColor,'stroke-width':prop.backgroundGridLinewidth}});}}}};this.drawRose=function(opt)
|
18
18
|
{if(prop.variant==='non-equi-angular'){return this.drawRoseNonEquiAngular(opt);}
|
@@ -22,34 +22,34 @@ var path=RG.SVG.create({svg:this.svg,type:'path',parent:segment_group,attr:{d:ar
|
|
22
22
|
{path.addEventListener(prop.tooltipsEvent,function(e)
|
23
23
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,group:group,index:index,sequentialIndex:seq,text:prop.tooltips[seq],event:e});obj.highlight(e.target);var highlight=RG.SVG.REG.get('highlight');if(prop.tooltipsEvent==='mousemove'){highlight.style.cursor='pointer';}},false);if(prop.tooltipsEvent==='click'){path.addEventListener('mousemove',function(e)
|
24
24
|
{e.target.style.cursor='pointer';},false);}}(j,i,seq,this));}
|
25
|
-
this.angles.push({object:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][j]});this.angles2[i].push({object:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][j]});var prevRadius=radius;}
|
26
|
-
seq--;}else{var arcPath=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:radius,start:start+prop.margin+prop.segmentsAngleOffset,end:end-prop.margin+prop.segmentsAngleOffset,anticlockwise:false});var path=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'{1} z'.format(arcPath),fill:prop.colorsSequential?prop.colors[i]:prop.colors[0],'fill-opacity':prop.colorsOpacity,stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-index':i,'data-centerx':this.centerx+explosion[0],'data-centery':this.centery+explosion[1],'data-value':this.data[i],'data-start-angle':start,'data-end-angle':end,'data-radius':radius,'data-sequential':seq}});this.angles.push({object:path,index:i,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,value:this.data[i]});this.angles2[i].push({object:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':
|
25
|
+
this.angles.push({object:this,element:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][j]});this.angles2[i].push({object:this,element:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][j]});var prevRadius=radius;}
|
26
|
+
seq--;}else{var arcPath=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:radius,start:start+prop.margin+prop.segmentsAngleOffset,end:end-prop.margin+prop.segmentsAngleOffset,anticlockwise:false});var path=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'{1} z'.format(arcPath),fill:prop.colorsSequential?prop.colors[i]:prop.colors[0],'fill-opacity':prop.colorsOpacity,stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-index':i,'data-centerx':this.centerx+explosion[0],'data-centery':this.centery+explosion[1],'data-value':this.data[i],'data-start-angle':start,'data-end-angle':end,'data-radius':radius,'data-sequential':seq}});this.angles.push({object:this,element:path,index:i,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':0,value:this.data[i]});this.angles2[i].push({object:this,element:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':0,value:this.data[i][j]});if(prop.tooltips&&prop.tooltips[i]){if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
|
27
27
|
(function(index,obj)
|
28
28
|
{path.addEventListener(prop.tooltipsEvent,function(e)
|
29
29
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,index:index,group:index,sequentialIndex:index,text:prop.tooltips[index],event:e});obj.highlight(e.target);var highlight=RG.SVG.REG.get('highlight');if(prop.tooltipsEvent==='mousemove'){highlight.style.cursor='pointer';}},false);if(prop.tooltipsEvent==='click'){path.addEventListener('mousemove',function(e)
|
30
30
|
{e.target.style.cursor='pointer';},false);}}(i,this));}}}};this.drawRoseNonEquiAngular=function(opt)
|
31
31
|
{var group=RG.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{id:'rgraph_rose_segments_'+this.id}});for(var i=0,total=0;i<this.data.length;++i){total+=parseFloat(this.data[i][1]);}
|
32
32
|
var start=0;for(var i=0,seq=0;i<this.data.length;++i,++seq){var radians=(this.data[i][1]/total)*RG.SVG.TRIG.TWOPI,end=start+radians;var explosion=this.getExploded({index:i,start:start-RG.SVG.TRIG.HALFPI,end:end-RG.SVG.TRIG.HALFPI});if(typeof this.data[i][0]==='object'&&!RG.SVG.isNull(this.data[i][0])){for(var j=0,sum=0;j<this.data[i][0].length;++j,++seq){sum+=this.data[i][0][j];if(j===0){var prevRadius=0,radius=(sum/this.scale.max)*this.radius;var arcPath=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:radius,start:start+prop.margin+prop.segmentsAngleOffset,end:end-prop.margin+prop.segmentsAngleOffset,anticlockwise:false});var arcPath2='';}else{var prevRadius=radius,radius=(sum/this.scale.max)*this.radius;var arcPath=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:radius,start:start+prop.margin+prop.segmentsAngleOffset,end:end-prop.margin+prop.segmentsAngleOffset,anticlockwise:false});var arcPath2=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:prevRadius,start:end-prop.margin+prop.segmentsAngleOffset,end:start+prop.margin+prop.segmentsAngleOffset,anticlockwise:true});}
|
33
|
-
var path=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'{1} {2} z'.format(arcPath,arcPath2),fill:prop.colorsSequential?prop.colors[seq]:prop.colors[j],'fill-opacity':prop.colorsOpacity,stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-centerx':this.centerx+explosion[0],'data-centery':this.centery+explosion[1],'data-index':'[{1},{2}]'.format(i,j),'data-value':this.data[i][0][j],'data-start-angle':start,'data-end-angle':end,'data-radius':radius,'data-radius-inner':prevRadius,'data-sequential':seq}});this.angles.push({object:path,index:i,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][0]});this.angles2[i].push({object:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][j]});if(prop.tooltips&&prop.tooltips[seq]){if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
|
33
|
+
var path=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'{1} {2} z'.format(arcPath,arcPath2),fill:prop.colorsSequential?prop.colors[seq]:prop.colors[j],'fill-opacity':prop.colorsOpacity,stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-centerx':this.centerx+explosion[0],'data-centery':this.centery+explosion[1],'data-index':'[{1},{2}]'.format(i,j),'data-value':this.data[i][0][j],'data-start-angle':start,'data-end-angle':end,'data-radius':radius,'data-radius-inner':prevRadius,'data-sequential':seq}});this.angles.push({object:this,element:path,index:i,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][0]});this.angles2[i].push({object:this,element:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':prevRadius,value:this.data[i][j]});if(prop.tooltips&&prop.tooltips[seq]){if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
|
34
34
|
(function(index,group,seq,obj)
|
35
35
|
{path.addEventListener(prop.tooltipsEvent,function(e)
|
36
36
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,index:index,group:group,sequentialIndex:seq,text:prop.tooltips[seq],event:e});obj.highlight(e.target);var highlight=RG.SVG.REG.get('highlight');if(prop.tooltipsEvent==='mousemove'){highlight.style.cursor='pointer';}},false);if(prop.tooltipsEvent==='click'){path.addEventListener('mousemove',function(e)
|
37
37
|
{e.target.style.cursor='pointer';},false);}}(j,i,seq,this));}
|
38
38
|
var prevRadius=radius;}
|
39
|
-
seq--}else{var radius=(this.data[i][0]/this.scale.max)*this.radius;var arcPath=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:radius,start:start+prop.margin+prop.segmentsAngleOffset,end:end-prop.margin+prop.segmentsAngleOffset,anticlockwise:false});var path=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'{1} z'.format(arcPath),fill:prop.colorsSequential?prop.colors[i]:prop.colors[0],'fill-opacity':prop.colorsOpacity,stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-centerx':this.centerx+explosion[0],'data-centery':this.centery+explosion[1],'data-index':i,'data-value':this.data[i],'data-start-angle':start,'data-end-angle':end,'data-radius':radius,'data-sequential':seq}});this.angles.push({object:path,index:i,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,value:this.data[i][0]});this.angles2[i].push({object:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':0,value:this.data[i][j]});if(prop.tooltips&&prop.tooltips[i]){if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
|
39
|
+
seq--}else{var radius=(this.data[i][0]/this.scale.max)*this.radius;var arcPath=RG.SVG.TRIG.getArcPath2({cx:this.centerx+explosion[0],cy:this.centery+explosion[1],r:radius,start:start+prop.margin+prop.segmentsAngleOffset,end:end-prop.margin+prop.segmentsAngleOffset,anticlockwise:false});var path=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'{1} z'.format(arcPath),fill:prop.colorsSequential?prop.colors[i]:prop.colors[0],'fill-opacity':prop.colorsOpacity,stroke:prop.strokestyle,'stroke-width':prop.linewidth,'data-tooltip':(!RG.SVG.isNull(prop.tooltips)&&prop.tooltips.length)?prop.tooltips[i]:'','data-centerx':this.centerx+explosion[0],'data-centery':this.centery+explosion[1],'data-index':i,'data-value':this.data[i],'data-start-angle':start,'data-end-angle':end,'data-radius':radius,'data-sequential':seq}});this.angles.push({object:this,element:path,index:i,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,value:this.data[i][0]});this.angles2[i].push({object:this,element:path,index:seq,cx:this.centerx+explosion[0],cy:this.centery+explosion[1],start:start,end:end,radius:radius,'radius-inner':0,value:this.data[i][j]});if(prop.tooltips&&prop.tooltips[i]){if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
|
40
40
|
(function(index,group,seq,obj)
|
41
41
|
{path.addEventListener(prop.tooltipsEvent,function(e)
|
42
42
|
{obj.removeHighlight();RG.SVG.tooltip({object:obj,index:index,group:index,sequentialIndex:seq,text:prop.tooltips[index],event:e});obj.highlight(e.target);var highlight=RG.SVG.REG.get('highlight');if(prop.tooltipsEvent==='mousemove'){highlight.style.cursor='pointer';}},false);if(prop.tooltipsEvent==='click'){path.addEventListener('mousemove',function(e)
|
43
43
|
{e.target.style.cursor='pointer';},false);}}(i,i,seq,this));}}
|
44
44
|
start+=radians;}};this.redrawRose=function()
|
45
45
|
{};this.drawLabels=function()
|
46
|
-
{if(prop.scaleVisible){for(var i=0;i<this.scale.labels.length;++i){var x=this.centerx;var y=this.centery-(this.radius/this.scale.labels.length*(i+1));RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,text:this.scale.labels[i],size:prop.scaleSize||prop.textSize-2,x:x,y:y,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}
|
47
|
-
var str=RG.SVG.numberFormat({object:this,num:this.scale.min.toFixed(prop.scaleDecimals),prepend:prop.scaleUnitsPre,append:prop.scaleUnitsPost,point:prop.scalePoint,thousand:prop.scaleThousand,formatter:prop.scaleFormatter});RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,text:str,size:prop.scaleSize||prop.textSize-2,x:this.centerx,y:this.centery,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}
|
46
|
+
{if(prop.scaleVisible){for(var i=0;i<this.scale.labels.length;++i){var x=this.centerx;var y=this.centery-(this.radius/this.scale.labels.length*(i+1));RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,tag:'labels.scale',text:this.scale.labels[i],size:prop.scaleSize||prop.textSize-2,x:x,y:y,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}
|
47
|
+
var str=RG.SVG.numberFormat({object:this,num:this.scale.min.toFixed(prop.scaleDecimals),prepend:prop.scaleUnitsPre,append:prop.scaleUnitsPost,point:prop.scalePoint,thousand:prop.scaleThousand,formatter:prop.scaleFormatter});RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,tag:'labels.scale',text:str,size:prop.scaleSize||prop.textSize-2,x:this.centerx,y:this.centery,halign:'center',valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.scaleColor||prop.textColor,bold:typeof prop.scaleBold==='boolean'?prop.scaleBold:prop.textBold,italic:typeof prop.scaleItalic==='boolean'?prop.scaleItalic:prop.textItalic,font:prop.scaleFont||prop.textFont});}
|
48
48
|
var halign;if(typeof prop.labelsSize!=='number'){prop.labelsSize=prop.textSize+4;}
|
49
|
-
for(var i=0;i<prop.labels.length;++i){if(prop.variant==='non-equi-angular'){var angle=((this.angles2[i][0].end-this.angles2[i][0].start)/2)+this.angles2[i][0].start-RG.SVG.TRIG.HALFPI;}else{var angle=(((RG.SVG.TRIG.TWOPI/prop.labels.length))*i)-RG.SVG.TRIG.HALFPI+prop.labelsAngleOffset+(
|
49
|
+
for(var i=0;i<prop.labels.length;++i){if(prop.variant==='non-equi-angular'){var angle=((this.angles2[i][0].end-this.angles2[i][0].start)/2)+this.angles2[i][0].start-RG.SVG.TRIG.HALFPI;}else{var angle=(((RG.SVG.TRIG.TWOPI/prop.labels.length))*i)-RG.SVG.TRIG.HALFPI+prop.labelsAngleOffset+(RG.SVG.TRIG.TWOPI/(2*prop.labels.length));}
|
50
50
|
var endpoint=RG.SVG.TRIG.getRadiusEndPoint({r:this.radius+prop.labelsRadialMargin,angle:angle});var explosion=this.getExploded({index:i,start:this.angles2[i][0].start-RG.SVG.TRIG.HALFPI,end:this.angles2[i][0].end-RG.SVG.TRIG.HALFPI});endpoint[0]+=this.centerx+explosion[0];endpoint[1]+=this.centery+explosion[1];if(ma.round(endpoint[0])>this.centerx){halign='left';}else if(ma.round(endpoint[0])===this.centerx){halign='center';}else{halign='right';}
|
51
|
-
RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,text:typeof prop.labels[i]==='string'?prop.labels[i]:'',size:prop.labelsSize,x:endpoint[0],y:endpoint[1],halign:halign,valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.labelsColor||prop.textColor,bold:typeof prop.labelsBold==='boolean'?prop.labelsBold:prop.textBold,italic:typeof prop.labelsItalic==='boolean'?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}};this.highlight=function(path)
|
52
|
-
{var path=path.getAttribute('d');var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.highlightFill,stroke:prop.highlightStroke,'stroke-width':prop.highlightLinewidth}});if(prop.tooltipsEvent==='mousemove'){highlight.addEventListener('mouseout',function(e)
|
51
|
+
RG.SVG.text({object:this,svg:this.svg,parent:this.svg.all,tag:'labels',text:typeof prop.labels[i]==='string'?prop.labels[i]:'',size:prop.labelsSize,x:endpoint[0],y:endpoint[1],halign:halign,valign:'center',background:'rgba(255,255,255,0.7)',padding:2,color:prop.labelsColor||prop.textColor,bold:typeof prop.labelsBold==='boolean'?prop.labelsBold:prop.textBold,italic:typeof prop.labelsItalic==='boolean'?prop.labelsItalic:prop.textItalic,font:prop.labelsFont||prop.textFont});}};this.highlight=function(path)
|
52
|
+
{var path=path.getAttribute('d');var highlight=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'path',attr:{d:path,fill:prop.highlightFill,stroke:prop.highlightStroke,'stroke-width':prop.highlightLinewidth},style:{pointerEvents:'none'}});if(prop.tooltipsEvent==='mousemove'){highlight.addEventListener('mouseout',function(e)
|
53
53
|
{highlight.parentNode.removeChild(highlight);RG.SVG.hideTooltip();RG.SVG.REG.set('highlight',null);},false);}
|
54
54
|
RG.SVG.REG.set('highlight',highlight);};this.parseColors=function()
|
55
55
|
{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),highlightFill:RG.SVG.arrayClone(prop.highlightFill)}}
|
@@ -62,6 +62,6 @@ this.max=max;};this.getRadius=function(value)
|
|
62
62
|
{if(type.substr(0,2)!=='on'){type='on'+type;}
|
63
63
|
RG.SVG.addCustomEventListener(this,type,func);return this;};this.exec=function(func)
|
64
64
|
{func(this);return this;};this.removeHighlight=this.hideHighlight=function()
|
65
|
-
{var highlight=RG.SVG.REG.get('highlight');if(highlight
|
65
|
+
{var highlight=RG.SVG.REG.get('highlight');if(highlight){highlight.setAttribute('fill','transparent');highlight.setAttribute('stroke','transparent');highlight=null;RG.SVG.REG.set('highlight',null);}};this.getExploded=function(opt)
|
66
66
|
{var index=opt.index,start=opt.start,end=opt.end,exploded=prop.exploded,explodedX,explodedY;if(typeof exploded==='object'&&typeof exploded[index]==='number'){explodedX=ma.cos(((end-start)/2)+start)*exploded[index];explodedY=(ma.sin(((end-start)/2)+start)*exploded[index]);}else if(typeof exploded==='number'){explodedX=ma.cos(((end-start)/2)+start)*exploded;explodedY=ma.sin(((end-start)/2)+start)*exploded;}else{explodedX=0;explodedY=0;}
|
67
67
|
return[explodedX,explodedY];};for(i in conf.options){if(typeof i==='string'){this.set(i,conf.options[i]);}}};return this;})(window,document);
|