rgraph-rails 1.0.7 → 1.0.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b971479430e7a10bed7531bb4f508513757e8ea3
-  data.tar.gz: 504eb2e14f1a3d4965d38e0f4e43d1be6abd08d7
+  metadata.gz: 9e47ecbb8906997092674ef40da68bf4368c58d8
+  data.tar.gz: 26702943c799c8e73c66da14ea8c932a96fa82ed
 SHA512:
-  metadata.gz: 683a12369e6a5171d1a83d0f6eb4d91fb275fcb94650fc0f0e20d83c9dc9e0222e631767757f730aae4cccb8cbd7e975a47045ef0c801d79bb43a853bd4c7035
-  data.tar.gz: 7292427cbd7e17259150de17aa0f3a14271a8e8a90f76a8c79bf289ca76e4bca77934eedeb80e786ec70edb653f7de0c77cadb968ba4df30ac6ed1c292d62646
+  metadata.gz: 07aa2605e50bbc47bf7d6ed1903ee0b81b99b3307f015ca218a2b5024586caba6c2ee55abe165776bbe73991982f1f84d4cd1b46ef230499d371a32e4f256e89
+  data.tar.gz: 875d758e1835599237b279edd026f2ad19706f19d18888f86b1c8a99cfde00a6066ec624c2d956765cf05f8998f7815311c2b5f59dd0eec80b7eb1c948e1ec47

data/README.md

@@ -2,7 +2,7 @@
 
 [![Build Status](https://travis-ci.org/dsgriffin/rgraph-rails.svg?branch=master)](https://travis-ci.org/dsgriffin/rgraph-rails)
 [![Gem Version](https://badge.fury.io/rb/rgraph-rails.svg)](https://badge.fury.io/rb/rgraph-rails)
-![](https://img.shields.io/badge/rgraph-4.58-red.svg)
+![](https://img.shields.io/badge/rgraph-4.60-red.svg)
 
 Use the [rgraph](http://www.rgraph.net/) chart/graph library with the Rails asset pipeline.
 
@@ -11,7 +11,7 @@ Use the [rgraph](http://www.rgraph.net/) chart/graph library with the Rails asse
 Include the gem in your application's Gemfile:
 
 ```ruby
-gem 'rgraph-rails', '~> 1.0.7'
+gem 'rgraph-rails', '~> 1.0.8'
 ```
 
 And then execute:
@@ -77,5 +77,5 @@ Bug reports and pull requests are welcome. This project is intended to be a safe
 
 ## License
 
-See `license.txt`
+MIT
 

data/lib/rgraph-rails/version.rb

@@ -1,3 +1,3 @@
 module RgraphRails
-  VERSION = "1.0.7"
+  VERSION = "1.0.8"
 end

data/license.txt

@@ -1,19 +1,7 @@
+Copyright (c) 2016 Daniel Griffin
 
-The RGraph license
-==================
-RGraph is dual licensed under the Open Source GPL (General Public License) v2.0. If you want to use it under the
-terms of the GPL then you are free to do so. If you don't wish to be bound by the terms of the GPL then there is
-a commercial licensing scheme available which you can read about here:
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 
-            http://www.rgraph.net/license
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
 
-For commercial license there is a one-time fee of �99 that covers most use cases. The only exception is for OEM
-use - the OEM license is described on the website and costs �499. You can read the details about RGraph
-licensing here:
-
-            http://www.rgraph.net/license
-
-
-Support
-=======
-Support is available using the support forum: http://www.rgraph.net/forum
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/vendor/assets/javascripts/RGraph.bar.js

@@ -1,242 +1,3735 @@
+// version: 2017-01-02
+    /**
+    * o--------------------------------------------------------------------------------o
+    * | This file is part of the RGraph package - you can learn more at:               |
+    * |                                                                                |
+    * |                          http://www.rgraph.net                                 |
+    * |                                                                                |
+    * | RGraph is licensed under the Open Source MIT license. That means that it's     |
+    * | totally free to use!                                                           |
+    * o--------------------------------------------------------------------------------o
+    */
 
-RGraph=window.RGraph||{isRGraph:true};RGraph.Bar=function(conf)
-{if(typeof conf==='object'&&typeof conf.data==='object'&&typeof conf.id==='string'){var id=conf.id,canvas=document.getElementById(id),data=conf.data,parseConfObjectForOptions=true}else{var id=conf,canvas=document.getElementById(id),data=arguments[1]}
-this.id=id;this.canvas=canvas;this.context=this.canvas.getContext('2d');this.canvas.__object__=this;this.type='bar';this.max=0;this.stackedOrGrouped=false;this.isRGraph=true;this.uid=RGraph.CreateUID();this.canvas.uid=this.canvas.uid?this.canvas.uid:RGraph.CreateUID();this.colorsParsed=false;this.original_colors=[];this.cachedBackgroundCanvas=null;this.firstDraw=true;this.properties={'chart.background.barcolor1':'rgba(0,0,0,0)','chart.background.barcolor2':'rgba(0,0,0,0)','chart.background.grid':true,'chart.background.grid.color':'#ddd','chart.background.grid.width':1,'chart.background.grid.hsize':20,'chart.background.grid.vsize':20,'chart.background.grid.vlines':true,'chart.background.grid.hlines':true,'chart.background.grid.border':true,'chart.background.grid.autofit':true,'chart.background.grid.autofit.align':true,'chart.background.grid.autofit.numhlines':5,'chart.background.grid.autofit.numvlines':20,'chart.background.grid.dashed':false,'chart.background.grid.dotted':false,'chart.background.image.stretch':true,'chart.background.image.x':null,'chart.background.image.y':null,'chart.background.image.w':null,'chart.background.image.h':null,'chart.background.image.align':null,'chart.background.color':null,'chart.background.hbars':null,'chart.numyticks':10,'chart.hmargin':5,'chart.hmargin.grouped':1,'chart.strokecolor':'rgba(0,0,0,0)','chart.axis.color':'black','chart.axis.linewidth':1,'chart.gutter.top':25,'chart.gutter.bottom':30,'chart.gutter.left':25,'chart.gutter.right':25,'chart.labels':null,'chart.labels.bold':false,'chart.labels.color':null,'chart.labels.ingraph':null,'chart.labels.above':false,'chart.labels.above.decimals':0,'chart.labels.above.size':null,'chart.labels.above.color':null,'chart.labels.above.background':'rgba(0,0,0,0)','chart.labels.above.angle':null,'chart.labels.above.offset':4,'chart.labels.above.units.pre':'','chart.labels.above.units.post':'','chart.ylabels':true,'chart.ylabels.count':5,'chart.ylabels.inside':false,'chart.ylabels.offsetx':0,'chart.ylabels.offsety':0,'chart.labels.offsetx':0,'chart.labels.offsety':0,'chart.xaxispos':'bottom','chart.yaxispos':'left','chart.text.angle':0,'chart.text.color':'black','chart.text.size':12,'chart.text.font':'Segoe UI, Arial, Verdana, sans-serif','chart.text.accessible':true,'chart.text.accessible.overflow':'visible','chart.text.accessible.pointerevents':true,'chart.ymin':0,'chart.ymax':null,'chart.title':'','chart.title.font':null,'chart.title.background':null,'chart.title.hpos':null,'chart.title.vpos':null,'chart.title.bold':true,'chart.title.xaxis':'','chart.title.xaxis.bold':true,'chart.title.xaxis.size':null,'chart.title.xaxis.font':null,'chart.title.xaxis.color':null,'chart.title.yaxis':'','chart.title.yaxis.bold':true,'chart.title.yaxis.size':null,'chart.title.yaxis.font':null,'chart.title.yaxis.color':null,'chart.title.xaxis.pos':null,'chart.title.yaxis.pos':null,'chart.title.yaxis.x':null,'chart.title.yaxis.y':null,'chart.title.xaxis.x':null,'chart.title.xaxis.y':null,'chart.title.x':null,'chart.title.y':null,'chart.title.halign':null,'chart.title.valign':null,'chart.colors':['red','#0f0','blue','pink','orange','cyan','black','white','green','magenta'],'chart.colors.sequential':false,'chart.colors.reverse':false,'chart.grouping':'grouped','chart.variant':'bar','chart.variant.sketch.verticals':true,'chart.variant.threed.xaxis':true,'chart.variant.threed.yaxis':true,'chart.variant.threed.angle':0.1,'chart.variant.threed.offsetx':10,'chart.variant.threed.offsety':5,'chart.shadow':false,'chart.shadow.color':'#aaa','chart.shadow.offsetx':0,'chart.shadow.offsety':0,'chart.shadow.blur':15,'chart.tooltips':null,'chart.tooltips.effect':'fade','chart.tooltips.css.class':'RGraph_tooltip','chart.tooltips.event':'onclick','chart.tooltips.highlight':true,'chart.tooltips.hotspot.xonly':false,'chart.highlight.stroke':'rgba(0,0,0,0)','chart.highlight.fill':'rgba(255,255,255,0.7)','chart.key':null,'chart.key.background':'white','chart.key.position':'graph','chart.key.shadow':false,'chart.key.shadow.color':'#666','chart.key.shadow.blur':3,'chart.key.shadow.offsetx':2,'chart.key.shadow.offsety':2,'chart.key.position.gutter.boxed':false,'chart.key.position.x':null,'chart.key.position.y':null,'chart.key.interactive':false,'chart.key.interactive.highlight.chart.stroke':'black','chart.key.interactive.highlight.chart.fill':'rgba(255,255,255,0.7)','chart.key.interactive.highlight.label':'rgba(255,0,0,0.2)','chart.key.halign':'right','chart.key.color.shape':'square','chart.key.rounded':true,'chart.key.text.size':10,'chart.key.linewidth':1,'chart.key.colors':null,'chart.key.text.color':'black','chart.contextmenu':null,'chart.units.pre':'','chart.units.post':'','chart.scale.decimals':0,'chart.scale.point':'.','chart.scale.thousand':',','chart.scale.round':false,'chart.scale.zerostart':true,'chart.crosshairs':false,'chart.crosshairs.color':'#333','chart.crosshairs.hline':true,'chart.crosshairs.vline':true,'chart.linewidth':1,'chart.annotatable':false,'chart.annotate.color':'black','chart.zoom.factor':1.5,'chart.zoom.fade.in':true,'chart.zoom.fade.out':true,'chart.zoom.hdir':'right','chart.zoom.vdir':'down','chart.zoom.frames':25,'chart.zoom.delay':16.666,'chart.zoom.shadow':true,'chart.zoom.background':true,'chart.resizable':false,'chart.resize.handle.background':null,'chart.adjustable':false,'chart.adjustable.only':null,'chart.noaxes':false,'chart.noxaxis':false,'chart.noyaxis':false,'chart.events.click':null,'chart.events.mousemove':null,'chart.numxticks':null,'chart.bevel':false,'chart.errorbars':false,'chart.errorbars.color':'black','chart.errorbars.capped':true,'chart.errorbars.capped.width':14,'chart.errorbars.linewidth':1,'chart.combinedchart.effect':null,'chart.combinedchart.effect.options':null,'chart.combinedchart.effect.callback':null,'chart.clearto':'rgba(0,0,0,0)'}
-if(!this.canvas){alert('[BAR] No canvas support');return;}
-for(var i=0;i<data.length;++i){if(typeof data[i]==='string'){data[i]=parseFloat(data[i]);}else if(typeof data[i]==='object'&&data[i]){for(var j=0;j<data[i].length;++j){if(typeof data[i][j]==='string'){data[i][j]=parseFloat(data[i][j]);}}}else if(typeof data[i]==='undefined'){data[i]=null;}}
-for(var i=0;i<data.length;++i){if(typeof data[i]==='object'&&!RGraph.is_null(data[i])){this.stackedOrGrouped=true;}}
-var linear_data=RGraph.arrayLinearize(data);for(var i=0;i<linear_data.length;++i){this['$'+i]={};}
-this.data=data;this.original_data=RGraph.arrayClone(data);this.coords=[];this.coords2=[];this.coordsText=[];this.data_arr=RGraph.arrayLinearize(this.data);if(!this.canvas.__rgraph_aa_translated__){this.context.translate(0.5,0.5);this.canvas.__rgraph_aa_translated__=true;}
-var RG=RGraph,ca=this.canvas,co=ca.getContext('2d'),prop=this.properties,pa2=RG.path2,win=window,doc=document,ma=Math
-if(RG.Effects&&typeof RG.Effects.decorate==='function'){RG.Effects.decorate(this);}
-this.set=this.Set=function(name)
-{var value=typeof arguments[1]==='undefined'?null:arguments[1];if(arguments.length===1&&typeof arguments[0]==='object'){RG.parseObjectStyleConfig(this,arguments[0]);return this;}
-if(name.substr(0,6)!='chart.'){name='chart.'+name;}
-while(name.match(/([A-Z])/)){name=name.replace(/([A-Z])/,'.'+RegExp.$1.toLowerCase());}
-if(name==='chart.xlabels.offset'){name='chart.labels.offsety';}
-if(name=='chart.labels.abovebar'){name='chart.labels.above';}
-if(name=='chart.strokestyle'){name='chart.strokecolor';}
-if(name=='chart.xaxispos'){if(value!='bottom'&&value!='center'&&value!='top'){alert('[BAR] ('+this.id+') chart.xaxispos should be top, center or bottom. Tried to set it to: '+value+' Changing it to center');value='center';}
-if(value=='top'){for(var i=0;i<this.data.length;++i){if(typeof(this.data[i])=='number'&&this.data[i]>0){alert('[BAR] The data element with index '+i+' should be negative');}}}}
-if(name.toLowerCase()=='chart.linewidth'&&value==0){value=0.0001;}
-prop[name]=value;return this;};this.get=this.Get=function(name)
-{if(name.substr(0,6)!='chart.'){name='chart.'+name;}
-while(name.match(/([A-Z])/)){name=name.replace(/([A-Z])/,'.'+RegExp.$1.toLowerCase());}
-return prop[name];};this.draw=this.Draw=function()
-{if(typeof(prop['chart.background.image'])=='string'){RG.DrawBackgroundImage(this);}
-RG.FireCustomEvent(this,'onbeforedraw');if(prop['chart.variant']==='3d'){if(prop['chart.text.accessible']){}else{co.setTransform(1,prop['chart.variant.threed.angle'],0,1,0.5,0.5);}}
-if(!this.colorsParsed){this.parseColors();this.colorsParsed=true;}
-this.gutterLeft=prop['chart.gutter.left'];this.gutterRight=prop['chart.gutter.right'];this.gutterTop=prop['chart.gutter.top'];this.gutterBottom=prop['chart.gutter.bottom'];if((prop['chart.variant']=='pyramid'||prop['chart.variant']=='dot')&&typeof(prop['chart.tooltips'])=='object'&&prop['chart.tooltips']&&prop['chart.tooltips'].length>0){alert('[BAR] ('+this.id+') Sorry, tooltips are not supported with dot or pyramid charts');}
-this.coords=[];this.coords2=[];this.coordsText=[];this.max=0;this.grapharea=ca.height-this.gutterTop-this.gutterBottom;this.halfgrapharea=this.grapharea/2;this.halfTextHeight=prop['chart.text.size']/2;RG.background.Draw(this);this.drawbars();this.drawAxes();this.DrawLabels();if(prop['chart.bevel']||prop['chart.bevelled']){this.DrawBevel();}
-if(prop['chart.key']&&prop['chart.key'].length){RG.DrawKey(this,prop['chart.key'],prop['chart.colors']);}
-if(prop['chart.contextmenu']){RG.ShowContext(this);}
-if(prop['chart.errorbars']){this.drawErrorbars();}
-if(prop['chart.labels.ingraph']){RG.DrawInGraphLabels(this);}
-if(prop['chart.resizable']){RG.AllowResizing(this);}
-RG.InstallEventListeners(this);if(this.firstDraw){RG.fireCustomEvent(this,'onfirstdraw');this.firstDraw=false;this.firstDrawFunc();}
-RG.fireCustomEvent(this,'ondraw');return this;};this.exec=function(func)
-{func(this);return this;};this.drawAxes=this.DrawAxes=function()
-{if(prop['chart.noaxes']){return;}
-var xaxispos=prop['chart.xaxispos'];var yaxispos=prop['chart.yaxispos'];var isSketch=prop['chart.variant']=='sketch';co.beginPath();co.strokeStyle=prop['chart.axis.color'];co.lineWidth=prop['chart.axis.linewidth']+0.001;if(RG.ISSAFARI==-1){co.lineCap='square';}
-if(prop['chart.noyaxis']==false){if(yaxispos=='right'){co.moveTo(ca.width-this.gutterRight+(isSketch?3:0),this.gutterTop-(isSketch?3:0));co.lineTo(ca.width-this.gutterRight-(isSketch?2:0),ca.height-this.gutterBottom+(isSketch?5:0));}else{co.moveTo(this.gutterLeft-(isSketch?2:0),this.gutterTop-(isSketch?5:0));co.lineTo(this.gutterLeft-(isSketch?1:0),ca.height-this.gutterBottom+(isSketch?5:0));}}
-if(prop['chart.noxaxis']==false){if(xaxispos=='center'){co.moveTo(this.gutterLeft-(isSketch?5:0),Math.round(((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop+(isSketch?2:0)));co.lineTo(ca.width-this.gutterRight+(isSketch?5:0),Math.round(((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop-(isSketch?2:0)));}else if(xaxispos=='top'){co.moveTo(this.gutterLeft-(isSketch?3:0),this.gutterTop-(isSketch?3:0));co.lineTo(ca.width-this.gutterRight+(isSketch?5:0),this.gutterTop+(isSketch?2:0));}else{co.moveTo(this.gutterLeft-(isSketch?5:0),ma.round(this.getYCoord(0)-(isSketch?2:0)));co.lineTo(ca.width-this.gutterRight+(isSketch?8:0),ma.round(this.getYCoord(0)+(isSketch?2:0)));}}
-var numYTicks=prop['chart.numyticks'];if(prop['chart.noyaxis']==false&&!isSketch){var yTickGap=(ca.height-this.gutterTop-this.gutterBottom)/numYTicks;var xpos=yaxispos=='left'?this.gutterLeft:ca.width-this.gutterRight;if(this.properties['chart.numyticks']>0){for(y=this.gutterTop;xaxispos=='center'?y<=(ca.height-this.gutterBottom):y<(ca.height-this.gutterBottom+(xaxispos=='top'?1:0));y+=yTickGap){if(xaxispos=='center'&&y==(this.gutterTop+(this.grapharea/2))){continue;}
-if(xaxispos=='top'&&y==this.gutterTop){continue;}
-co.moveTo(xpos+(yaxispos=='left'?0:0),ma.round(y));co.lineTo(xpos+(yaxispos=='left'?-3:3),ma.round(y));}
-if(xaxispos==='bottom'&&prop['chart.ymin']!==0){co.moveTo(xpos+(yaxispos=='left'?0:0),ma.round(ca.height-prop['chart.gutter.bottom']));co.lineTo(xpos+(yaxispos=='left'?-3:3),ma.round(ca.height-prop['chart.gutter.bottom']));}}
-if(prop['chart.noxaxis']){if(xaxispos=='center'){co.moveTo(xpos+(yaxispos=='left'?-3:3),Math.round(ca.height/2));co.lineTo(xpos,Math.round(ca.height/2));}else if(xaxispos=='top'){co.moveTo(xpos+(yaxispos=='left'?-3:3),Math.round(this.gutterTop));co.lineTo(xpos,Math.round(this.gutterTop));}else{co.moveTo(xpos+(yaxispos=='left'?-3:3),Math.round(ca.height-this.gutterBottom));co.lineTo(xpos,Math.round(ca.height-this.gutterBottom));}}}
-if(prop['chart.noxaxis']==false&&!isSketch){if(typeof(prop['chart.numxticks'])=='number'){var xTickGap=(ca.width-this.gutterLeft-this.gutterRight)/prop['chart.numxticks'];}else{var xTickGap=(ca.width-this.gutterLeft-this.gutterRight)/this.data.length;}
-if(xaxispos=='bottom'){yStart=prop['chart.ymin']<0?this.getYCoord(0)-3:this.getYCoord(0);yEnd=this.getYCoord(0)+3;}else if(xaxispos=='top'){yStart=this.gutterTop-3;yEnd=this.gutterTop;}else if(xaxispos=='center'){yStart=((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop+3;yEnd=((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop-3;}
-var noEndXTick=prop['chart.noendxtick'];for(x=this.gutterLeft+(yaxispos=='left'?xTickGap:0),len=(ca.width-this.gutterRight+(yaxispos=='left'?5:0));x<len;x+=xTickGap){if(yaxispos=='left'&&!noEndXTick&&x>this.gutterLeft){co.moveTo(ma.round(x),yStart);co.lineTo(ma.round(x),yEnd);}else if(yaxispos=='left'&&noEndXTick&&x>this.gutterLeft&&x<(ca.width-this.gutterRight)){co.moveTo(ma.round(x),yStart);co.lineTo(ma.round(x),yEnd);}else if(yaxispos=='right'&&x<(ca.width-this.gutterRight)&&!noEndXTick){co.moveTo(ma.round(x),yStart);co.lineTo(ma.round(x),yEnd);}else if(yaxispos=='right'&&x<(ca.width-this.gutterRight)&&x>(this.gutterLeft)&&noEndXTick){co.moveTo(ma.round(x),yStart);co.lineTo(ma.round(x),yEnd);}}
-if(prop['chart.noyaxis']||prop['chart.numxticks']==null){if(typeof(prop['chart.numxticks'])=='number'&&prop['chart.numxticks']>0){co.moveTo(Math.round(this.gutterLeft),yStart);co.lineTo(Math.round(this.gutterLeft),yEnd);}}}
-if(prop['chart.noyaxis']&&prop['chart.noxaxis']==false&&prop['chart.numxticks']==null){if(xaxispos=='center'){co.moveTo(ma.round(this.gutterLeft),(ca.height/2)-3);co.lineTo(ma.round(this.gutterLeft),(ca.height/2)+3);}else{co.moveTo(ma.round(this.gutterLeft),ca.height-this.gutterBottom);co.lineTo(ma.round(this.gutterLeft),ca.height-this.gutterBottom+3);}}
-co.stroke();};this.drawbars=this.Drawbars=function()
-{co.lineWidth=prop['chart.linewidth'];co.strokeStyle=prop['chart.strokecolor'];co.fillStyle=prop['chart.colors'][0];var prevX=0,prevY=0,decimals=prop['chart.scale.decimals'];if(prop['chart.ymax']){this.scale2=RG.getScale2(this,{'max':prop['chart.ymax'],'strict':prop['chart.scale.round']?false:true,'min':prop['chart.ymin'],'scale.thousand':prop['chart.scale.thousand'],'scale.point':prop['chart.scale.point'],'scale.decimals':prop['chart.scale.decimals'],'ylabels.count':prop['chart.ylabels.count'],'scale.round':prop['chart.scale.round'],'units.pre':prop['chart.units.pre'],'units.post':prop['chart.units.post']});}else{var errorbars=prop['chart.errorbars'];if(typeof errorbars==='number'){var value=errorbars;prop['chart.errorbars']=[];for(var i=0;i<this.data.length;++i){if(typeof this.data[i]==='number'){prop['chart.errorbars'].push([value,null]);}else if(typeof this.data[i]==='object'&&!RG.isNull(this.data[i])){for(var j=0;j<this.data[i].length;++j){prop['chart.errorbars'].push([value,null]);}}}
-errorbars=prop['chart.errorbars'];}
-for(i=0;i<this.data.length;++i){if(typeof(this.data[i])=='object'){var value=prop['chart.grouping']==='grouped'?Number(RG.arrayMax(this.data[i],true)):Number(RG.array_sum(this.data[i]));}else{var value=Number(this.data[i]);}
-this.max=ma.max(ma.abs(this.max),ma.abs(value)+
-Number((typeof prop['chart.errorbars']==='object'&&typeof prop['chart.errorbars'][i]==='object'&&!RG.isNull(prop['chart.errorbars'][i])&&typeof prop['chart.errorbars'][i][0]==='number')?prop['chart.errorbars'][i][0]:0));}
-this.scale2=RGraph.getScale2(this,{'max':this.max,'min':prop['chart.ymin'],'scale.thousand':prop['chart.scale.thousand'],'scale.point':prop['chart.scale.point'],'scale.decimals':prop['chart.scale.decimals'],'ylabels.count':prop['chart.ylabels.count'],'scale.round':prop['chart.scale.round'],'units.pre':prop['chart.units.pre'],'units.post':prop['chart.units.post']});this.max=this.scale2.max;}
-if(prop['chart.adjustable']&&!prop['chart.ymax']){this.Set('chart.ymax',this.scale2.max);}
-if(prop['chart.background.hbars']&&prop['chart.background.hbars'].length>0){RGraph.DrawBars(this);}
-var variant=prop['chart.variant'];if(variant==='3d'){RG.draw3DAxes(this);}
-var xaxispos=prop['chart.xaxispos'],width=(ca.width-this.gutterLeft-this.gutterRight)/this.data.length,orig_height=height,hmargin=prop['chart.hmargin'],shadow=prop['chart.shadow'],shadowColor=prop['chart.shadow.color'],shadowBlur=prop['chart.shadow.blur'],shadowOffsetX=prop['chart.shadow.offsetx'],shadowOffsetY=prop['chart.shadow.offsety'],strokeStyle=prop['chart.strokecolor'],colors=prop['chart.colors'],sequentialColorIndex=0
-var height;for(i=0,len=this.data.length;i<len;i+=1){if(RG.arraySum(this.data[i])<0){var height=(RG.arraySum(this.data[i])+this.scale2.min)/(this.scale2.max-this.scale2.min);}else{var height=(RG.arraySum(this.data[i])-this.scale2.min)/(this.scale2.max-this.scale2.min);}
-height*=ma.abs(this.getYCoord(this.scale2.max)-this.getYCoord(this.scale2.min));var x=(i*width)+this.gutterLeft;var y=xaxispos=='center'?((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop-height:ca.height-height-this.gutterBottom;if(xaxispos=='top'){y=this.gutterTop+ma.abs(height);}
-if(height<0){y+=height;height=ma.abs(height);}
-if(shadow){co.shadowColor=shadowColor;co.shadowBlur=shadowBlur;co.shadowOffsetX=shadowOffsetX;co.shadowOffsetY=shadowOffsetY;}
-co.beginPath();if(typeof this.data[i]=='number'){if(xaxispos==='bottom'&&prop['chart.ymin']<0){if(this.data[i]>=0){height=ma.abs(this.getYCoord(0)-this.getYCoord(this.data[i]));}else{y=this.getYCoord(0);height=ma.abs(this.getYCoord(0)-this.getYCoord(this.data[i]));}}
-var barWidth=width-(2*hmargin);if(barWidth<0){alert('[RGRAPH] Warning: you have a negative bar width. This may be caused by the chart.hmargin being too high or the width of the canvas not being sufficient.');}
-co.strokeStyle=strokeStyle;co.fillStyle=colors[0];if(prop['chart.colors.sequential']){co.fillStyle=colors[i];}
-if(variant=='sketch'){co.lineCap='round';var sketchOffset=3;co.beginPath();co.strokeStyle=colors[0];if(prop['chart.colors.sequential']){co.strokeStyle=colors[i];}
-co.moveTo(x+hmargin+2,y+height-2);co.lineTo(x+hmargin-1,y-4);co.moveTo(x+hmargin-3,y+ -2+(this.data[i]<0?height:0));co.bezierCurveTo(x+((hmargin+width)*0.33),y+15+(this.data[i]<0?height-10:0),x+((hmargin+width)*0.66),y+5+(this.data[i]<0?height-10:0),x+hmargin+width+ -1,y+0+(this.data[i]<0?height:0));co.moveTo(x+hmargin+width-5,y-5);co.lineTo(x+hmargin+width-3,y+height-3);if(prop['chart.variant.sketch.verticals']){for(var r=0.2;r<=0.8;r+=0.2){co.moveTo(x+hmargin+width+(r>0.4?-1:3)-(r*width),y-1);co.lineTo(x+hmargin+width-(r>0.4?1:-1)-(r*width),y+height+(r==0.2?1:-2));}}
-co.stroke();}else if(variant=='bar'||variant=='3d'||variant=='glass'||variant=='bevel'){if(RGraph.ISOLD&&shadow){this.DrawIEShadow([x+hmargin,y,barWidth,height]);}
-if(variant=='glass'){RGraph.filledCurvyRect(co,x+hmargin,y,barWidth,height,3,this.data[i]>0,this.data[i]>0,this.data[i]<0,this.data[i]<0);RGraph.strokedCurvyRect(co,x+hmargin,y,barWidth,height,3,this.data[i]>0,this.data[i]>0,this.data[i]<0,this.data[i]<0);}else{co.beginPath();co.rect(x+hmargin,y,barWidth,height);co.fill();RG.NoShadow(this);co.beginPath();co.rect(x+hmargin,y,barWidth,height);co.stroke();}
-if(variant=='3d'){var prevStrokeStyle=co.strokeStyle;var prevFillStyle=co.fillStyle;if(this.data[i]>=0){co.beginPath();co.moveTo(x+hmargin,y);co.lineTo(x+hmargin+prop['chart.variant.threed.offsetx'],y-prop['chart.variant.threed.offsety']);co.lineTo(x+hmargin+prop['chart.variant.threed.offsetx']+barWidth,y-prop['chart.variant.threed.offsety']);co.lineTo(x+hmargin+barWidth,y);co.closePath();co.stroke();co.fill();}
-co.beginPath();co.moveTo(x+hmargin+barWidth,y);co.lineTo(x+hmargin+barWidth+prop['chart.variant.threed.offsetx'],this.data[i]<0&&xaxispos==='bottom'?this.getYCoord(0):(this.data[i]<0&&(y-prop['chart.variant.threed.offsety'])<(this.gutterTop+this.halfgrapharea)?(this.gutterTop+this.halfgrapharea):(y-prop['chart.variant.threed.offsety'])));co.lineTo(x+hmargin+barWidth+prop['chart.variant.threed.offsetx'],this.data[i]<0&&(y-prop['chart.variant.threed.offsety']+height)<(this.gutterTop+this.getYCoord(0))?this.getYCoord(this.data[i])-prop['chart.variant.threed.offsety']:(this.data[i]>0?y-prop['chart.variant.threed.offsety']+height:ma.min(y-prop['chart.variant.threed.offsety']+height,ca.height-this.gutterBottom)));co.lineTo(x+hmargin+barWidth,y+height);co.closePath();co.stroke();co.fill();if(this.data[i]>0){co.beginPath();co.fillStyle='rgba(255,255,255,0.5)';co.moveTo(x+hmargin,y);co.lineTo(x+hmargin+prop['chart.variant.threed.offsetx'],y-prop['chart.variant.threed.offsety']);co.lineTo(x+hmargin+prop['chart.variant.threed.offsetx']+barWidth,y-prop['chart.variant.threed.offsety']);co.lineTo(x+hmargin+barWidth,y);co.lineTo(x+hmargin,y);co.closePath();co.stroke();co.fill();}
-co.beginPath();co.fillStyle='rgba(0,0,0,0.4)';co.moveTo(x+hmargin+barWidth,y);co.lineTo(x+hmargin+barWidth+prop['chart.variant.threed.offsetx'],this.data[i]<0&&xaxispos==='bottom'?this.getYCoord(0):(this.data[i]<0&&(y-prop['chart.variant.threed.offsety'])<(this.gutterTop+this.halfgrapharea)?(this.gutterTop+this.halfgrapharea):y-prop['chart.variant.threed.offsety']));co.lineTo(x+hmargin+barWidth+prop['chart.variant.threed.offsetx'],this.data[i]<0&&(y-prop['chart.variant.threed.offsety']+height)<this.getYCoord(0)?this.getYCoord(0):this.data[i]>0?y-prop['chart.variant.threed.offsety']+height:ma.min(y-prop['chart.variant.threed.offsety']+height,ca.height-this.gutterBottom));co.lineTo(x+hmargin+barWidth,y+height);co.lineTo(x+hmargin+barWidth,y);co.closePath();co.stroke();co.fill();co.strokeStyle=prevStrokeStyle;co.fillStyle=prevFillStyle;}else if(variant=='glass'){var grad=co.createLinearGradient(x+hmargin,y,x+hmargin+(barWidth/2),y);grad.addColorStop(0,'rgba(255,255,255,0.9)');grad.addColorStop(1,'rgba(255,255,255,0.5)');co.beginPath();co.fillStyle=grad;co.fillRect(x+hmargin+2,y+(this.data[i]>0?2:0),(barWidth/2)-2,height-2);co.fill();}}else if(variant=='dot'){co.beginPath();co.moveTo(x+(width/2),y);co.lineTo(x+(width/2),y+height);co.stroke();co.beginPath();co.fillStyle=this.properties['chart.colors'][i];co.arc(x+(width/2),y+(this.data[i]>0?0:height),2,0,6.28,0);co.fillStyle=prop['chart.colors'][0];if(prop['chart.colors.sequential']){co.fillStyle=colors[i];}
-co.stroke();co.fill();}else{alert('[BAR] Warning! Unknown chart.variant: '+variant);}
-this.coords.push([x+hmargin,y,width-(2*hmargin),height]);if(typeof this.coords2[i]=='undefined'){this.coords2[i]=[];}
-this.coords2[i].push([x+hmargin,y,width-(2*hmargin),height]);}else if(this.data[i]&&typeof(this.data[i])=='object'&&prop['chart.grouping']=='stacked'){if(this.scale2.min){alert("[ERROR] Stacked Bar charts with a Y min are not supported");}
-var barWidth=width-(2*hmargin);var redrawCoords=[];var startY=0;var dataset=this.data[i];if(barWidth<0){alert('[RGRAPH] Warning: you have a negative bar width. This may be caused by the chart.hmargin being too high or the width of the canvas not being sufficient.');}
-for(j=0;j<dataset.length;++j){if(xaxispos=='center'){alert("[BAR] It's pointless having the X axis position at the center on a stacked bar chart.");return;}
-if(this.data[i][j]<0){alert('[BAR] Negative values are not permitted with a stacked bar chart. Try a grouped one instead.');return;}
-co.strokeStyle=strokeStyle
-co.fillStyle=colors[j];if(prop['chart.colors.reverse']){co.fillStyle=colors[this.data[i].length-j-1];}
-if(prop['chart.colors.sequential']&&colors[sequentialColorIndex]){co.fillStyle=colors[sequentialColorIndex++];}else if(prop['chart.colors.sequential']){co.fillStyle=colors[sequentialColorIndex-1];}
-var height=(dataset[j]/this.scale2.max)*(ca.height-this.gutterTop-this.gutterBottom);if(xaxispos=='center'){height/=2;}
-var totalHeight=(RGraph.array_sum(dataset)/this.scale2.max)*(ca.height-hmargin-this.gutterTop-this.gutterBottom);this.coords.push([x+hmargin,y,width-(2*hmargin),height]);if(typeof this.coords2[i]=='undefined'){this.coords2[i]=[];}
-this.coords2[i].push([x+hmargin,y,width-(2*hmargin),height]);if(RGraph.ISOLD&&shadow){this.DrawIEShadow([x+hmargin,y,width-(2*hmargin),height+1]);}
-if(height>0){co.strokeRect(x+hmargin,y,width-(2*hmargin),height);co.fillRect(x+hmargin,y,width-(2*hmargin),height);}
-if(j==0){var startY=y;var startX=x;}
-if(shadow){redrawCoords.push([x+hmargin,y,width-(2*hmargin),height,co.fillStyle]);}
-if(variant=='3d'){var prevFillStyle=co.fillStyle;var prevStrokeStyle=co.strokeStyle;if(j==0){co.beginPath();co.moveTo(startX+hmargin,y);co.lineTo(startX+prop['chart.variant.threed.offsetx']+hmargin,y-prop['chart.variant.threed.offsety']);co.lineTo(startX+prop['chart.variant.threed.offsetx']+barWidth+hmargin,y-prop['chart.variant.threed.offsety']);co.lineTo(startX+barWidth+hmargin,y);co.closePath();co.fill();co.stroke();}
-co.beginPath();co.moveTo(startX+barWidth+hmargin,y);co.lineTo(startX+barWidth+hmargin+prop['chart.variant.threed.offsetx'],y-prop['chart.variant.threed.offsety']);co.lineTo(startX+barWidth+hmargin+prop['chart.variant.threed.offsetx'],y-prop['chart.variant.threed.offsety']+height);co.lineTo(startX+barWidth+hmargin,y+height);co.closePath();co.fill();co.stroke();if(j==0){co.fillStyle='rgba(255,255,255,0.5)';co.beginPath();co.moveTo(startX+hmargin,y);co.lineTo(startX+prop['chart.variant.threed.offsetx']+hmargin,y-prop['chart.variant.threed.offsety']);co.lineTo(startX+prop['chart.variant.threed.offsetx']+barWidth+hmargin,y-prop['chart.variant.threed.offsety']);co.lineTo(startX+barWidth+hmargin,y);co.closePath();co.fill();co.stroke();}
-co.fillStyle='rgba(0,0,0,0.4)';co.beginPath();co.moveTo(startX+barWidth+hmargin,y);co.lineTo(startX+barWidth+hmargin+prop['chart.variant.threed.offsetx'],y-prop['chart.variant.threed.offsety']);co.lineTo(startX+barWidth+hmargin+prop['chart.variant.threed.offsetx'],y-prop['chart.variant.threed.offsety']+height);co.lineTo(startX+barWidth+hmargin,y+height);co.closePath();co.fill();co.stroke();co.strokeStyle=prevStrokeStyle;co.fillStyle=prevFillStyle;}
-y+=height;}
-if(shadow){RGraph.NoShadow(this);for(k=0;k<redrawCoords.length;++k){co.strokeStyle=strokeStyle;co.fillStyle=redrawCoords[k][4];co.strokeRect(redrawCoords[k][0],redrawCoords[k][1],redrawCoords[k][2],redrawCoords[k][3]);co.fillRect(redrawCoords[k][0],redrawCoords[k][1],redrawCoords[k][2],redrawCoords[k][3]);co.stroke();co.fill();}
-redrawCoords=[];}}else if(this.data[i]&&typeof(this.data[i])=='object'&&prop['chart.grouping']=='grouped'){var redrawCoords=[];co.lineWidth=prop['chart.linewidth'];for(j=0;j<this.data[i].length;++j){co.strokeStyle=strokeStyle;co.fillStyle=colors[j];if(prop['chart.colors.sequential']&&colors[sequentialColorIndex]){co.fillStyle=colors[sequentialColorIndex++];}else if(prop['chart.colors.sequential']){co.fillStyle=colors[sequentialColorIndex-1];}
-var individualBarWidth=(width-(2*hmargin))/this.data[i].length;var height=((this.data[i][j]+(this.data[i][j]<0?this.scale2.min:(-1*this.scale2.min)))/(this.scale2.max-this.scale2.min))*(ca.height-this.gutterTop-this.gutterBottom);var groupedMargin=prop['chart.hmargin.grouped'];var startX=x+hmargin+(j*individualBarWidth);if(individualBarWidth<0){alert('[RGRAPH] Warning: you have a negative bar width. This may be caused by the chart.hmargin being too high or the width of the canvas not being sufficient.');}
-if(xaxispos=='center'){height/=2;}
-if(xaxispos=='top'){var startY=this.gutterTop;var height=Math.abs(height);}else if(xaxispos=='center'){var startY=this.gutterTop+(this.grapharea/2)-height;}else{var startY=this.getYCoord(0);var height=ma.abs(ma.abs(this.getYCoord(this.data[i][j]))-this.getYCoord(0));if(this.data[i][j]>=0){startY-=height;}}
-co.strokeRect(startX+groupedMargin,startY,individualBarWidth-(2*groupedMargin),height);co.fillRect(startX+groupedMargin,startY,individualBarWidth-(2*groupedMargin),height);y+=height;if(variant=='3d'){var prevFillStyle=co.fillStyle;var prevStrokeStyle=co.strokeStyle;var hmarginGrouped=prop['chart.hmargin.grouped'];if(this.data[i][j]>=0){co.beginPath();co.moveTo(startX+hmarginGrouped,startY);co.lineTo(startX+hmarginGrouped+prop['chart.variant.threed.offsetx'],startY-prop['chart.variant.threed.offsety']);co.lineTo(startX+prop['chart.variant.threed.offsetx']+individualBarWidth-hmarginGrouped,startY-prop['chart.variant.threed.offsety']);co.lineTo(startX+individualBarWidth-hmarginGrouped,startY);co.closePath();co.fill();co.stroke();}
-co.beginPath();co.moveTo(startX+individualBarWidth-hmarginGrouped-1,startY);co.lineTo(startX+individualBarWidth-hmarginGrouped+prop['chart.variant.threed.offsetx'],this.data[i][j]<0?(this.getYCoord(0)+ma.abs(height)-prop['chart.variant.threed.offsety']):this.getYCoord(0)-height-prop['chart.variant.threed.offsety']);co.lineTo(startX+individualBarWidth-hmarginGrouped+prop['chart.variant.threed.offsetx'],this.data[i][j]<0&&(startY+height-prop['chart.variant.threed.offsety'])<(this.gutterTop+this.halfgrapharea)?(this.gutterTop+this.halfgrapharea):(startY+height-prop['chart.variant.threed.offsety']));co.lineTo(startX+individualBarWidth-hmarginGrouped-1,startY+height);co.closePath();co.fill();co.stroke();if(this.data[i][j]>=0){co.fillStyle='rgba(255,255,255,0.5)';co.beginPath();co.moveTo(startX+hmarginGrouped,startY);co.lineTo(startX+hmarginGrouped+prop['chart.variant.threed.offsetx'],startY-prop['chart.variant.threed.offsety']);co.lineTo(startX+prop['chart.variant.threed.offsetx']+individualBarWidth-hmarginGrouped,startY-prop['chart.variant.threed.offsety']);co.lineTo(startX+individualBarWidth-hmarginGrouped,startY);co.closePath();co.fill();co.stroke();}
-co.fillStyle='rgba(0,0,0,0.4)';co.beginPath();co.moveTo(startX+individualBarWidth-hmarginGrouped,startY);co.lineTo(startX+individualBarWidth+prop['chart.variant.threed.offsetx']-hmarginGrouped,this.data[i][j]<0?(this.getYCoord(0)+ma.abs(height)-prop['chart.variant.threed.offsety']):this.getYCoord(0)-height-prop['chart.variant.threed.offsety']);co.lineTo(startX+individualBarWidth+prop['chart.variant.threed.offsetx']-hmarginGrouped,this.data[i][j]<0&&(startY+height-5)<(this.gutterTop+this.halfgrapharea)?(this.gutterTop+this.halfgrapharea):(startY+height-prop['chart.variant.threed.offsety']));co.lineTo(startX+individualBarWidth-hmarginGrouped,startY+height);co.closePath();co.fill();co.stroke();co.strokeStyle=prevStrokeStyle;co.fillStyle=prevFillStyle;}
-if(height<0){height=Math.abs(height);startY=startY-height;}
-this.coords.push([startX+groupedMargin,startY,individualBarWidth-(2*groupedMargin),height]);if(typeof this.coords2[i]=='undefined'){this.coords2[i]=[];}
-this.coords2[i].push([startX+groupedMargin,startY,individualBarWidth-(2*groupedMargin),height]);if(prop['chart.shadow']){redrawCoords.push([startX+groupedMargin,startY,individualBarWidth-(2*groupedMargin),height,co.fillStyle]);}}
-if(redrawCoords.length){RGraph.NoShadow(this);co.lineWidth=prop['chart.linewidth'];co.beginPath();for(var j=0;j<redrawCoords.length;++j){co.fillStyle=redrawCoords[j][4];co.strokeStyle=prop['chart.strokecolor'];co.fillRect(redrawCoords[j][0],redrawCoords[j][1],redrawCoords[j][2],redrawCoords[j][3]);co.strokeRect(redrawCoords[j][0],redrawCoords[j][1],redrawCoords[j][2],redrawCoords[j][3]);}
-co.fill();co.stroke();redrawCoords=[];}}else{this.coords.push([]);}
-co.closePath();}
-if(prop['chart.variant']==='3d'&&prop['chart.yaxispos']==='right'){RG.draw3DYAxis(this);}
-RGraph.noShadow(this);};this.drawLabels=this.DrawLabels=function()
-{var context=co;var text_angle=prop['chart.text.angle'],text_size=prop['chart.text.size'],labels=prop['chart.labels']
-if(prop['chart.ylabels']){if(prop['chart.xaxispos']=='top')this.Drawlabels_top();if(prop['chart.xaxispos']=='center')this.Drawlabels_center();if(prop['chart.xaxispos']=='bottom')this.Drawlabels_bottom();}
-if(typeof(labels)=='object'&&labels){var yOffset=Number(prop['chart.labels.offsety']),xOffset=Number(prop['chart.labels.offsetx']),bold=prop['chart.labels.bold']
-if(prop['chart.text.angle']!=0){var valign='center';var halign='right';var angle=0-prop['chart.text.angle'];}else{var valign='top';var halign='center';var angle=0;}
-co.fillStyle=prop['chart.labels.color']||prop['chart.text.color'];var barWidth=(ca.width-this.gutterRight-this.gutterLeft)/labels.length;xTickGap=(ca.width-this.gutterRight-this.gutterLeft)/labels.length
-var i=0;var font=prop['chart.text.font'];for(x=this.gutterLeft+(xTickGap/2);x<=ca.width-this.gutterRight;x+=xTickGap){RG.text2(this,{'font':font,'size':text_size,'x':x+xOffset,'y':prop['chart.xaxispos']=='top'?this.gutterTop+yOffset-5:(ca.height-this.gutterBottom)+yOffset+3,'bold':bold,'text':String(labels[i++]),'valign':prop['chart.xaxispos']=='top'?'bottom':valign,'halign':halign,'tag':'label','marker':false,'angle':angle,'tag':'labels'});}}
-this.drawAboveLabels();};this.drawlabels_top=this.Drawlabels_top=function()
-{var ca=this.canvas;var co=this.context;var prop=this.properties;co.beginPath();co.fillStyle=prop['chart.text.color'];co.strokeStyle='black';if(prop['chart.xaxispos']=='top'){var context=co;var text_size=prop['chart.text.size'];var units_pre=prop['chart.units.pre'];var units_post=prop['chart.units.post'];var align=prop['chart.yaxispos']=='left'?'right':'left';var font=prop['chart.text.font'];var numYLabels=prop['chart.ylabels.count'];var ymin=prop['chart.ymin'];var offsetx=prop['chart.ylabels.offsetx'];var offsety=prop['chart.ylabels.offsety'];if(prop['chart.ylabels.inside']==true){var xpos=prop['chart.yaxispos']=='left'?this.gutterLeft+5:ca.width-this.gutterRight-5;var align=prop['chart.yaxispos']=='left'?'left':'right';var boxed=true;}else{var xpos=prop['chart.yaxispos']=='left'?this.gutterLeft-5:ca.width-this.gutterRight+5;var boxed=false;}
-if(typeof(prop['chart.ylabels.specific'])=='object'&&prop['chart.ylabels.specific']){var labels=RGraph.array_reverse(prop['chart.ylabels.specific']);var grapharea=ca.height-this.gutterTop-this.gutterBottom;for(var i=0;i<labels.length;++i){var y=this.gutterTop+(grapharea*(i/labels.length))+(grapharea/labels.length);RG.text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':y+offsety,'text':String(labels[i]),'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-return;}
-var labels=this.scale2.labels;for(var i=0;i<labels.length;++i){RGraph.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':this.gutterTop+((this.grapharea/labels.length)*(i+1))+offsety,'text':'-'+labels[i],'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-if(prop['chart.ymin']!=0||prop['chart.noxaxis']||prop['chart.scale.zerostart']){RGraph.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':this.gutterTop+offsety,'text':(this.scale2.min!=0?'-':'')+RGraph.numberFormat(this,(this.scale2.min.toFixed((this.scale2.min===0?0:prop['chart.scale.decimals']))),units_pre,units_post),'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}}
-co.fill();};this.drawlabels_center=this.Drawlabels_center=function()
-{var ca=this.canvas;var co=this.context;var prop=this.properties;var font=prop['chart.text.font'];var numYLabels=prop['chart.ylabels.count'];co.fillStyle=prop['chart.text.color'];if(prop['chart.xaxispos']=='center'){var text_size=prop['chart.text.size'];var units_pre=prop['chart.units.pre'];var units_post=prop['chart.units.post'];var context=co;var align='';var xpos=0;var boxed=false;var ymin=prop['chart.ymin'];var offsetx=prop['chart.ylabels.offsetx'];var offsety=prop['chart.ylabels.offsety'];co.fillStyle=prop['chart.text.color'];co.strokeStyle='black';if(prop['chart.ylabels.inside']==true){var xpos=prop['chart.yaxispos']=='left'?this.gutterLeft+5:ca.width-this.gutterRight-5;var align=prop['chart.yaxispos']=='left'?'left':'right';var boxed=true;}else{var xpos=prop['chart.yaxispos']=='left'?this.gutterLeft-5:ca.width-this.gutterRight+5;var align=prop['chart.yaxispos']=='left'?'right':'left';var boxed=false;}
-if(typeof(prop['chart.ylabels.specific'])=='object'&&prop['chart.ylabels.specific']){var labels=prop['chart.ylabels.specific'];var grapharea=ca.height-this.gutterTop-this.gutterBottom;for(var i=0;i<labels.length;++i){var y=this.gutterTop+((grapharea/2)/(labels.length-1))*i;RGraph.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':y+offsety,'text':String(labels[i]),'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-for(var i=labels.length-1;i>=1;--i){var y=this.gutterTop+(grapharea*(i/((labels.length-1)*2)))+(grapharea/2);RG.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':y+offsety,'text':String(labels[labels.length-i-1]),'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-return;}
-for(var i=0;i<this.scale2.labels.length;++i){var y=this.gutterTop+this.halfgrapharea-((this.halfgrapharea/numYLabels)*(i+1));var text=this.scale2.labels[i];RG.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':y+offsety,'text':text,'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-for(var i=(this.scale2.labels.length-1);i>=0;--i){var y=this.gutterTop+((this.halfgrapharea/numYLabels)*(i+1))+this.halfgrapharea;var text=this.scale2.labels[i];RG.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':y+offsety,'text':'-'+text,'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-if(this.scale2.min!=0||prop['chart.scale.zerostart']){RG.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':this.gutterTop+this.halfgrapharea+offsety,'text':RG.number_format(this,(this.scale2.min.toFixed((this.scale2.min===0?0:prop['chart.scale.decimals']))),units_pre,units_post),'valign':'center','valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}}};this.drawlabels_bottom=this.Drawlabels_bottom=function()
-{var text_size=prop['chart.text.size'],units_pre=prop['chart.units.pre'],units_post=prop['chart.units.post'],context=this.context,align=prop['chart.yaxispos']=='left'?'right':'left',font=prop['chart.text.font'],numYLabels=prop['chart.ylabels.count'],ymin=prop['chart.ymin'],offsetx=prop['chart.ylabels.offsetx'],offsety=prop['chart.ylabels.offsety']
-co.beginPath();co.fillStyle=prop['chart.text.color'];co.strokeStyle='black';if(prop['chart.ylabels.inside']==true){var xpos=prop['chart.yaxispos']=='left'?this.gutterLeft+5:ca.width-this.gutterRight-5;var align=prop['chart.yaxispos']=='left'?'left':'right';var boxed=true;}else{var xpos=prop['chart.yaxispos']=='left'?this.gutterLeft-5:ca.width-this.gutterRight+5;var boxed=false;}
-if(prop['chart.ylabels.specific']&&typeof(prop['chart.ylabels.specific'])=='object'){var labels=prop['chart.ylabels.specific'];var grapharea=ca.height-this.gutterTop-this.gutterBottom;for(var i=0;i<labels.length;++i){var y=this.gutterTop+(grapharea*(i/(labels.length-1)));RGraph.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':y+offsety,'text':labels[i],'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-return;}
-var gutterTop=this.gutterTop;var halfTextHeight=this.halfTextHeight;var scale=this.scale;for(var i=0;i<numYLabels;++i){var text=this.scale2.labels[i];RGraph.Text2(this,{'font':font,'size':text_size,'x':xpos+offsetx,'y':this.gutterTop+this.grapharea-((this.grapharea/numYLabels)*(i+1))+offsety,'text':text,'valign':'center','halign':align,'bordered':boxed,'tag':'scale'});}
-if(prop['chart.ymin']!=0||prop['chart.noxaxis']||prop['chart.scale.zerostart']){RG.text2(this,{font:font,size:text_size,x:xpos+offsetx,y:ca.height-this.gutterBottom+offsety,text:RG.numberFormat(this,(this.scale2.min.toFixed((this.scale2.min===0?0:prop['chart.scale.decimals']))),units_pre,units_post),valign:'center',halign:align,bordered:boxed,tag:'scale'});}
-co.fill();};this.drawIEShadow=this.DrawIEShadow=function(coords)
-{var co=this.context;var ca=this.canvas;var prop=this.properties;var prevFillStyle=co.fillStyle;var offsetx=prop['chart.shadow.offsetx'];var offsety=prop['chart.shadow.offsety'];co.lineWidth=prop['chart.linewidth'];co.fillStyle=prop['chart.shadow.color'];co.beginPath();co.fillRect(coords[0]+offsetx,coords[1]+offsety,coords[2],coords[3]);co.fill();co.fillStyle=prevFillStyle;};this.getShape=this.getBar=function(e)
-{var obj=arguments[1]?arguments[1]:this;var mouseXY=RG.getMouseXY(e),mouseX=mouseXY[0],mouseY=mouseXY[1],canvas=obj.canvas,context=obj.context,coords=obj.coords
-for(var i=0,len=coords.length;i<len;i+=1){if(obj.coords[i].length==0){continue;}
-var left=coords[i][0],top=coords[i][1],width=coords[i][2],height=coords[i][3],prop=obj.properties
-if(prop['chart.tooltips.hotspot.xonly']){pa2(co,'b r % % % %',left,this.gutterTop,width,ca.height-this.gutterBottom);}else{pa2(co,'b r % % % %',left,top,width,height);}
-if(co.isPointInPath(mouseX,mouseY)){if(prop['chart.tooltips']){var tooltip=RG.parseTooltipText?RG.parseTooltipText(prop['chart.tooltips'],i):prop['chart.tooltips'][i];}
-var dataset=0,idx=i
-while(idx>=(typeof obj.data[dataset]==='object'&&obj.data[dataset]?obj.data[dataset].length:1)){if(typeof obj.data[dataset]==='number'){idx-=1;}else if(obj.data[dataset]){idx-=obj.data[dataset].length;}else{idx-=1;}
-dataset++;}
-if(typeof(obj.data[dataset])=='number'){idx=null;}
-return{0:obj,1:left,2:top,3:width,4:height,5:i,'object':obj,'x':left,'y':top,'width':width,'height':height,'index':i,'tooltip':tooltip,'index_adjusted':idx,'dataset':dataset};}}
-return null;};this.getShapeByX=function(e)
-{var canvas=e.target;var mouseCoords=RGraph.getMouseXY(e);var obj=arguments[1]?arguments[1]:this;for(var i=0,len=obj.coords.length;i<len;i++){if(obj.coords[i].length==0){continue;}
-var mouseX=mouseCoords[0];var mouseY=mouseCoords[1];var left=obj.coords[i][0];var top=obj.coords[i][1];var width=obj.coords[i][2];var height=obj.coords[i][3];var prop=obj.properties;if(mouseX>=left&&mouseX<=(left+width)){if(prop['chart.tooltips']){var tooltip=RGraph.parseTooltipText?RGraph.parseTooltipText(prop['chart.tooltips'],i):prop['chart.tooltips'][i];}
-return{0:obj,1:left,2:top,3:width,4:height,5:i,'object':obj,'x':left,'y':top,'width':width,'height':height,'index':i,'tooltip':tooltip};}}
-return null;};this.getValue=function(arg)
-{var co=this.context;var ca=this.canvas;var prop=this.properties;if(arg.length==2){var mouseX=arg[0];var mouseY=arg[1];}else{var mouseCoords=RG.getMouseXY(arg);var mouseX=mouseCoords[0];var mouseY=mouseCoords[1];}
-if(mouseY<prop['chart.gutter.top']||mouseY>(ca.height-prop['chart.gutter.bottom'])||mouseX<prop['chart.gutter.left']||mouseX>(ca.width-prop['chart.gutter.right'])){return null;}
-if(prop['chart.xaxispos']=='center'){var value=(((this.grapharea/2)-(mouseY-prop['chart.gutter.top']))/this.grapharea)*(this.scale2.max-this.scale2.min)
-value*=2;if(value>=0){value+=this.scale2.min;}else{value-=this.scale2.min;}}else if(prop['chart.xaxispos']=='top'){var value=((this.grapharea-(mouseY-prop['chart.gutter.top']))/this.grapharea)*(this.scale2.max-this.scale2.min)
-value=this.scale2.max-value;value=ma.abs(value)* -1;}else{var value=((this.grapharea-(mouseY-prop['chart.gutter.top']))/this.grapharea)*(this.scale2.max-this.scale2.min)
-value+=this.scale2.min;}
-return value;};this.getYCoord=function(value)
-{if(value>this.scale2.max){return null;}
-var co=this.context,ca=this.canvas,prop=this.properties;var y,xaxispos=prop['chart.xaxispos'];if(xaxispos=='top'){if(value<0){value=ma.abs(value);}
-y=((value-this.scale2.min)/(this.scale2.max-this.scale2.min))*this.grapharea;y=y+this.gutterTop}else if(xaxispos=='center'){y=((value-this.scale2.min)/(this.scale2.max-this.scale2.min))*(this.grapharea/2);y=(this.grapharea/2)-y;y+=this.gutterTop;}else{if(value<this.scale2.min){value=this.scale2.min;}
-y=((value-this.scale2.min)/(this.scale2.max-this.scale2.min));y*=(ca.height-this.gutterTop-this.gutterBottom);y=ca.height-this.gutterBottom-y;}
-return y;};this.highlight=this.Highlight=function(shape)
-{if(typeof prop['chart.highlight.style']==='function'){(prop['chart.highlight.style'])(shape);}else{RG.Highlight.Rect(this,shape);}};this.getObjectByXY=function(e)
-{var mouseXY=RG.getMouseXY(e);if(prop['chart.variant']==='3d'){var adjustment=prop['chart.variant.threed.angle']*mouseXY[0];mouseXY[1]-=adjustment;}
-if(mouseXY[0]>=prop['chart.gutter.left']&&mouseXY[0]<=(ca.width-prop['chart.gutter.right'])&&mouseXY[1]>=prop['chart.gutter.top']&&mouseXY[1]<=(ca.height-prop['chart.gutter.bottom'])){return this;}};this.adjusting_mousemove=this.Adjusting_mousemove=function(e)
-{if(prop['chart.adjustable']&&RG.Registry.Get('chart.adjusting')&&RG.Registry.Get('chart.adjusting').uid==this.uid){var value=Number(this.getValue(e));var shape=RG.Registry.Get('chart.adjusting.shape')
-if(shape){RG.Registry.Set('chart.adjusting.shape',shape);if(this.stackedOrGrouped&&prop['chart.grouping']=='grouped'){var indexes=RG.sequentialIndexToGrouped(shape['index'],this.data);if(typeof this.data[indexes[0]]=='number'){this.data[indexes[0]]=Number(value);}else if(!RG.isNull(this.data[indexes[0]])){this.data[indexes[0]][indexes[1]]=Number(value);}}else if(typeof this.data[shape['index']]=='number'){this.data[shape['index']]=Number(value);}
-RG.redrawCanvas(e.target);RG.fireCustomEvent(this,'onadjust');}}};this.parseColors=function()
-{if(this.original_colors.length===0){this.original_colors['chart.colors']=RGraph.array_clone(prop['chart.colors']);this.original_colors['chart.key.colors']=RGraph.array_clone(prop['chart.key.colors']);this.original_colors['chart.crosshairs.color']=prop['chart.crosshairs.color'];this.original_colors['chart.highlight.stroke']=prop['chart.highlight.stroke'];this.original_colors['chart.highlight.fill']=prop['chart.highlight.fill'];this.original_colors['chart.text.color']=prop['chart.text.color'];this.original_colors['chart.background.barcolor1']=prop['chart.background.barcolor1'];this.original_colors['chart.background.barcolor2']=prop['chart.background.barcolor2'];this.original_colors['chart.background.grid.color']=prop['chart.background.grid.color'];this.original_colors['chart.background.color']=prop['chart.background.color'];this.original_colors['chart.strokecolor']=prop['chart.strokecolor'];this.original_colors['chart.axis.color']=prop['chart.axis.color'];}
-var colors=prop['chart.colors'];if(colors){for(var i=0;i<colors.length;++i){colors[i]=this.parseSingleColorForGradient(colors[i]);}}
-var colors=prop['chart.key.colors'];if(colors){for(var i=0;i<colors.length;++i){colors[i]=this.parseSingleColorForGradient(colors[i]);}}
-prop['chart.crosshairs.color']=this.parseSingleColorForGradient(prop['chart.crosshairs.color']);prop['chart.highlight.stroke']=this.parseSingleColorForGradient(prop['chart.highlight.stroke']);prop['chart.highlight.fill']=this.parseSingleColorForGradient(prop['chart.highlight.fill']);prop['chart.text.color']=this.parseSingleColorForGradient(prop['chart.text.color']);prop['chart.background.barcolor1']=this.parseSingleColorForGradient(prop['chart.background.barcolor1']);prop['chart.background.barcolor2']=this.parseSingleColorForGradient(prop['chart.background.barcolor2']);prop['chart.background.grid.color']=this.parseSingleColorForGradient(prop['chart.background.grid.color']);prop['chart.background.color']=this.parseSingleColorForGradient(prop['chart.background.color']);prop['chart.strokecolor']=this.parseSingleColorForGradient(prop['chart.strokecolor']);prop['chart.axis.color']=this.parseSingleColorForGradient(prop['chart.axis.color']);};this.reset=function()
-{};this.parseSingleColorForGradient=function(color)
-{if(!color||typeof(color)!='string'){return color;}
-if(color.match(/^gradient\((.*)\)$/i)){var parts=RegExp.$1.split(':');var grad=co.createLinearGradient(0,ca.height-prop['chart.gutter.bottom'],0,prop['chart.gutter.top']);var diff=1/(parts.length-1);grad.addColorStop(0,RG.trim(parts[0]));for(var j=1,len=parts.length;j<len;++j){grad.addColorStop(j*diff,RGraph.trim(parts[j]));}}
-return grad?grad:color;};this.drawBevel=this.DrawBevel=function()
-{var coords=this.coords;var coords2=this.coords2;var prop=this.properties;var co=this.context;var ca=this.canvas;if(prop['chart.grouping']=='stacked'){for(var i=0;i<coords2.length;++i){if(coords2[i]&&coords2[i][0]&&coords2[i][0][0]){var x=coords2[i][0][0];var y=coords2[i][0][1];var w=coords2[i][0][2];var arr=[];for(var j=0;j<coords2[i].length;++j){arr.push(coords2[i][j][3]);}
-var h=RGraph.array_sum(arr);co.save();co.strokeStyle='black';co.beginPath();co.rect(x,y,w,h);co.clip();co.shadowColor='black';co.shadowOffsetX=0;co.shadowOffsetY=0;co.shadowBlur=20;co.beginPath();co.rect(x-3,y-3,w+6,h+100);co.lineWidth=5;co.stroke();co.restore();}}}else{for(var i=0;i<coords.length;++i){if(coords[i]){var x=coords[i][0];var y=coords[i][1];var w=coords[i][2];var h=coords[i][3];var xaxispos=prop['chart.xaxispos'];var xaxis_ycoord=((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop;co.save();co.strokeStyle='black';co.beginPath();co.rect(x,y,w,h);co.clip();co.shadowColor='black';co.shadowOffsetX=0;co.shadowOffsetY=0;co.shadowBlur=20;if(xaxispos=='top'||(xaxispos=='center'&&(y+h)>xaxis_ycoord)){y=y-100;h=h+100;}else{y=y;h=h+100;}
-co.beginPath();co.rect(x-3,y-3,w+6,h+6);co.lineWidth=5;co.stroke();co.restore();}}}};this.interactiveKeyHighlight=function(index)
-{this.coords2.forEach(function(value,idx,arr)
-{if(typeof value[index]=='object'&&value[index]){var x=value[index][0]
-var y=value[index][1]
-var w=value[index][2]
-var h=value[index][3]
-co.fillStyle=prop['chart.key.interactive.highlight.chart.fill'];co.strokeStyle=prop['chart.key.interactive.highlight.chart.stroke'];co.lineWidth=2;co.strokeRect(x,y,w,h);co.fillRect(x,y,w,h);}});};this.on=function(type,func)
-{if(type.substr(0,2)!=='on'){type='on'+type;}
-if(typeof this[type]!=='function'){this[type]=func;}else{RG.addCustomEventListener(this,type,func);}
-return this;};this.drawAboveLabels=function()
-{var labels=prop['chart.labels.above'],specific=prop['chart.labels.above.specific'],color=prop['chart.labels.above.color'],background=prop['chart.labels.above.background'],decimals=prop['chart.labels.above.decimals'],size=prop['chart.labels.above.size'],angle=-1*prop['chart.labels.above.angle'],unitsPre=prop['chart.labels.above.units.pre'],unitsPost=prop['chart.labels.above.units.post'],coords=this.coords,coords2=this.coords2,data=this.data,ldata=RG.arrayLinearize(this.data),offset=prop['chart.labels.above.offset'],text_font=prop['chart.text.font'],text_size=prop['chart.text.size'],grouping=prop['chart.grouping']
-RG.noShadow(this);co.fillStyle=typeof color==='string'?color:prop['chart.text.color'];if(labels&&grouping==='grouped'){for(var i=0,len=data.length,sequentialIndex=0;i<len;i+=1){if(typeof data[i]==='number'&&data[i]>=0){var angle=angle;var halign=(angle?'left':'center');var valign=angle!==0?'center':'bottom';RG.text2(this,{'font':text_font,'size':typeof size==='number'?size:text_size-3,'x':coords2[i][0][0]+(coords2[i][0][2]/2),'y':coords2[i][0][1]-offset,'text':specific?(specific[sequentialIndex]||''):RG.numberFormat(this,Number(typeof data[i]==='object'?data[i][0]:data[i]).toFixed(decimals),unitsPre,unitsPost),'halign':halign,'valign':valign,'angle':angle,'marker':false,'bounding':true,'bounding.fill':background,'bounding.stroke':'rgba(0,0,0,0)','tag':'labels.above'});sequentialIndex++;}else if(typeof data[i]==='number'&&data[i]<0){var angle=angle;var halign=angle?'right':'center';var valign=angle!==0?'center':'top';RG.text2(this,{'font':text_font,'size':typeof size==='number'?size:text_size-3,'x':coords2[i][0][0]+(coords2[i][0][2]/2),'y':coords2[i][0][1]+coords2[i][0][3]+offset,'text':specific?(specific[sequentialIndex]||''):RG.numberFormat(this,Number(typeof data[i]==='object'?data[i][0]:data[i]).toFixed(decimals),unitsPre,unitsPost),'halign':halign,'valign':valign,'angle':angle,'bounding':true,'bounding.fill':background,'bounding.stroke':'rgba(0,0,0,0)','marker':false,'tag':'labels.above'});sequentialIndex++;}else if(typeof data[i]==='object'){for(var j=0,len2=data[i].length;j<len2;j+=1){var angle=angle;var halign=data[i][j]<0?'right':'left';halign=angle===0?'center':halign;var valign=data[i][j]<0?'top':'bottom';valign=angle!=0?'center':valign;RG.text2(this,{'font':text_font,'size':typeof size==='number'?size:text_size-3,'x':coords2[i][j][0]+(coords2[i][j][2]/2),'y':coords2[i][j][1]+(data[i][j]<0?coords2[i][j][3]+offset:-offset),'text':specific?(specific[sequentialIndex]||''):RG.numberFormat(this,Number(data[i][j]).toFixed(decimals),unitsPre,unitsPost),'halign':halign,'valign':valign,'angle':angle,'bounding':true,'bounding.fill':background,'bounding.stroke':'rgba(0,0,0,0)','marker':false,'tag':'labels.above'});sequentialIndex++;}}}}else if(labels&&grouping==='stacked'){for(var i=0,len=data.length,sequentialIndex=0;i<len;i+=1){if(typeof data[i]==='object'){var angle=angle;var halign=angle!=0?'left':'center';var valign=angle!=0?'center':'bottom';RG.text2(this,{'font':text_font,'size':typeof size==='number'?size:text_size-3,'x':coords2[i][0][0]+(coords2[i][0][2]/2),'y':coords2[i][0][1]+(data[i][0]<0?coords2[i][0][3]:0)-offset,'text':specific?(specific[sequentialIndex]||''):RG.numberFormat(this,Number(RG.arraySum(data[i])).toFixed(decimals),unitsPre,unitsPost),'halign':halign,'valign':valign,'angle':angle,'bounding':true,'bounding.fill':background,'bounding.stroke':'rgba(0,0,0,0)','marker':false,'tag':'labels.above'});sequentialIndex+=data[i].length;}else{var angle=angle;var halign=angle!=0?'left':'center';var valign=angle!=0?'center':'bottom';RG.text2(this,{'font':text_font,'size':typeof size==='number'?size:text_size-3,'x':coords2[i][0][0]+(coords2[i][0][2]/2),'y':coords2[i][0][1]+(data[i][0]<0?coords2[i][0][3]:0)-offset,'text':specific?(specific[sequentialIndex]||''):RG.numberFormat(this,Number(data[i]).toFixed(decimals),unitsPre,unitsPost),'halign':halign,'valign':valign,'angle':angle,'bounding':true,'bounding.fill':background,'bounding.stroke':'rgba(0,0,0,0)','marker':false,'tag':'labels.above'});sequentialIndex++;}}}};this.firstDrawFunc=function()
-{};this.wave=function()
-{var obj=this,opt=arguments[0]||{},labelsAbove=this.get('labelsAbove');opt.frames=opt.frames||60;opt.startFrames=[];opt.counters=[];var framesperbar=opt.frames/3,frame=-1,callback=arguments[1]||function(){},original=RG.arrayClone(this.original_data);this.set('labelsAbove',false);for(var i=0,len=obj.data.length;i<len;i+=1){opt.startFrames[i]=((opt.frames/2)/(obj.data.length-1))*i;if(typeof obj.data[i]==='object'&&obj.data[i]){opt.counters[i]=[];for(var j=0;j<obj.data[i].length;j++){opt.counters[i][j]=0;}}else{opt.counters[i]=0;}}
-obj.draw();obj.Set('ymax',obj.scale2.max);RG.clear(obj.canvas);function iterator()
-{++frame;for(var i=0,len=obj.data.length;i<len;i+=1){if(frame>opt.startFrames[i]){if(typeof obj.data[i]==='number'){obj.data[i]=ma.min(ma.abs(original[i]),ma.abs(original[i]*((opt.counters[i]++)/framesperbar)));if(original[i]<0){obj.data[i]*=-1;}}else if(!RG.isNull(obj.data[i])){for(var j=0,len2=obj.data[i].length;j<len2;j+=1){obj.data[i][j]=ma.min(ma.abs(original[i][j]),ma.abs(original[i][j]*((opt.counters[i][j]++)/framesperbar)));if(original[i][j]<0){obj.data[i][j]*=-1;}}}}else{obj.data[i]=typeof obj.data[i]==='object'&&obj.data[i]?RG.arrayPad([],obj.data[i].length,0):(RG.isNull(obj.data[i])?null:0);}}
-if(frame>=opt.frames){if(labelsAbove){obj.set('labelsAbove',true);RG.redraw();}
-callback(obj);}else{RG.redrawCanvas(obj.canvas);RG.Effects.updateCanvas(iterator);}}
-iterator();return this;};this.colorWave=function()
-{var obj=this,opt=arguments[0]||{};opt.frames=opt.frames||60;opt.startFrames=[];opt.counters=[],colors=obj.properties['chart.colors'];if(colors.length<=obj.data.length){obj.set('chart.colors.sequential',true);colors=RG.arrayPad(colors,obj.data.length,colors[colors.length-1]);}
-var framesperbar=opt.frames/2,frame=-1,callback=arguments[1]||function(){},originalColors=RG.arrayClone(obj.properties['chart.colors']);for(var i=0,len=originalColors.length;i<len;i+=1){opt.startFrames[i]=((opt.frames/2)/(originalColors.length-1))*i;opt.counters[i]=0;}
-function iterator()
-{++frame;for(var i=0,len=colors.length;i<len;i+=1){if(frame>opt.startFrames[i]&&colors[i].match(/^rgba?\(([0-9 ]+),([0-9 ]+),([0-9 ]+)(,([ 0-9.]+)?)\)/)){colors[i]='rgba({1},{2},{3},{4})'.format(RegExp.$1,RegExp.$2,RegExp.$3,(frame-opt.startFrames[i])/framesperbar);}else{colors[i]=colors[i].replace(/,[0-9. ]+\)/,',0)');}}
-if(frame>=opt.frames){callback(obj);}else{RG.redrawCanvas(obj.canvas);RG.Effects.updateCanvas(iterator);}}
-iterator();return this;};this.grow=function()
-{var opt=arguments[0]||{},frames=opt.frames||30,frame=0,callback=arguments[1]||function(){},obj=this,labelsAbove=this.get('labelsAbove')
-if(RG.isArray(opt.data)){var ymax=0;for(var i=0;i<opt.data.length;++i){if(typeof opt.data[i]==='object'){for(var j=0;j<opt.data[i].length;++j){if(typeof opt.data[i][j]==='string'&&opt.data[i][j].match(/(\+|\-)([0-9]+)/)){if(RegExp.$1==='+'){opt.data[i][j]=this.original_data[i][j]+parseInt(RegExp.$2);}else{opt.data[i][j]=this.original_data[i][j]-parseInt(RegExp.$2);}}
-ymax=ma.max(ymax,opt.data[i][j]);}}else if(typeof opt.data[i]==='string'&&opt.data[i].match(/(\+|\-)([0-9]+)/)){if(RegExp.$1==='+'){opt.data[i]=this.original_data[i]+parseInt(RegExp.$2);}else{opt.data[i]=this.original_data[i]-parseInt(RegExp.$2);}
-ymax=ma.max(ymax,opt.data[i]);}else{ymax=ma.max(ymax,opt.data[i]);}}
-var scale=RG.getScale2(this,{'max':ymax});this.Set('chart.ymax',scale.max);}
-this.set('labelsAbove',false);if(prop['chart.ymax']==null){var ymax=0;for(var i=0;i<obj.data.length;++i){if(RG.isArray(this.data[i])&&prop['chart.grouping']==='stacked'){ymax=ma.max(ymax,ma.abs(RG.arraySum(this.data[i])));}else if(RG.isArray(this.data[i])&&prop['chart.grouping']==='grouped'){for(var j=0,group=[];j<this.data[i].length;j++){group.push(ma.abs(this.data[i][j]));}
-ymax=ma.max(ymax,ma.abs(RG.arrayMax(group)));}else{ymax=ma.max(ymax,ma.abs(this.data[i]));}}
-var scale=RG.getScale2(this,{'max':ymax});this.Set('chart.ymax',scale.max);}
-if(typeof opt.ymax==='number'){obj.set('ymax',opt.ymax);}
-var iterator=function()
-{var easingMultiplier=RG.Effects.getEasingMultiplier(frames,frame);for(var j=0,len=obj.original_data.length;j<len;++j){if(typeof obj.data[j]==='object'&&!RG.isNull(obj.data[j])){for(var k=0,len2=obj.data[j].length;k<len2;++k){if(obj.firstDraw||!opt.data){obj.data[j][k]=easingMultiplier*obj.original_data[j][k];}else if(opt.data&&opt.data.length===obj.original_data.length){var diff=opt.data[j][k]-obj.original_data[j][k];obj.data[j][k]=(easingMultiplier*diff)+obj.original_data[j][k];}}}else{if(obj.firstDraw||!opt.data){obj.data[j]=easingMultiplier*obj.original_data[j];}else if(opt.data&&opt.data.length===obj.original_data.length){var diff=opt.data[j]-obj.original_data[j];obj.data[j]=(easingMultiplier*diff)+obj.original_data[j];}}}
-RG.redrawCanvas(obj.canvas);if(frame<frames){frame+=1;RG.Effects.updateCanvas(iterator);}else{if(RG.isArray(opt.data)){var linear_data=RG.arrayLinearize(data);for(var i=0;i<linear_data.length;++i){if(!obj['$'+i]){obj['$'+i]={};}}}
-obj.data=data;obj.original_data=RG.arrayClone(data);if(labelsAbove){obj.set('labelsAbove',true);RG.redraw();}
-callback(obj);}};iterator();return this;};this.drawErrorbars=function()
-{var coords=this.coords,color=prop['chart.errorbars.color']||'black',default_halfwidth=ma.min(prop['chart.errorbars.capped.width'],coords[0][2])/2,x=0,errorbars=prop['chart.errorbars'],length=0;if(!prop['chart.errorbars.capped']){prop['chart.errorbars.capped.width']=0;halfwidth=0;}
-co.lineWidth=prop['chart.errorbars.linewidth'];for(var i=0;i<coords.length;++i){color=prop['chart.errorbars.color']||'black';if(errorbars[i]&&typeof errorbars[i][3]==='number'){co.lineWidth=errorbars[i][3];}
-var halfwidth=(errorbars[i]&&typeof errorbars[i][4]==='number')?errorbars[i][4]/2:default_halfwidth;if(!prop['chart.errorbars.capped']){halfwidth=0;}
-if(typeof errorbars[i]==='number'){length=ma.abs(this.getYCoord(errorbars[i])-this.getYCoord(0));if(length){pa2(co,'b m % % l % % l % % l % % s %',coords[i][0]+(coords[i][2]/2),coords[i][1],coords[i][0]+(coords[i][2]/2),coords[i][1]-length,coords[i][0]+(coords[i][2]/2)-halfwidth,ma.round(coords[i][1]-length),coords[i][0]+(coords[i][2]/2)+halfwidth,ma.round(coords[i][1]-length),color);}}else if(typeof errorbars[i]==='object'&&!RG.isNull(errorbars[i])){var positiveLength=ma.abs(this.getYCoord(errorbars[i][0])-this.getYCoord(0));if(typeof errorbars[i][1]==='string'){color=errorbars[i][1];}else if(typeof errorbars[i][2]==='string'){color=errorbars[i][2];}
-halfwidth=typeof errorbars[i][4]==='number'?errorbars[i][4]/2:default_halfwidth;if(!prop['chart.errorbars.capped']){halfwidth=0;}
-if(!RG.isNull(errorbars[i][0])){pa2(co,'b m % % l % % l % % l % % s %',coords[i][0]+(coords[i][2]/2),coords[i][1],coords[i][0]+(coords[i][2]/2),coords[i][1]-positiveLength,coords[i][0]+(coords[i][2]/2)-halfwidth,ma.round(coords[i][1]-positiveLength),coords[i][0]+(coords[i][2]/2)+halfwidth,ma.round(coords[i][1]-positiveLength),color);}
-if(typeof errorbars[i][1]==='number'){var negativeLength=ma.abs(this.getYCoord(errorbars[i][1])-this.getYCoord(0));pa2(co,'b m % % l % % l % % l % % s %',coords[i][0]+(coords[i][2]/2),coords[i][1],coords[i][0]+(coords[i][2]/2),coords[i][1]+negativeLength,coords[i][0]+(coords[i][2]/2)-halfwidth,ma.round(coords[i][1]+negativeLength),coords[i][0]+(coords[i][2]/2)+halfwidth,ma.round(coords[i][1]+negativeLength),color);}}
-if(errorbars[i]&&typeof errorbars[i][3]==='number'){co.lineWidth=prop['chart.errorbars.linewidth'];}}};this.isAdjustable=function(shape)
-{if(RG.isNull(prop['chart.adjustable.only'])||!RG.isArray(prop['chart.adjustable.only'])){return true;}
-if(RG.isArray(prop['chart.adjustable.only'])&&prop['chart.adjustable.only'][shape.index]){return true;}
-return false;};RG.register(this);if(parseConfObjectForOptions){RG.parseObjectStyleConfig(this,conf.options);}};RGraph.CombinedChart=function()
-{this.objects=[];var objects=[];if(RGraph.isArray(arguments[0])){objects=arguments[0];}else{for(var i=0;i<arguments.length;i+=1){objects[i]=arguments[i];}}
-for(var i=0;i<objects.length;++i){this.objects[i]=objects[i];this.objects[i].set({gutterLeft:this.objects[0].get('gutter.left'),gutterRight:this.objects[0].get('gutter.right'),gutterTop:this.objects[0].get('gutter.top'),gutterBottom:this.objects[0].get('gutter.bottom')});if(this.objects[i].type=='line'){var obj=this.objects[i];obj.set('hmargin',((this.objects[0].canvas.width-this.objects[0].Get('chart.gutter.right')-this.objects[0].Get('chart.gutter.left'))/this.objects[0].data.length)/2);obj.set('noaxes',true);obj.set('backgroundGrid',false);obj.set('ylabels',false);}
-if(this.objects[i].get('chart.resizable')){var resizable_object=obj;}}
-if(resizable_object){function myOnresizebeforedraw(obj)
-{var gutterLeft=obj.get('gutterLeft');var gutterRight=obj.get('gutterRight');obj.set('hmargin',(obj.canvas.width-gutterLeft-gutterRight)/(obj.original_data[0].length*2));}
-RGraph.AddCustomEventListener(resizable_object,'onresizebeforedraw',myOnresizebeforedraw);}};RGraph.CombinedChart.prototype.add=RGraph.CombinedChart.prototype.Add=function(obj)
-{this.objects.push(obj);};RGraph.CombinedChart.prototype.draw=RGraph.CombinedChart.prototype.Draw=function()
-{for(var i=0;i<this.objects.length;++i){if(this.objects[i].properties['chart.combinedchart.effect']){var options=this.objects[i].properties['chart.combinedchart.effect.options']?eval('('+this.objects[i].properties['chart.combinedchart.effect.options']+')'):null;(this.objects[i][this.objects[i].properties['chart.combinedchart.effect']])
-(options,this.objects[i].properties['chart.combinedchart.effect.callback'])}else{this.objects[i].draw();}}};
+    RGraph = window.RGraph || {isRGraph: true};
+
+
+
+
+    /**
+    * The bar chart constructor
+    *
+    * @param object canvas The canvas object
+    * @param array  data   The chart data
+    */
+    RGraph.Bar = function (conf)
+    {
+        /**
+        * Allow for object config style
+        */
+        if (typeof conf === 'object' && typeof conf.data === 'object'&& typeof conf.id === 'string') {
+            var id                        = conf.id,
+                canvas                    = document.getElementById(id),
+                data                      = conf.data,
+                parseConfObjectForOptions = true // Set this so the config is parsed (at the end of the constructor)
+        } else {
+            var id     = conf,
+                canvas = document.getElementById(id),
+                data   = arguments[1]
+        }
+
+
+
+
+        // Get the canvas and context objects
+        this.id                     = id;
+        this.canvas                 = canvas;
+        this.context                = this.canvas.getContext('2d');
+        this.canvas.__object__      = this;
+        this.type                   = 'bar';
+        this.max                    = 0;
+        this.stackedOrGrouped       = false;
+        this.isRGraph               = true;
+        this.uid                    = RGraph.CreateUID();
+        this.canvas.uid             = this.canvas.uid ? this.canvas.uid : RGraph.CreateUID();
+        this.colorsParsed           = false;
+        this.original_colors        = [];
+        this.cachedBackgroundCanvas = null;
+        this.firstDraw              = true; // After the first draw this will be false
+
+
+        /**
+        * Compatibility with older browsers
+        */
+        //RGraph.OldBrowserCompat(this.context);
+
+
+        // Various config type stuff
+        this.properties =
+        {
+            'chart.background.barcolor1':   'rgba(0,0,0,0)',
+            'chart.background.barcolor2':   'rgba(0,0,0,0)',
+            'chart.background.grid':        true,
+            'chart.background.grid.color':  '#ddd',
+            'chart.background.grid.width':  1,
+            'chart.background.grid.hsize':  20,
+            'chart.background.grid.vsize':  20,
+            'chart.background.grid.vlines': true,
+            'chart.background.grid.hlines': true,
+            'chart.background.grid.border': true,
+            'chart.background.grid.autofit':true,
+            'chart.background.grid.autofit.align': true,
+            'chart.background.grid.autofit.numhlines': 5,
+            'chart.background.grid.autofit.numvlines': 20,
+            'chart.background.grid.dashed': false,
+            'chart.background.grid.dotted': false,
+            'chart.background.image.stretch': true,
+            'chart.background.image.x':     null,
+            'chart.background.image.y':     null,
+            'chart.background.image.w':     null,
+            'chart.background.image.h':     null,
+            'chart.background.image.align': null,
+            'chart.background.color':       null,
+            'chart.background.hbars':       null,
+            'chart.numyticks':              10,
+            'chart.hmargin':                5,
+            'chart.hmargin.grouped':        1,
+            'chart.strokecolor':            'rgba(0,0,0,0)',
+            'chart.axis.color':             'black',
+            'chart.axis.linewidth':         1,
+            'chart.gutter.top':             25,
+            'chart.gutter.bottom':          30,
+            'chart.gutter.left':            25,
+            'chart.gutter.right':           25,
+            'chart.labels':                 null,
+            'chart.labels.bold':            false,
+            'chart.labels.color':           null,
+            'chart.labels.ingraph':         null,
+            'chart.labels.above':           false,
+            'chart.labels.above.decimals':  0,
+            'chart.labels.above.size':      null,
+            'chart.labels.above.color':     null,
+            'chart.labels.above.background':'rgba(0,0,0,0)',
+            'chart.labels.above.angle':     null,
+            'chart.labels.above.offset':    4,
+            'chart.labels.above.units.pre': '',
+            'chart.labels.above.units.post':'',
+            'chart.ylabels':                true,
+            'chart.ylabels.count':          5,
+            'chart.ylabels.inside':         false,
+            'chart.ylabels.offsetx':        0,
+            'chart.ylabels.offsety':        0,
+            'chart.labels.offsetx':         0,
+            'chart.labels.offsety':         0,
+            'chart.xaxispos':               'bottom',
+            'chart.yaxispos':               'left',
+            'chart.text.angle':             0,
+            'chart.text.color':             'black', // Gradients aren't supported for this color
+            'chart.text.size':              12,
+            'chart.text.font':              'Segoe UI, Arial, Verdana, sans-serif',
+            'chart.text.accessible':              true,
+            'chart.text.accessible.overflow':     'visible',
+            'chart.text.accessible.pointerevents': true,
+            'chart.ymin':                   0,
+            'chart.ymax':                   null,
+            'chart.title':                  '',
+            'chart.title.font':             null,
+            'chart.title.background':       null, // Gradients aren't supported for this color
+            'chart.title.hpos':             null,
+            'chart.title.vpos':             null,
+            'chart.title.bold':             true,
+            'chart.title.xaxis':            '',
+            'chart.title.xaxis.bold':       true,
+            'chart.title.xaxis.size':       null,
+            'chart.title.xaxis.font':       null,
+            'chart.title.xaxis.color':      null,
+            'chart.title.yaxis':            '',
+            'chart.title.yaxis.bold':       true,
+            'chart.title.yaxis.size':       null,
+            'chart.title.yaxis.font':       null,
+            'chart.title.yaxis.color':      null, // Gradients aren't supported for this color
+            'chart.title.xaxis.pos':        null,
+            'chart.title.yaxis.pos':        null,
+            'chart.title.yaxis.x':          null,
+            'chart.title.yaxis.y':          null,
+            'chart.title.xaxis.x':          null,
+            'chart.title.xaxis.y':          null,
+            'chart.title.x':                null,
+            'chart.title.y':                null,
+            'chart.title.halign':           null,
+            'chart.title.valign':           null,
+            'chart.colors':                 ['red','#0f0','blue','pink','orange','cyan','black','white','green','magenta'],
+            'chart.colors.sequential':      false,
+            'chart.colors.reverse':         false,
+            'chart.grouping':               'grouped',
+            'chart.variant':                'bar',
+            'chart.variant.sketch.verticals': true,
+            'chart.variant.threed.xaxis':   true,
+            'chart.variant.threed.yaxis':   true,
+            'chart.variant.threed.angle':   0.1,
+            'chart.variant.threed.offsetx': 10,
+            'chart.variant.threed.offsety': 5,
+            'chart.shadow':                 false,
+            'chart.shadow.color':           '#aaa',  // Gradients aren't supported for this color
+            'chart.shadow.offsetx':         0,
+            'chart.shadow.offsety':         0,
+            'chart.shadow.blur':            15,
+            'chart.tooltips':               null,
+            'chart.tooltips.effect':        'fade',
+            'chart.tooltips.css.class':     'RGraph_tooltip',
+            'chart.tooltips.event':         'onclick',
+            'chart.tooltips.highlight':     true,
+            'chart.tooltips.hotspot.xonly': false,
+            'chart.highlight.stroke':       'rgba(0,0,0,0)',
+            'chart.highlight.fill':         'rgba(255,255,255,0.7)',
+            'chart.key':                    null,
+            'chart.key.background':         'white',
+            'chart.key.position':           'graph',
+            'chart.key.shadow':             false,
+            'chart.key.shadow.color':       '#666',
+            'chart.key.shadow.blur':        3,
+            'chart.key.shadow.offsetx':     2,
+            'chart.key.shadow.offsety':     2,
+            'chart.key.position.gutter.boxed':false,
+            'chart.key.position.x':         null,
+            'chart.key.position.y':         null,
+            'chart.key.interactive':        false,
+            'chart.key.interactive.highlight.chart.stroke':'black',
+            'chart.key.interactive.highlight.chart.fill':'rgba(255,255,255,0.7)',
+            'chart.key.interactive.highlight.label':'rgba(255,0,0,0.2)',
+            'chart.key.halign':             'right',
+            'chart.key.color.shape':        'square',
+            'chart.key.rounded':            true,
+            'chart.key.text.size':          10,
+            'chart.key.linewidth':          1,
+            'chart.key.colors':             null,
+            'chart.key.text.color':         'black',
+            'chart.contextmenu':            null,
+            'chart.units.pre':              '',
+            'chart.units.post':             '',
+            'chart.scale.decimals':         0,
+            'chart.scale.point':            '.',
+            'chart.scale.thousand':         ',',
+            'chart.scale.round':            false,
+            'chart.scale.zerostart':        true,
+            'chart.crosshairs':             false,
+            'chart.crosshairs.color':       '#333',
+            'chart.crosshairs.hline':       true,
+            'chart.crosshairs.vline':       true,
+            'chart.linewidth':              1,
+            'chart.annotatable':            false,
+            'chart.annotate.color':         'black',
+            'chart.zoom.factor':            1.5,
+            'chart.zoom.fade.in':           true,
+            'chart.zoom.fade.out':          true,
+            'chart.zoom.hdir':              'right',
+            'chart.zoom.vdir':              'down',
+            'chart.zoom.frames':            25,
+            'chart.zoom.delay':             16.666,
+            'chart.zoom.shadow':            true,
+            'chart.zoom.background':        true,
+            'chart.resizable':              false,
+            'chart.resize.handle.background': null,
+            'chart.adjustable':             false,
+            'chart.adjustable.only':        null,
+            'chart.noaxes':                 false,
+            'chart.noxaxis':                false,
+            'chart.noyaxis':                false,
+            'chart.events.click':           null,
+            'chart.events.mousemove':       null,
+            'chart.numxticks':              null,
+            'chart.bevel':                  false,
+            'chart.errorbars':              false,
+            'chart.errorbars.color':        'black',
+            'chart.errorbars.capped':        true,
+            'chart.errorbars.capped.width':  14,
+            'chart.errorbars.linewidth':     1,
+            'chart.combinedchart.effect':    null,
+            'chart.combinedchart.effect.options':  null,
+            'chart.combinedchart.effect.callback': null,
+            'chart.clearto':   'rgba(0,0,0,0)'
+        }
+
+        // Check for support
+        if (!this.canvas) {
+            alert('[BAR] No canvas support');
+            return;
+        }
+
+
+        //
+        // Convert strings into numbers. Also converts undefined elements to null
+        //
+        for (var i=0; i<data.length; ++i) {
+            if (typeof data[i] === 'string') {
+                data[i] = parseFloat(data[i]);
+            } else if (typeof data[i] === 'object' && data[i]) {
+                for (var j=0; j<data[i].length; ++j) {
+                    if (typeof data[i][j] === 'string') {
+                        data[i][j] = parseFloat(data[i][j]);
+                    }
+                }
+            } else if (typeof data[i] === 'undefined') {
+                data[i] = null;
+            }
+        }
+
+        /**
+        * Determine whether the chart will contain stacked or grouped bars
+        */
+        for (var i=0; i<data.length; ++i) {
+            if (typeof data[i] === 'object' && !RGraph.is_null(data[i])) {
+                this.stackedOrGrouped = true;
+            }
+        }
+
+
+        /**
+        * Create the dollar objects so that functions can be added to them
+        */
+        var linear_data = RGraph.arrayLinearize(data);
+
+        for (var i=0; i<linear_data.length; ++i) {
+            this['$' + i] = {};
+        }
+
+
+        // Store the data and set the orignal_data to it
+        this.data = data;
+        this.original_data = RGraph.arrayClone(data);
+
+
+        // Used to store the coords of the bars
+        this.coords     = [];
+        this.coords2    = [];
+        this.coordsText = [];
+
+
+
+        /**
+        * This linearises the data. Doing so can make it easier to pull
+        * out the appropriate data from tooltips
+        */
+        this.data_arr = RGraph.arrayLinearize(this.data);
+
+
+        /**
+        * Translate half a pixel for antialiasing purposes - but only if it hasn't beeen
+        * done already
+        */
+        if (!this.canvas.__rgraph_aa_translated__) {
+            this.context.translate(0.5,0.5);
+
+            this.canvas.__rgraph_aa_translated__ = true;
+        }
+
+
+
+
+
+        // Short variable names
+        var RG   = RGraph,
+            ca   = this.canvas,
+            co   = ca.getContext('2d'),
+            prop = this.properties,
+            pa2  = RG.path2,
+            win  = window,
+            doc  = document,
+            ma   = Math
+
+
+
+        /**
+        * "Decorate" the object with the generic effects if the effects library has been included
+        */
+        if (RG.Effects && typeof RG.Effects.decorate === 'function') {
+            RG.Effects.decorate(this);
+        }
+
+
+
+
+
+        /**
+        * A setter
+        *
+        * @param name  string The name of the property to set
+        * @param value mixed  The value of the property
+        */
+        this.set =
+        this.Set = function (name)
+        {
+            var value = typeof arguments[1] === 'undefined' ? null : arguments[1];
+
+            /**
+            * the number of arguments is only one and it's an
+            * object - parse it for configuration data and return.
+            */
+            if (arguments.length === 1 && typeof arguments[0] === 'object') {
+                RG.parseObjectStyleConfig(this, arguments[0]);
+                return this;
+            }
+
+
+
+
+
+
+
+
+            /**
+            * This should be done first - prepend the propertyy name with "chart." if necessary
+            */
+            if (name.substr(0,6) != 'chart.') {
+                name = 'chart.' + name;
+            }
+
+
+
+
+            // Convert uppercase letters to dot+lower case letter
+            while(name.match(/([A-Z])/)) {
+                name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
+            }
+
+
+            // BC accommodation
+            if (name === 'chart.xlabels.offset') {
+                name = 'chart.labels.offsety';
+            }
+
+            if (name == 'chart.labels.abovebar') {
+                name = 'chart.labels.above';
+            }
+
+            if (name == 'chart.strokestyle') {
+                name = 'chart.strokecolor';
+            }
+
+            /**
+            * Check for xaxispos
+            */
+            if (name == 'chart.xaxispos' ) {
+                if (value != 'bottom' && value != 'center' && value != 'top') {
+                    alert('[BAR] (' + this.id + ') chart.xaxispos should be top, center or bottom. Tried to set it to: ' + value + ' Changing it to center');
+                    value = 'center';
+                }
+
+                if (value == 'top') {
+                    for (var i=0; i<this.data.length; ++i) {
+                        if (typeof(this.data[i]) == 'number' && this.data[i] > 0) {
+                            alert('[BAR] The data element with index ' + i + ' should be negative');
+                        }
+                    }
+                }
+            }
+
+            /**
+            * lineWidth doesn't appear to like a zero setting
+            */
+            if (name.toLowerCase() == 'chart.linewidth' && value == 0) {
+                value = 0.0001;
+            }
+
+
+
+
+
+
+            prop[name] = value;
+
+            return this;
+        };
+
+
+
+
+        /**
+        * A getter
+        *
+        * @param name  string The name of the property to get
+        */
+        this.get =
+        this.Get = function (name)
+        {
+            /**
+            * This should be done first - prepend the property name with "chart." if necessary
+            */
+            if (name.substr(0,6) != 'chart.') {
+                name = 'chart.' + name;
+            }
+
+            // Convert uppercase letters to dot+lower case letter
+            while(name.match(/([A-Z])/)) {
+                name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
+            }
+
+            return prop[name];
+        };
+
+
+
+
+        /**
+        * The function you call to draw the bar chart
+        */
+        this.draw =
+        this.Draw = function ()
+        {
+            // MUST be the first thing done!
+            if (typeof(prop['chart.background.image']) == 'string') {
+                RG.DrawBackgroundImage(this);
+            }
+
+            /**
+            * Fire the onbeforedraw event
+            */
+            RG.FireCustomEvent(this, 'onbeforedraw');
+
+
+
+            //
+            // If the chart is 3d then angle it it
+            //
+            if (prop['chart.variant'] === '3d') {
+                if (prop['chart.text.accessible']) {
+                    // Nada
+                } else {
+                    co.setTransform(1,prop['chart.variant.threed.angle'],0,1,0.5,0.5);
+                }
+            }
+
+
+
+            /**
+            * Parse the colors. This allows for simple gradient syntax
+            */
+            if (!this.colorsParsed) {
+                this.parseColors();
+
+                // Don't want to do this again
+                this.colorsParsed = true;
+            }
+
+
+
+            /**
+            * This is new in May 2011 and facilitates indiviual gutter settings,
+            * eg chart.gutter.left
+            */
+            this.gutterLeft   = prop['chart.gutter.left'];
+            this.gutterRight  = prop['chart.gutter.right'];
+            this.gutterTop    = prop['chart.gutter.top'];
+            this.gutterBottom = prop['chart.gutter.bottom'];
+
+            // Cache this in a class variable as it's used rather a lot
+
+            /**
+            * Check for tooltips and alert the user that they're not supported
+            * with pyramid charts
+            */
+            if (   (prop['chart.variant'] == 'pyramid' || prop['chart.variant'] == 'dot')
+                && typeof(prop['chart.tooltips']) == 'object'
+                && prop['chart.tooltips']
+                && prop['chart.tooltips'].length > 0) {
+
+                alert('[BAR] (' + this.id + ') Sorry, tooltips are not supported with dot or pyramid charts');
+            }
+
+            /**
+            * Stop the coords arrays from growing uncontrollably
+            */
+            this.coords     = [];
+            this.coords2    = [];
+            this.coordsText = [];
+
+            /**
+            * Work out a few things. They need to be here because they depend on things you can change before you
+            * call Draw() but after you instantiate the object
+            */
+            this.max            = 0;
+            this.grapharea      = ca.height - this.gutterTop - this.gutterBottom;
+            this.halfgrapharea  = this.grapharea / 2;
+            this.halfTextHeight = prop['chart.text.size'] / 2;
+
+
+
+
+
+            // Now draw the background on to the main canvas
+            RG.background.Draw(this);
+
+
+
+
+            //If it's a sketch chart variant, draw the axes first
+            //if (prop['chart.variant'] == 'sketch') {
+            //    this.DrawAxes();
+            //    this.Drawbars();
+            //} else {
+                this.drawbars();
+                this.drawAxes();
+            //}
+
+            this.DrawLabels();
+
+
+            /**
+            * Draw the bevel if required
+            */
+            if (prop['chart.bevel'] || prop['chart.bevelled']) {
+                this.DrawBevel();
+            }
+
+
+            // Draw the key if necessary
+            if (prop['chart.key'] && prop['chart.key'].length) {
+                RG.DrawKey(this, prop['chart.key'], prop['chart.colors']);
+            }
+
+
+            /**
+            * Setup the context menu if required
+            */
+            if (prop['chart.contextmenu']) {
+                RG.ShowContext(this);
+            }
+
+
+
+
+            /**
+            * Draw errorbars
+            */
+            if (prop['chart.errorbars']) {
+                this.drawErrorbars();
+            }
+
+
+
+
+            /**
+            * Draw "in graph" labels
+            */
+            if (prop['chart.labels.ingraph']) {
+                RG.DrawInGraphLabels(this);
+            }
+
+
+            /**
+            * This function enables resizing
+            */
+            if (prop['chart.resizable']) {
+                RG.AllowResizing(this);
+            }
+
+
+            /**
+            * This installs the event listeners
+            */
+            RG.InstallEventListeners(this);
+
+
+            /**
+            * Fire the onfirstdraw event
+            */
+            if (this.firstDraw) {
+                RG.fireCustomEvent(this, 'onfirstdraw');
+                this.firstDraw = false;
+                this.firstDrawFunc();
+            }
+
+
+            /**
+            * Fire the RGraph ondraw event
+            */
+            RG.fireCustomEvent(this, 'ondraw');
+
+            return this;
+        };
+
+
+
+        /**
+        * Used in chaining. Runs a function there and then - not waiting for
+        * the events to fire (eg the onbeforedraw event)
+        *
+        * @param function func The function to execute
+        */
+        this.exec = function (func)
+        {
+            func(this);
+
+            return this;
+        };
+
+
+
+
+        /**
+        * Draws the charts axes
+        */
+        this.drawAxes =
+        this.DrawAxes = function ()
+        {
+            if (prop['chart.noaxes']) {
+                return;
+            }
+
+            var xaxispos = prop['chart.xaxispos'];
+            var yaxispos = prop['chart.yaxispos'];
+            var isSketch = prop['chart.variant'] == 'sketch';
+
+            co.beginPath();
+            co.strokeStyle = prop['chart.axis.color'];
+            co.lineWidth   = prop['chart.axis.linewidth'] + 0.001;
+
+
+            if (RG.ISSAFARI == -1) {
+                co.lineCap = 'square';
+            }
+
+
+            // Draw the Y axis
+            if (prop['chart.noyaxis'] == false) {
+                if (yaxispos == 'right') {
+                    co.moveTo(ca.width - this.gutterRight + (isSketch ? 3 : 0), this.gutterTop - (isSketch ? 3 : 0));
+                    co.lineTo(ca.width - this.gutterRight - (isSketch ? 2 : 0), ca.height - this.gutterBottom + (isSketch ? 5 : 0));
+                } else {
+                    co.moveTo(this.gutterLeft - (isSketch ? 2 : 0), this.gutterTop - (isSketch ? 5 : 0));
+                    co.lineTo(this.gutterLeft - (isSketch ? 1 : 0), ca.height - this.gutterBottom + (isSketch ? 5 : 0));
+                }
+            }
+
+            // Draw the X axis
+            if (prop['chart.noxaxis'] == false) {
+                if (xaxispos == 'center') {
+                    co.moveTo(this.gutterLeft - (isSketch ? 5 : 0), Math.round(((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop + (isSketch ? 2 : 0)));
+                    co.lineTo(ca.width - this.gutterRight + (isSketch ? 5 : 0), Math.round(((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop - (isSketch ? 2 : 0)));
+                } else if (xaxispos == 'top') {
+                    co.moveTo(this.gutterLeft - (isSketch ? 3 : 0), this.gutterTop - (isSketch ? 3 : 0));
+                    co.lineTo(ca.width - this.gutterRight + (isSketch ? 5 : 0), this.gutterTop + (isSketch ? 2 : 0));
+                } else {
+                    co.moveTo(
+                        this.gutterLeft - (isSketch ? 5 : 0),
+                        ma.round(this.getYCoord(0) - (isSketch ? 2 : 0))
+                    );
+                    co.lineTo(
+                        ca.width - this.gutterRight + (isSketch ? 8 : 0),
+                        ma.round(this.getYCoord(0) + (isSketch ? 2 : 0))
+                    );
+
+                }
+            }
+
+            var numYTicks = prop['chart.numyticks'];
+
+            //
+            // DRAW THE Y TICKMARKS
+            //
+            if (prop['chart.noyaxis'] == false && !isSketch) {
+
+                var yTickGap = (ca.height - this.gutterTop - this.gutterBottom) / numYTicks;
+                var xpos     = yaxispos == 'left' ? this.gutterLeft : ca.width - this.gutterRight;
+
+                if (this.properties['chart.numyticks'] > 0) {
+                    for (y=this.gutterTop;
+                         xaxispos == 'center' ? y <= (ca.height - this.gutterBottom) : y < (ca.height - this.gutterBottom + (xaxispos == 'top' ? 1 : 0));
+                         y += yTickGap) {
+
+                        if (xaxispos == 'center' && y == (this.gutterTop + (this.grapharea / 2))) {
+                            continue;
+                        }
+
+                        // X axis at the top
+                        if (xaxispos == 'top' && y == this.gutterTop) {
+                            continue;
+                        }
+
+                        co.moveTo(xpos + (yaxispos == 'left' ? 0 : 0), ma.round(y));
+                        co.lineTo(xpos + (yaxispos == 'left' ? -3 : 3), ma.round(y));
+                    }
+
+                    //
+                    // If the X axis is offset (ie not at the bottom when xaxispos
+                    // is set to bottom) - draw an extra tick
+                    //
+                    if (xaxispos === 'bottom' && prop['chart.ymin'] !== 0) {
+                        co.moveTo(xpos + (yaxispos == 'left' ? 0 : 0), ma.round(ca.height - prop['chart.gutter.bottom']));
+                        co.lineTo(xpos + (yaxispos == 'left' ? -3 : 3), ma.round(ca.height - prop['chart.gutter.bottom']));
+                    }
+                }
+
+                /**
+                * If the X axis is not being shown, draw an extra tick
+                */
+                if (prop['chart.noxaxis']) {
+                    if (xaxispos == 'center') {
+                        co.moveTo(xpos + (yaxispos == 'left' ? -3 : 3), Math.round(ca.height / 2));
+                        co.lineTo(xpos, Math.round(ca.height / 2));
+                    } else if (xaxispos == 'top') {
+                        co.moveTo(xpos + (yaxispos == 'left' ? -3 : 3), Math.round(this.gutterTop));
+                        co.lineTo(xpos, Math.round(this.gutterTop));
+                    } else {
+                        co.moveTo(xpos + (yaxispos == 'left' ? -3 : 3), Math.round(ca.height - this.gutterBottom));
+                        co.lineTo(xpos, Math.round(ca.height - this.gutterBottom));
+                    }
+                }
+            }
+
+
+            // Draw the X tickmarks
+            if (prop['chart.noxaxis'] == false && !isSketch) {
+
+                if (typeof(prop['chart.numxticks']) == 'number') {
+                    var xTickGap = (ca.width - this.gutterLeft - this.gutterRight) / prop['chart.numxticks'];
+                } else {
+                    var xTickGap = (ca.width - this.gutterLeft - this.gutterRight) / this.data.length;
+                }
+
+                if (xaxispos == 'bottom') {
+                    yStart   = prop['chart.ymin'] < 0 ? this.getYCoord(0) - 3 : this.getYCoord(0);
+                    yEnd     = this.getYCoord(0) + 3;
+                } else if (xaxispos == 'top') {
+                    yStart = this.gutterTop - 3;
+                    yEnd   = this.gutterTop;
+                } else if (xaxispos == 'center') {
+                    yStart = ((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop + 3;
+                    yEnd   = ((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop - 3;
+                }
+
+                //yStart = yStart;
+                //yEnd   = yEnd;
+
+                //////////////// X TICKS ////////////////
+                var noEndXTick = prop['chart.noendxtick'];
+
+                for (x=this.gutterLeft + (yaxispos == 'left' ? xTickGap : 0),len=(ca.width - this.gutterRight + (yaxispos == 'left' ? 5 : 0)); x<len; x+=xTickGap) {
+
+                    if (yaxispos == 'left' && !noEndXTick && x > this.gutterLeft) {
+                        co.moveTo(ma.round(x), yStart);
+                        co.lineTo(ma.round(x), yEnd);
+
+                    } else if (yaxispos == 'left' && noEndXTick && x > this.gutterLeft && x < (ca.width - this.gutterRight) ) {
+                        co.moveTo(ma.round(x), yStart);
+                        co.lineTo(ma.round(x), yEnd);
+
+                    } else if (yaxispos == 'right' && x < (ca.width - this.gutterRight) && !noEndXTick) {
+                        co.moveTo(ma.round(x), yStart);
+                        co.lineTo(ma.round(x), yEnd);
+
+                    } else if (yaxispos == 'right' && x < (ca.width - this.gutterRight) && x > (this.gutterLeft) && noEndXTick) {
+                        co.moveTo(ma.round(x), yStart);
+                        co.lineTo(ma.round(x), yEnd);
+                    }
+                }
+
+                if (prop['chart.noyaxis'] || prop['chart.numxticks'] == null) {
+                    if (typeof(prop['chart.numxticks']) == 'number' && prop['chart.numxticks'] > 0) {
+                        co.moveTo(Math.round(this.gutterLeft), yStart);
+                        co.lineTo(Math.round(this.gutterLeft), yEnd);
+                    }
+                }
+
+                //////////////// X TICKS ////////////////
+            }
+
+            /**
+            * If the Y axis is not being shown, draw an extra tick
+            */
+            if (prop['chart.noyaxis'] && prop['chart.noxaxis'] == false && prop['chart.numxticks'] == null) {
+                if (xaxispos == 'center') {
+                    co.moveTo(ma.round(this.gutterLeft), (ca.height / 2) - 3);
+                    co.lineTo(ma.round(this.gutterLeft), (ca.height / 2) + 3);
+                } else {
+                    co.moveTo(ma.round(this.gutterLeft), ca.height - this.gutterBottom);
+                    co.lineTo(ma.round(this.gutterLeft), ca.height - this.gutterBottom + 3);
+                }
+            }
+
+            co.stroke();
+        };
+
+
+
+
+        /**
+        * Draws the bars
+        */
+        this.drawbars =
+        this.Drawbars = function ()
+        {
+            co.lineWidth   = prop['chart.linewidth'];
+            co.strokeStyle = prop['chart.strokecolor'];
+            co.fillStyle   = prop['chart.colors'][0];
+
+            var prevX      = 0,
+                prevY      = 0,
+                decimals   = prop['chart.scale.decimals'];
+
+
+            /**
+            * Work out the max value
+            */
+            if (prop['chart.ymax']) {
+
+                this.scale2 = RG.getScale2(this, {
+                    'max':prop['chart.ymax'],
+                    'strict': prop['chart.scale.round'] ? false : true,
+                    'min':prop['chart.ymin'],
+                    'scale.thousand':prop['chart.scale.thousand'],
+                    'scale.point':prop['chart.scale.point'],
+                    'scale.decimals':prop['chart.scale.decimals'],
+                    'ylabels.count':prop['chart.ylabels.count'],
+                    'scale.round':prop['chart.scale.round'],
+                    'units.pre': prop['chart.units.pre'],
+                    'units.post': prop['chart.units.post']
+                });
+
+            } else {
+
+
+
+
+
+                //
+                // If errorbars are given as a number then convert the nuumber to an
+                // array.
+                //
+                var errorbars = prop['chart.errorbars'];
+
+                if (typeof errorbars === 'number') {
+
+                    var value = errorbars;
+
+                    prop['chart.errorbars'] = [];
+
+                    for (var i=0; i<this.data.length; ++i) {
+                        if (typeof this.data[i] === 'number') {
+                            prop['chart.errorbars'].push([value, null]);
+
+                        } else if (typeof this.data[i] === 'object' && !RG.isNull(this.data[i])) {
+                            for (var j=0; j<this.data[i].length; ++j) {
+                                prop['chart.errorbars'].push([value, null]);
+                            }
+                        }
+                    }
+
+                    errorbars = prop['chart.errorbars'];
+                }
+
+
+
+
+
+
+
+
+                for (i=0; i<this.data.length; ++i) {
+                    if (typeof(this.data[i]) == 'object') {
+                        var value = prop['chart.grouping'] === 'grouped' ? Number(RG.arrayMax(this.data[i], true)) : Number(RG.array_sum(this.data[i]));
+
+                    } else {
+                        var value = Number(this.data[i]);
+                    }
+
+                    this.max = ma.max(ma.abs(this.max), ma.abs(value) +
+
+                        Number(
+                            (
+                                   typeof prop['chart.errorbars'] === 'object'
+                                && typeof prop['chart.errorbars'][i] === 'object'
+                                && !RG.isNull(prop['chart.errorbars'][i])
+                                && typeof prop['chart.errorbars'][i][0] === 'number'
+                            ) ? prop['chart.errorbars'][i][0]  : 0
+                        )
+                    );
+                }
+
+
+
+
+
+
+
+                this.scale2 = RGraph.getScale2(this, {
+                    'max':this.max,
+                    'min':prop['chart.ymin'],
+                    'scale.thousand':prop['chart.scale.thousand'],
+                    'scale.point':prop['chart.scale.point'],
+                    'scale.decimals':prop['chart.scale.decimals'],
+                    'ylabels.count':prop['chart.ylabels.count'],
+                    'scale.round':prop['chart.scale.round'],
+                    'units.pre': prop['chart.units.pre'],
+                    'units.post': prop['chart.units.post']
+                });
+
+                this.max = this.scale2.max;
+            }
+
+            /**
+            * if the chart is adjustable fix the scale so that it doesn't change.
+            */
+            if (prop['chart.adjustable'] && !prop['chart.ymax']) {
+                this.Set('chart.ymax', this.scale2.max);
+            }
+
+            /**
+            * Draw horizontal bars here
+            */
+            if (prop['chart.background.hbars'] && prop['chart.background.hbars'].length > 0) {
+                RGraph.DrawBars(this);
+            }
+
+            var variant = prop['chart.variant'];
+
+            /**
+            * Draw the 3D axes is necessary
+            */
+            if (variant === '3d') {
+                RG.draw3DAxes(this);
+            }
+
+            /**
+            * Get the variant once, and draw the bars, be they regular, stacked or grouped
+            */
+
+            // Get these variables outside of the loop
+            var xaxispos      = prop['chart.xaxispos'],
+                width         = (ca.width - this.gutterLeft - this.gutterRight ) / this.data.length,
+                orig_height   = height,
+                hmargin       = prop['chart.hmargin'],
+                shadow        = prop['chart.shadow'],
+                shadowColor   = prop['chart.shadow.color'],
+                shadowBlur    = prop['chart.shadow.blur'],
+                shadowOffsetX = prop['chart.shadow.offsetx'],
+                shadowOffsetY = prop['chart.shadow.offsety'],
+                strokeStyle   = prop['chart.strokecolor'],
+                colors        = prop['chart.colors'],
+                sequentialColorIndex = 0
+
+            var height;
+
+            for (i=0,len=this.data.length; i<len; i+=1) {
+
+
+
+
+
+                // Work out the height
+                //The width is up outside the loop
+                if (RG.arraySum(this.data[i]) < 0) {
+                    var height = (RG.arraySum(this.data[i]) + this.scale2.min)  / (this.scale2.max - this.scale2.min);
+                } else {
+                    var height = (RG.arraySum(this.data[i]) - this.scale2.min) / (this.scale2.max - this.scale2.min);
+                }
+
+                height *= ma.abs(this.getYCoord(this.scale2.max) - this.getYCoord(this.scale2.min));
+
+
+
+
+
+
+                var x = (i * width) + this.gutterLeft;
+                var y = xaxispos == 'center' ? ((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop - height
+                                             : ca.height - height - this.gutterBottom;
+
+                // xaxispos is top
+                if (xaxispos == 'top') {
+                    y = this.gutterTop + ma.abs(height);
+                }
+
+
+                // Account for negative lengths - Some browsers don't like a negative value
+                if (height < 0) {
+                    y += height;
+                    height = ma.abs(height);
+                }
+
+
+
+
+
+
+                /**
+                * Turn on the shadow if need be
+                */
+                if (shadow) {
+                    co.shadowColor   = shadowColor;
+                    co.shadowBlur    = shadowBlur;
+                    co.shadowOffsetX = shadowOffsetX;
+                    co.shadowOffsetY = shadowOffsetY;
+                }
+
+                /**
+                * Draw the bar
+                */
+                co.beginPath();
+                    if (typeof this.data[i] == 'number') {
+
+
+                        // If the Y axis is offset change the bar start (the top of the bar)
+                        if (xaxispos === 'bottom' && prop['chart.ymin'] < 0) {
+                            if (this.data[i] >= 0) {
+                                height = ma.abs(this.getYCoord(0) - this.getYCoord(this.data[i]));
+                            } else {
+                                y = this.getYCoord(0);
+                                height = ma.abs(this.getYCoord(0) - this.getYCoord(this.data[i]));
+                            }
+                        }
+
+                        var barWidth = width - (2 * hmargin);
+
+                        /**
+                        * Check for a negative bar width
+                        */
+                        if (barWidth < 0) {
+                            alert('[RGRAPH] Warning: you have a negative bar width. This may be caused by the chart.hmargin being too high or the width of the canvas not being sufficient.');
+                        }
+
+                        // Set the fill color
+                        co.strokeStyle = strokeStyle;
+                        co.fillStyle = colors[0];
+
+                        /**
+                        * Sequential colors
+                        */
+                        if (prop['chart.colors.sequential']) {
+                            co.fillStyle = colors[i];
+                        }
+
+                        if (variant == 'sketch') {
+
+                            co.lineCap = 'round';
+
+                            var sketchOffset = 3;
+
+                            co.beginPath();
+
+                            co.strokeStyle = colors[0];
+
+                            /**
+                            * Sequential colors
+                            */
+                            if (prop['chart.colors.sequential']) {
+                                co.strokeStyle = colors[i];
+                            }
+
+                            // Left side
+                            co.moveTo(x + hmargin + 2, y + height - 2);
+                            co.lineTo(x + hmargin -    1, y - 4);
+
+                            // The top
+                            co.moveTo(x + hmargin - 3, y + -2 + (this.data[i] < 0 ? height : 0));
+                            co.bezierCurveTo(
+                                             x + ((hmargin + width) * 0.33),
+                                             y + 15 + (this.data[i] < 0 ? height - 10: 0),
+                                             x + ((hmargin + width) * 0.66),
+                                             y + 5 + (this.data[i] < 0 ? height - 10 : 0),x + hmargin + width + -1, y + 0 + (this.data[i] < 0 ? height : 0)
+                                            );
+
+
+                            // The right side
+                            co.moveTo(x + hmargin + width - 5, y  - 5);
+                            co.lineTo(x + hmargin + width - 3, y + height - 3);
+
+                            if (prop['chart.variant.sketch.verticals']) {
+                                for (var r=0.2; r<=0.8; r+=0.2) {
+                                    co.moveTo(x + hmargin + width + (r > 0.4 ? -1 : 3) - (r * width),y - 1);
+                                    co.lineTo(x + hmargin + width - (r > 0.4 ? 1 : -1) - (r * width), y + height + (r == 0.2 ? 1 : -2));
+                                }
+                            }
+
+                            co.stroke();
+
+                        // Regular bar
+                        } else if (variant == 'bar' || variant == '3d' || variant == 'glass' || variant == 'bevel') {
+
+                            if (RGraph.ISOLD && shadow) {
+                                this.DrawIEShadow([x + hmargin, y, barWidth, height]);
+                            }
+
+                            if (variant == 'glass') {
+                                RGraph.filledCurvyRect(co, x + hmargin, y, barWidth, height, 3, this.data[i] > 0, this.data[i] > 0, this.data[i] < 0, this.data[i] < 0);
+                                RGraph.strokedCurvyRect(co, x + hmargin, y, barWidth, height, 3, this.data[i] > 0, this.data[i] > 0, this.data[i] < 0, this.data[i] < 0);
+                            } else {
+                                // On 9th April 2013 these two were swapped around so that the stroke happens SECOND so that any
+                                // shadow that is cast by the fill does not overwrite the stroke
+
+                                co.beginPath();
+                                co.rect(x + hmargin, y, barWidth, height);
+                                co.fill();
+
+                                // Turn the shadow off so that the stroke doesn't cast any "extra" shadow
+                                // that would show inside the bar
+                                RG.NoShadow(this);
+
+                                co.beginPath();
+                                co.rect(x + hmargin, y, barWidth, height);
+                                co.stroke();
+                            }
+
+                            // 3D effect
+                            if (variant == '3d') {
+
+                                var prevStrokeStyle = co.strokeStyle;
+                                var prevFillStyle   = co.fillStyle;
+
+                                // Draw the top (if the value is positive - otherwise there's no point)
+                                if (this.data[i] >= 0) {
+                                    co.beginPath();
+                                        co.moveTo(x + hmargin, y);
+                                        co.lineTo(x + hmargin + prop['chart.variant.threed.offsetx'], y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(x + hmargin + prop['chart.variant.threed.offsetx'] + barWidth, y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(x + hmargin + barWidth, y);
+                                    co.closePath();
+
+                                    co.stroke();
+                                    co.fill();
+                                }
+
+                                // Draw the right hand side
+                                co.beginPath();
+                                    co.moveTo(x + hmargin + barWidth, y);
+                                    co.lineTo(
+                                        x + hmargin + barWidth + prop['chart.variant.threed.offsetx'],
+                                        this.data[i] < 0 && xaxispos === 'bottom' ?
+                                            this.getYCoord(0) : (
+                                                  this.data[i] < 0 && (y - prop['chart.variant.threed.offsety'])
+                                                < (this.gutterTop + this.halfgrapharea)
+
+                                                ?
+
+                                                (this.gutterTop + this.halfgrapharea)
+
+                                                : (y - prop['chart.variant.threed.offsety']))
+                                    );
+
+co.lineTo(
+    x + hmargin + barWidth + prop['chart.variant.threed.offsetx'],
+
+
+      this.data[i] < 0 && (y - prop['chart.variant.threed.offsety'] + height) < (this.gutterTop + this.getYCoord(0))
+    ? this.getYCoord(this.data[i]) - prop['chart.variant.threed.offsety']
+    : (this.data[i] > 0 ?
+        y - prop['chart.variant.threed.offsety'] + height :
+        ma.min(y - prop['chart.variant.threed.offsety'] + height, ca.height - this.gutterBottom)
+       )
+);
+                                    co.lineTo(x + hmargin + barWidth, y + height);
+                                co.closePath();
+                                co.stroke();
+                                co.fill();
+
+
+
+
+                                // Draw the lighter top section
+                                if (this.data[i] > 0) {
+                                    co.beginPath();
+                                        co.fillStyle = 'rgba(255,255,255,0.5)';
+                                        co.moveTo(x + hmargin, y);
+                                        co.lineTo(x + hmargin + prop['chart.variant.threed.offsetx'], y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(x + hmargin + prop['chart.variant.threed.offsetx'] + barWidth, y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(x + hmargin + barWidth, y);
+                                        co.lineTo(x + hmargin, y);
+                                    co.closePath();
+                                    co.stroke();
+                                    co.fill();
+                                }
+
+
+
+
+                                // Draw the darker right side section
+                                co.beginPath();
+                                    co.fillStyle = 'rgba(0,0,0,0.4)';
+                                    // TL
+                                    co.moveTo(x + hmargin + barWidth, y);
+
+                                    // TR
+                                    co.lineTo(
+                                        x + hmargin + barWidth + prop['chart.variant.threed.offsetx'],
+                                        this.data[i] < 0 && xaxispos === 'bottom' ? this.getYCoord(0) : (this.data[i] < 0 && (y - prop['chart.variant.threed.offsety']) < (this.gutterTop + this.halfgrapharea) ? (this.gutterTop + this.halfgrapharea) : y - prop['chart.variant.threed.offsety'])
+                                    );
+
+                                    // BR
+                                    co.lineTo(
+                                        x + hmargin + barWidth + prop['chart.variant.threed.offsetx'],
+
+                                          this.data[i] < 0 && (y - prop['chart.variant.threed.offsety'] + height) < this.getYCoord(0)
+                                        ? this.getYCoord(0)
+                                        : this.data[i] > 0 ? y - prop['chart.variant.threed.offsety'] + height : ma.min(y - prop['chart.variant.threed.offsety'] + height, ca.height - this.gutterBottom)
+                                    );
+                                    // BL
+                                    co.lineTo(x + hmargin + barWidth, y + height);
+                                    co.lineTo(x + hmargin + barWidth, y);
+                                co.closePath();
+
+                                co.stroke();
+                                co.fill();
+
+                                co.strokeStyle = prevStrokeStyle;
+                                co.fillStyle   = prevFillStyle;
+
+                            // Glass variant
+                            } else if (variant == 'glass') {
+
+                                var grad = co.createLinearGradient(x + hmargin,y,x + hmargin + (barWidth / 2),y);
+                                grad.addColorStop(0, 'rgba(255,255,255,0.9)');
+                                grad.addColorStop(1, 'rgba(255,255,255,0.5)');
+
+                                co.beginPath();
+                                co.fillStyle = grad;
+                                co.fillRect(x + hmargin + 2,y + (this.data[i] > 0 ? 2 : 0),(barWidth / 2) - 2,height - 2);
+                                co.fill();
+                            }
+
+
+                        // Dot chart
+                        } else if (variant == 'dot') {
+
+                            co.beginPath();
+                            co.moveTo(x + (width / 2), y);
+                            co.lineTo(x + (width / 2), y + height);
+                            co.stroke();
+
+                            co.beginPath();
+                            co.fillStyle = this.properties['chart.colors'][i];
+                            co.arc(x + (width / 2), y + (this.data[i] > 0 ? 0 : height), 2, 0, 6.28, 0);
+
+                            // Set the colour for the dots
+                            co.fillStyle = prop['chart.colors'][0];
+
+                            /**
+                            * Sequential colors
+                            */
+                            if (prop['chart.colors.sequential']) {
+                                co.fillStyle = colors[i];
+                            }
+
+                            co.stroke();
+                            co.fill();
+
+
+
+                        // Unknown variant type
+                        } else {
+                            alert('[BAR] Warning! Unknown chart.variant: ' + variant);
+                        }
+
+                        this.coords.push([x + hmargin, y, width - (2 * hmargin), height]);
+
+                            if (typeof this.coords2[i] == 'undefined') {
+                                this.coords2[i] = [];
+                            }
+                            this.coords2[i].push([x + hmargin, y, width - (2 * hmargin), height]);
+
+
+                    /**
+                    * Stacked bar
+                    */
+                    } else if (this.data[i] && typeof(this.data[i]) == 'object' && prop['chart.grouping'] == 'stacked') {
+
+                        if (this.scale2.min) {
+                            alert("[ERROR] Stacked Bar charts with a Y min are not supported");
+                        }
+
+                        var barWidth     = width - (2 * hmargin);
+                        var redrawCoords = [];// Necessary to draw if the shadow is enabled
+                        var startY       = 0;
+                        var dataset      = this.data[i];
+
+                        /**
+                        * Check for a negative bar width
+                        */
+                        if (barWidth < 0) {
+                            alert('[RGRAPH] Warning: you have a negative bar width. This may be caused by the chart.hmargin being too high or the width of the canvas not being sufficient.');
+                        }
+
+                        for (j=0; j<dataset.length; ++j) {
+
+                            // Stacked bar chart and X axis pos in the middle - poitless since negative values are not permitted
+                            if (xaxispos == 'center') {
+                                alert("[BAR] It's pointless having the X axis position at the center on a stacked bar chart.");
+                                return;
+                            }
+
+                            // Negative values not permitted for the stacked chart
+                            if (this.data[i][j] < 0) {
+                                alert('[BAR] Negative values are not permitted with a stacked bar chart. Try a grouped one instead.');
+                                return;
+                            }
+
+                            /**
+                            * Set the fill and stroke colors
+                            */
+                            co.strokeStyle = strokeStyle
+                            co.fillStyle = colors[j];
+
+                            if (prop['chart.colors.reverse']) {
+                                co.fillStyle = colors[this.data[i].length - j - 1];
+                            }
+
+                            if (prop['chart.colors.sequential'] && colors[sequentialColorIndex]) {
+                                co.fillStyle = colors[sequentialColorIndex++];
+                            } else if (prop['chart.colors.sequential']) {
+                                co.fillStyle = colors[sequentialColorIndex - 1];
+                            }
+
+                            var height = (dataset[j] / this.scale2.max) * (ca.height - this.gutterTop - this.gutterBottom );
+
+                            // If the X axis pos is in the center, we need to half the  height
+                            if (xaxispos == 'center') {
+                                height /= 2;
+                            }
+
+                            var totalHeight = (RGraph.array_sum(dataset) / this.scale2.max) * (ca.height - hmargin - this.gutterTop - this.gutterBottom);
+
+                            /**
+                            * Store the coords for tooltips
+                            */
+                            this.coords.push([x + hmargin, y, width - (2 * hmargin), height]);
+                            if (typeof this.coords2[i] == 'undefined') {
+                                this.coords2[i] = [];
+                            }
+                            this.coords2[i].push([x + hmargin, y, width - (2 * hmargin), height]);
+
+                            // MSIE shadow
+                            if (RGraph.ISOLD && shadow) {
+                                this.DrawIEShadow([x + hmargin, y, width - (2 * hmargin), height + 1]);
+                            }
+
+                            if (height > 0) {
+                                co.strokeRect(x + hmargin, y, width - (2 * hmargin), height);
+                                co.fillRect(x + hmargin, y, width - (2 * hmargin), height);
+                            }
+
+
+                            if (j == 0) {
+                                var startY = y;
+                                var startX = x;
+                            }
+
+                            /**
+                            * Store the redraw coords if the shadow is enabled
+                            */
+                            if (shadow) {
+                                redrawCoords.push([x + hmargin, y, width - (2 * hmargin), height, co.fillStyle]);
+                            }
+
+                            /**
+                            * Stacked 3D effect
+                            */
+                            if (variant == '3d') {
+
+                                var prevFillStyle = co.fillStyle;
+                                var prevStrokeStyle = co.strokeStyle;
+
+
+                                // Draw the top side
+                                if (j == 0) {
+                                    co.beginPath();
+                                        co.moveTo(startX + hmargin, y);
+                                        co.lineTo(startX + prop['chart.variant.threed.offsetx'] + hmargin, y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(startX + prop['chart.variant.threed.offsetx'] + barWidth + hmargin, y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(startX + barWidth + hmargin, y);
+                                    co.closePath();
+
+                                    co.fill();
+                                    co.stroke();
+                                }
+
+                                // Draw the side section
+                                co.beginPath();
+                                    co.moveTo(startX + barWidth + hmargin, y);
+                                    co.lineTo(startX + barWidth + hmargin + prop['chart.variant.threed.offsetx'], y - prop['chart.variant.threed.offsety']);
+                                    co.lineTo(startX + barWidth + hmargin + prop['chart.variant.threed.offsetx'], y - prop['chart.variant.threed.offsety'] + height);
+                                    co.lineTo(startX + barWidth + hmargin , y + height);
+                                co.closePath();
+
+                                co.fill();
+                                co.stroke();
+
+                                // Draw the lighter top side
+                                if (j == 0) {
+                                    co.fillStyle = 'rgba(255,255,255,0.5)';
+                                    co.beginPath();
+                                        co.moveTo(startX + hmargin, y);
+                                        co.lineTo(startX + prop['chart.variant.threed.offsetx'] + hmargin, y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(startX + prop['chart.variant.threed.offsetx'] + barWidth + hmargin, y - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(startX + barWidth + hmargin, y);
+                                    co.closePath();
+
+                                    co.fill();
+                                    co.stroke();
+                                }
+
+                                // Draw the darker side section
+                                co.fillStyle = 'rgba(0,0,0,0.4)';
+                                co.beginPath();
+                                    co.moveTo(startX + barWidth + hmargin, y);
+                                    co.lineTo(startX + barWidth + hmargin + prop['chart.variant.threed.offsetx'], y - prop['chart.variant.threed.offsety']);
+                                    co.lineTo(startX + barWidth + hmargin + prop['chart.variant.threed.offsetx'], y - prop['chart.variant.threed.offsety'] + height);
+                                    co.lineTo(startX + barWidth + hmargin , y + height);
+                                co.closePath();
+
+                                co.fill();
+                                co.stroke();
+
+                                co.strokeStyle = prevStrokeStyle;
+                                co.fillStyle = prevFillStyle;
+                            }
+
+                            y += height;
+                        }
+
+
+
+                        /**
+                        * Redraw the bars if the shadow is enabled due to hem being drawn from the bottom up, and the
+                        * shadow spilling over to higher up bars
+                        */
+                        if (shadow) {
+
+                            RGraph.NoShadow(this);
+
+                            for (k=0; k<redrawCoords.length; ++k) {
+                                co.strokeStyle = strokeStyle;
+                                co.fillStyle = redrawCoords[k][4];
+                                co.strokeRect(redrawCoords[k][0], redrawCoords[k][1], redrawCoords[k][2], redrawCoords[k][3]);
+                                co.fillRect(redrawCoords[k][0], redrawCoords[k][1], redrawCoords[k][2], redrawCoords[k][3]);
+
+                                co.stroke();
+                                co.fill();
+                            }
+
+                            // Reset the redraw coords to be empty
+                            redrawCoords = [];
+                        }
+
+                    /**
+                    * Grouped bar
+                    */
+                    } else if (this.data[i] && typeof(this.data[i]) == 'object' && prop['chart.grouping'] == 'grouped') {
+
+                        var redrawCoords = [];
+                        co.lineWidth = prop['chart.linewidth'];
+
+                        for (j=0; j<this.data[i].length; ++j) {
+
+                            // Set the fill and stroke colors
+                            co.strokeStyle = strokeStyle;
+                            co.fillStyle   = colors[j];
+
+                            /**
+                            * Sequential colors
+                            */
+                            if (prop['chart.colors.sequential'] && colors[sequentialColorIndex]) {
+                                co.fillStyle = colors[sequentialColorIndex++];
+                            } else if (prop['chart.colors.sequential']) {
+                                co.fillStyle = colors[sequentialColorIndex - 1];
+                            }
+
+                            var individualBarWidth = (width - (2 * hmargin)) / this.data[i].length;
+                            var height = ((this.data[i][j] + (this.data[i][j] < 0 ? this.scale2.min : (-1 * this.scale2.min) )) / (this.scale2.max - this.scale2.min) ) * (ca.height - this.gutterTop - this.gutterBottom );
+                            var groupedMargin = prop['chart.hmargin.grouped'];
+                            var startX = x + hmargin + (j * individualBarWidth);
+
+                            /**
+                            * Check for a negative bar width
+                            */
+                            if (individualBarWidth < 0) {
+                                alert('[RGRAPH] Warning: you have a negative bar width. This may be caused by the chart.hmargin being too high or the width of the canvas not being sufficient.');
+                            }
+
+                            // If the X axis pos is in the center, we need to half the  height
+                            if (xaxispos == 'center') {
+                                height /= 2;
+                            }
+
+                            /**
+                            * Determine the start positioning for the bar
+                            */
+                            if (xaxispos == 'top') {
+                                var startY = this.gutterTop;
+                                var height = Math.abs(height);
+
+                            } else if (xaxispos == 'center') {
+                                var startY = this.gutterTop + (this.grapharea / 2) - height;
+
+                            } else {
+                                var startY = this.getYCoord(0);//ca.height - this.gutterBottom - height;
+                                var height = ma.abs(ma.abs(this.getYCoord(this.data[i][j])) - this.getYCoord(0));
+
+                                if (this.data[i][j] >= 0) {
+                                    startY -= height;
+                                }
+
+                            }
+
+                            co.strokeRect(startX + groupedMargin, startY, individualBarWidth - (2 * groupedMargin), height);
+                            co.fillRect(startX + groupedMargin, startY, individualBarWidth - (2 * groupedMargin), height);
+                            y += height;
+
+
+
+                            /**
+                            * Grouped 3D effect
+                            */
+                            if (variant == '3d') {
+
+                                var prevFillStyle   = co.fillStyle;
+                                var prevStrokeStyle = co.strokeStyle;
+                                var hmarginGrouped  = prop['chart.hmargin.grouped'];
+
+                                // Draw the top side
+                                if (this.data[i][j]  >= 0) {
+
+                                    co.beginPath();
+                                        co.moveTo(startX + hmarginGrouped, startY);
+                                        co.lineTo(startX + hmarginGrouped + prop['chart.variant.threed.offsetx'], startY - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(startX + prop['chart.variant.threed.offsetx'] + individualBarWidth - hmarginGrouped, startY - prop['chart.variant.threed.offsety']);
+                                        co.lineTo(startX + individualBarWidth - hmarginGrouped, startY);
+                                    co.closePath();
+                                    co.fill();
+                                    co.stroke();
+                                }
+
+                                // Draw the side section
+                                co.beginPath();
+                                    co.moveTo(startX + individualBarWidth - hmarginGrouped - 1, startY);
+                                    co.lineTo(
+                                        startX + individualBarWidth - hmarginGrouped + prop['chart.variant.threed.offsetx'],
+                                        this.data[i][j] < 0 ? (this.getYCoord(0) + ma.abs(height) - prop['chart.variant.threed.offsety']) : this.getYCoord(0) - height - prop['chart.variant.threed.offsety']
+                                    );
+
+                                    co.lineTo(
+                                        startX + individualBarWidth - hmarginGrouped + prop['chart.variant.threed.offsetx'],
+                                        this.data[i][j] < 0 && (startY + height - prop['chart.variant.threed.offsety']) < (this.gutterTop + this.halfgrapharea) ? (this.gutterTop + this.halfgrapharea) : (startY + height - prop['chart.variant.threed.offsety'])
+                                    );
+                                    co.lineTo(startX + individualBarWidth - hmarginGrouped - 1, startY + height);
+                                co.closePath();
+                                co.fill();
+                                co.stroke();
+
+
+                                // Draw the lighter top side - but only if the current value is positive
+                                if (this.data[i][j] >= 0) {
+                                    co.fillStyle = 'rgba(255,255,255,0.5)';
+                                    co.beginPath();
+                                        // BL
+                                        co.moveTo(startX + hmarginGrouped, startY);
+
+                                        // BR
+                                        co.lineTo(startX + hmarginGrouped + prop['chart.variant.threed.offsetx'], startY - prop['chart.variant.threed.offsety']);
+
+                                        // TR
+                                        co.lineTo(startX + prop['chart.variant.threed.offsetx'] + individualBarWidth - hmarginGrouped, startY - prop['chart.variant.threed.offsety']);
+
+                                        // TL
+                                        co.lineTo(startX + individualBarWidth - hmarginGrouped, startY);
+                                    co.closePath();
+
+                                    co.fill();
+                                    co.stroke();
+                                }
+
+                                // Draw the darker side section
+                                co.fillStyle = 'rgba(0,0,0,0.4)';
+                                co.beginPath();
+                                    // TL corner
+                                    co.moveTo(
+                                        startX + individualBarWidth - hmarginGrouped,
+                                        startY
+                                    );
+
+
+                                    co.lineTo(
+                                        startX + individualBarWidth + prop['chart.variant.threed.offsetx'] - hmarginGrouped,
+                                        this.data[i][j] < 0 ? (this.getYCoord(0) + ma.abs(height) - prop['chart.variant.threed.offsety']) : this.getYCoord(0) - height - prop['chart.variant.threed.offsety']
+                                    );
+
+                                    // TR corner
+                                    co.lineTo(
+                                        startX + individualBarWidth + prop['chart.variant.threed.offsetx'] - hmarginGrouped,
+                                        this.data[i][j] < 0 && (startY + height - 5) < (this.gutterTop + this.halfgrapharea) ? (this.gutterTop + this.halfgrapharea) : (startY + height - prop['chart.variant.threed.offsety'])
+                                    );
+
+                                    // TL corner
+                                    co.lineTo(startX + individualBarWidth - hmarginGrouped, startY + height);
+                                co.closePath();
+
+                                co.fill();
+                                co.stroke();
+
+                                co.strokeStyle = prevStrokeStyle;
+                                co.fillStyle   = prevFillStyle;
+                            }
+
+                            if (height < 0) {
+                                height = Math.abs(height);
+                                startY = startY - height;
+                            }
+
+                            this.coords.push([startX + groupedMargin, startY, individualBarWidth - (2 * groupedMargin), height]);
+                            if (typeof this.coords2[i] == 'undefined') {
+                                this.coords2[i] = [];
+                            }
+
+                            this.coords2[i].push([startX + groupedMargin, startY, individualBarWidth - (2 * groupedMargin), height]);
+
+                            // Facilitate shadows going to the left
+                            if (prop['chart.shadow']) {
+                                redrawCoords.push([startX + groupedMargin, startY, individualBarWidth - (2 * groupedMargin), height, co.fillStyle]);
+                            }
+                        }
+
+
+
+
+
+
+
+                        /**
+                        * Redraw the bar if shadows are going to the left
+                        */
+                        if (redrawCoords.length) {
+
+                            RGraph.NoShadow(this);
+
+                            co.lineWidth = prop['chart.linewidth'];
+
+                            co.beginPath();
+                                for (var j=0; j<redrawCoords.length; ++j) {
+
+                                    co.fillStyle   = redrawCoords[j][4];
+                                    co.strokeStyle = prop['chart.strokecolor'];
+
+                                    co.fillRect(redrawCoords[j][0], redrawCoords[j][1], redrawCoords[j][2], redrawCoords[j][3]);
+                                    co.strokeRect(redrawCoords[j][0], redrawCoords[j][1], redrawCoords[j][2], redrawCoords[j][3]);
+                                }
+                            co.fill();
+                            co.stroke();
+
+                            redrawCoords = [];
+                        }
+                    } else {
+                        this.coords.push([]);
+                    }
+
+                co.closePath();
+            }
+
+            // If 3D, redraw the right hand Y axis
+            if (prop['chart.variant'] === '3d' && prop['chart.yaxispos'] === 'right') {
+                RG.draw3DYAxis(this);
+            }
+
+
+
+
+
+            /**
+            * Turn off any shadow
+            */
+            RGraph.noShadow(this);
+        };
+
+
+
+        /**
+        * Draws the labels for the graph
+        */
+        this.drawLabels =
+        this.DrawLabels = function ()
+        {
+            var context = co;
+
+            var text_angle = prop['chart.text.angle'],
+                text_size  = prop['chart.text.size'],
+                labels     = prop['chart.labels']
+
+
+
+            // Draw the Y axis labels:
+            if (prop['chart.ylabels']) {
+                if (prop['chart.xaxispos'] == 'top')    this.Drawlabels_top();
+                if (prop['chart.xaxispos'] == 'center') this.Drawlabels_center();
+                if (prop['chart.xaxispos'] == 'bottom') this.Drawlabels_bottom();
+            }
+
+            /**
+            * The X axis labels
+            */
+            if (typeof(labels) == 'object' && labels) {
+
+                var yOffset = Number(prop['chart.labels.offsety']),
+                    xOffset = Number(prop['chart.labels.offsetx']),
+                    bold    = prop['chart.labels.bold']
+
+                /**
+                * Text angle
+                */
+                if (prop['chart.text.angle'] != 0) {
+                    var valign =  'center';
+                    var halign =  'right';
+                    var angle  = 0 - prop['chart.text.angle'];
+                } else {
+                    var valign =  'top';
+                    var halign =  'center';
+                    var angle  = 0;
+                }
+
+                // Draw the X axis labels
+                co.fillStyle = prop['chart.labels.color'] || prop['chart.text.color'];
+
+                // How wide is each bar
+                var barWidth = (ca.width - this.gutterRight - this.gutterLeft) / labels.length;
+
+                // Reset the xTickGap
+                xTickGap = (ca.width - this.gutterRight - this.gutterLeft) / labels.length
+
+                // Draw the X tickmarks
+                var i=0;
+                var font = prop['chart.text.font'];
+
+                for (x=this.gutterLeft + (xTickGap / 2); x<=ca.width - this.gutterRight; x+=xTickGap) {
+
+                    RG.text2(this, {
+                        'font': font,
+                        'size': text_size,
+                        'x': x + xOffset,
+                        'y': prop['chart.xaxispos'] == 'top' ? this.gutterTop + yOffset - 5: (ca.height - this.gutterBottom) + yOffset + 3,
+                        'bold': bold,
+                        'text': String(labels[i++]),
+                        'valign': prop['chart.xaxispos'] == 'top' ? 'bottom' : valign,
+                        'halign': halign,
+                        'tag':'label',
+                        'marker':false,
+                        'angle':angle,
+                        'tag': 'labels'
+                    });
+                }
+            }
+
+            /**
+            * Draw above labels
+            */
+            this.drawAboveLabels();
+        };
+
+
+
+        /**
+        * Draws the X axis at the top
+        */
+        this.drawlabels_top =
+        this.Drawlabels_top = function ()
+        {
+            var ca   = this.canvas;
+            var co   = this.context;
+            var prop = this.properties;
+
+            co.beginPath();
+            co.fillStyle   = prop['chart.text.color'];
+            co.strokeStyle = 'black';
+
+            if (prop['chart.xaxispos'] == 'top') {
+
+                var context    = co;
+                var text_size  = prop['chart.text.size'];
+                var units_pre  = prop['chart.units.pre'];
+                var units_post = prop['chart.units.post'];
+                var align      = prop['chart.yaxispos'] == 'left' ? 'right' : 'left';
+                var font       = prop['chart.text.font'];
+                var numYLabels = prop['chart.ylabels.count'];
+                var ymin       = prop['chart.ymin'];
+                var offsetx     = prop['chart.ylabels.offsetx'];
+                var offsety     = prop['chart.ylabels.offsety'];
+
+                if (prop['chart.ylabels.inside'] == true) {
+                    var xpos  = prop['chart.yaxispos'] == 'left' ? this.gutterLeft + 5 : ca.width - this.gutterRight - 5;
+                    var align = prop['chart.yaxispos'] == 'left' ? 'left' : 'right';
+                    var boxed = true;
+                } else {
+                    var xpos  = prop['chart.yaxispos'] == 'left' ? this.gutterLeft - 5 : ca.width - this.gutterRight + 5;
+                    var boxed = false;
+                }
+
+                /**
+                * Draw specific Y labels here so that the local variables can be reused
+                */
+                if (typeof(prop['chart.ylabels.specific']) == 'object' && prop['chart.ylabels.specific']) {
+
+                    var labels = RGraph.array_reverse(prop['chart.ylabels.specific']);
+                    var grapharea = ca.height - this.gutterTop - this.gutterBottom;
+
+                    for (var i=0; i<labels.length; ++i) {
+
+                        var y = this.gutterTop + (grapharea * (i / labels.length)) + (grapharea / labels.length);
+
+                        RG.text2(this, {
+                            'font': font,
+                            'size': text_size,
+                            'x': xpos + offsetx,
+                            'y': y + offsety,
+                            'text': String(labels[i]),
+                            'valign': 'center',
+                            'halign': align,
+                            'bordered':boxed,
+                            'tag': 'scale'
+                        });
+                    }
+
+                    return;
+                }
+
+
+
+
+
+
+
+                /**
+                * Draw the scale
+                */
+                var labels = this.scale2.labels;
+                for (var i=0; i<labels.length; ++i) {
+                    RGraph.Text2(this, {
+                        'font': font,
+                        'size':text_size,
+                        'x':xpos + offsetx,
+                        'y':this.gutterTop + ((this.grapharea / labels.length) * (i + 1)) + offsety,
+                        'text': '-' + labels[i],
+                        'valign': 'center',
+                        'halign': align,
+                        'bordered': boxed,
+                        'tag':'scale'
+                    });
+                }
+
+
+
+
+
+
+
+
+                /**
+                * Show the minimum value if its not zero
+                */
+                if (prop['chart.ymin'] != 0 || prop['chart.noxaxis'] || prop['chart.scale.zerostart']) {
+
+                    RGraph.Text2(this, {
+                        'font': font,
+                        'size': text_size,
+                           'x': xpos + offsetx,
+                           'y': this.gutterTop + offsety,
+                        'text': (this.scale2.min != 0 ? '-' : '') + RGraph.numberFormat(this,(this.scale2.min.toFixed((this.scale2.min === 0 ? 0 : prop['chart.scale.decimals']))), units_pre, units_post),
+                      'valign': 'center',
+                      'halign': align,
+                    'bordered': boxed,
+                        'tag': 'scale'
+                    });
+                }
+
+            }
+
+            co.fill();
+        };
+
+
+
+        /**
+        * Draws the X axis in the middle
+        */
+        this.drawlabels_center =
+        this.Drawlabels_center = function ()
+        {
+            var ca   = this.canvas;
+            var co   = this.context;
+            var prop = this.properties;
+
+            var font       = prop['chart.text.font'];
+            var numYLabels = prop['chart.ylabels.count'];
+
+            co.fillStyle = prop['chart.text.color'];
+
+            if (prop['chart.xaxispos'] == 'center') {
+
+                /**
+                * Draw the top labels
+                */
+                var text_size  = prop['chart.text.size'];
+                var units_pre  = prop['chart.units.pre'];
+                var units_post = prop['chart.units.post'];
+                var context = co;
+                var align   = '';
+                var xpos    = 0;
+                var boxed   = false;
+                var ymin    = prop['chart.ymin'];
+                var offsetx = prop['chart.ylabels.offsetx'];
+                var offsety = prop['chart.ylabels.offsety'];
+
+                co.fillStyle   = prop['chart.text.color'];
+                co.strokeStyle = 'black';
+
+                if (prop['chart.ylabels.inside'] == true) {
+                    var xpos  = prop['chart.yaxispos'] == 'left' ? this.gutterLeft + 5 : ca.width - this.gutterRight - 5;
+                    var align = prop['chart.yaxispos'] == 'left' ? 'left' : 'right';
+                    var boxed = true;
+                } else {
+                    var xpos  = prop['chart.yaxispos'] == 'left' ? this.gutterLeft - 5 : ca.width - this.gutterRight + 5;
+                    var align = prop['chart.yaxispos'] == 'left' ? 'right' : 'left';
+                    var boxed = false;
+                }
+
+
+
+
+
+
+
+
+
+
+
+
+                /**
+                * Draw specific Y labels here so that the local variables can be reused
+                */
+                if (typeof(prop['chart.ylabels.specific']) == 'object' && prop['chart.ylabels.specific']) {
+
+                    var labels    = prop['chart.ylabels.specific'];
+                    var grapharea = ca.height - this.gutterTop - this.gutterBottom;
+
+                    // Draw the top halves labels
+                    for (var i=0; i<labels.length; ++i) {
+
+                        var y = this.gutterTop + ((grapharea / 2) / (labels.length - 1)) * i;
+
+                        RGraph.Text2(this, {
+                            'font':font,
+                            'size':text_size,
+                            'x':xpos + offsetx,
+                            'y':y + offsety,
+                            'text':String(labels[i]),
+                            'valign':'center',
+                            'halign':align,
+                            'bordered':boxed,
+                            'tag': 'scale'
+                        });
+                    }
+
+                    // Draw the bottom halves labels
+                    for (var i=labels.length-1; i>=1; --i) {
+
+                        var y = this.gutterTop  + (grapharea * (i / ((labels.length - 1) * 2) )) + (grapharea / 2);
+
+                        RG.Text2(this, {
+                            'font':font,
+                            'size':text_size,
+                            'x':xpos + offsetx,
+                            'y':y + offsety,
+                            'text':String(labels[labels.length - i - 1]),
+                            'valign':'center',
+                            'halign':align,
+                            'bordered':boxed,
+                            'tag': 'scale'
+                        });
+                    }
+
+                    return;
+                }
+
+
+
+
+
+
+
+
+
+
+                /**
+                * Draw the top halfs labels
+                */
+                for (var i=0; i<this.scale2.labels.length; ++i) {
+                    var y    = this.gutterTop + this.halfgrapharea - ((this.halfgrapharea / numYLabels) * (i + 1));
+                    var text = this.scale2.labels[i];
+                    RG.Text2(this, {
+                        'font':font,
+                        'size':text_size,
+                        'x':xpos + offsetx,
+                        'y':y + offsety,
+                        'text':
+                        text,
+                        'valign':
+                        'center',
+                        'halign': align,
+                        'bordered': boxed,
+                        'tag':'scale'
+                    });
+                }
+
+                /**
+                * Draw the bottom halfs labels
+                */
+                for (var i=(this.scale2.labels.length - 1); i>=0; --i) {
+                    var y = this.gutterTop + ((this.halfgrapharea / numYLabels) * (i + 1)) + this.halfgrapharea;
+                    var text = this.scale2.labels[i];
+                    RG.Text2(this, {
+                        'font':font,
+                        'size':text_size,
+                        'x':xpos + offsetx,
+                        'y':y + offsety,
+                        'text': '-' + text,
+                        'valign':'center',
+                        'halign': align,
+                        'bordered': boxed,
+                        'tag':'scale'
+                    });
+                }
+
+
+
+
+
+                /**
+                * Show the minimum value if its not zero
+                */
+                if (this.scale2.min != 0 || prop['chart.scale.zerostart']) {
+                    RG.Text2(this, {
+                        'font':font,
+                        'size':text_size,
+                        'x':xpos + offsetx,
+                        'y':this.gutterTop + this.halfgrapharea + offsety,
+                        'text': RG.number_format(this,(this.scale2.min.toFixed((this.scale2.min === 0 ? 0 : prop['chart.scale.decimals']))), units_pre, units_post),
+                        'valign':'center',
+                        'valign':'center',
+                        'halign': align,
+                        'bordered': boxed,
+                        'tag':'scale'
+                    });
+                }
+            }
+        };
+
+
+
+
+        /**
+        * Draws the X axdis at the bottom (the default)
+        */
+        this.drawlabels_bottom =
+        this.Drawlabels_bottom = function ()
+        {
+            var text_size  = prop['chart.text.size'],
+                units_pre  = prop['chart.units.pre'],
+                units_post = prop['chart.units.post'],
+                context    = this.context,
+                align      = prop['chart.yaxispos'] == 'left' ? 'right' : 'left',
+                font       = prop['chart.text.font'],
+                numYLabels = prop['chart.ylabels.count'],
+                ymin       = prop['chart.ymin'],
+                offsetx    = prop['chart.ylabels.offsetx'],
+                offsety    = prop['chart.ylabels.offsety']
+
+            co.beginPath();
+
+            co.fillStyle   = prop['chart.text.color'];
+            co.strokeStyle = 'black';
+
+            if (prop['chart.ylabels.inside'] == true) {
+                var xpos  = prop['chart.yaxispos'] == 'left' ? this.gutterLeft + 5 : ca.width - this.gutterRight - 5;
+                var align = prop['chart.yaxispos'] == 'left' ? 'left' : 'right';
+                var boxed = true;
+            } else {
+                var xpos  = prop['chart.yaxispos'] == 'left' ? this.gutterLeft - 5 : ca.width - this.gutterRight + 5;
+                var boxed = false;
+            }
+
+            /**
+            * Draw specific Y labels here so that the local variables can be reused
+            */
+            if (prop['chart.ylabels.specific'] && typeof(prop['chart.ylabels.specific']) == 'object') {
+
+                var labels = prop['chart.ylabels.specific'];
+                var grapharea = ca.height - this.gutterTop - this.gutterBottom;
+
+                for (var i=0; i<labels.length; ++i) {
+                    var y = this.gutterTop + (grapharea * (i / (labels.length - 1)));
+
+                    RGraph.Text2(this, {
+                        'font':font,
+                        'size':text_size,
+                        'x':xpos + offsetx,
+                        'y':y + offsety,
+                        'text': labels[i],
+                        'valign':'center',
+                        'halign': align,
+                        'bordered': boxed,
+                        'tag':'scale'
+                    });
+                }
+
+                return;
+            }
+
+            var gutterTop      = this.gutterTop;
+            var halfTextHeight = this.halfTextHeight;
+            var scale          = this.scale;
+
+
+            for (var i=0; i<numYLabels; ++i) {
+                var text = this.scale2.labels[i];
+                RGraph.Text2(this, {
+                    'font':font,
+                    'size':text_size,
+                    'x':xpos + offsetx,
+                    'y':this.gutterTop + this.grapharea - ((this.grapharea / numYLabels) * (i+1)) + offsety,
+                    'text': text,
+                    'valign':'center',
+                    'halign': align,
+                    'bordered': boxed,
+                    'tag':'scale'
+                });
+            }
+
+
+            /**
+            * Show the minimum value if its not zero
+            */
+            if (prop['chart.ymin'] != 0 || prop['chart.noxaxis'] || prop['chart.scale.zerostart']) {
+                RG.text2(this, {
+                    font:font,
+                    size:text_size,
+                    x:xpos + offsetx,
+                    y:ca.height - this.gutterBottom + offsety,
+                    text: RG.numberFormat(this,(this.scale2.min.toFixed((this.scale2.min === 0 ? 0 : prop['chart.scale.decimals']))), units_pre, units_post),
+                    valign:'center',
+                    halign: align,
+                    bordered: boxed,
+                    tag:'scale'
+                });
+            }
+
+            co.fill();
+        };
+
+
+        /**
+        * This function is used by MSIE only to manually draw the shadow
+        *
+        * @param array coords The coords for the bar
+        */
+        this.drawIEShadow =
+        this.DrawIEShadow = function (coords)
+        {
+            var co   = this.context;
+            var ca   = this.canvas;
+            var prop = this.properties;
+
+            var prevFillStyle = co.fillStyle;
+            var offsetx       = prop['chart.shadow.offsetx'];
+            var offsety       = prop['chart.shadow.offsety'];
+
+            co.lineWidth = prop['chart.linewidth'];
+            co.fillStyle = prop['chart.shadow.color'];
+            co.beginPath();
+
+            // Draw shadow here
+            co.fillRect(coords[0] + offsetx, coords[1] + offsety, coords[2], coords[3]);
+
+            co.fill();
+
+            // Change the fillstyle back to what it was
+            co.fillStyle = prevFillStyle;
+        };
+
+
+
+
+        /**
+        * Not used by the class during creating the graph, but is used by event handlers
+        * to get the coordinates (if any) of the selected bar
+        *
+        * @param object e The event object
+        * @param object   OPTIONAL You can pass in the bar object instead of the
+        *                          function using "this"
+        */
+        this.getShape =
+        this.getBar = function (e)
+        {
+            // This facilitates you being able to pass in the bar object as a parameter instead of
+            // the function getting it from itself
+            var obj = arguments[1] ? arguments[1] : this;
+
+            var mouseXY = RG.getMouseXY(e),
+                mouseX  = mouseXY[0],
+                mouseY  = mouseXY[1],
+                canvas  = obj.canvas,
+                context = obj.context,
+                coords  = obj.coords
+
+            for (var i=0,len=coords.length; i<len; i+=1) {
+
+                if (obj.coords[i].length == 0) {
+                    continue;
+                }
+
+                var left   = coords[i][0],
+                    top    = coords[i][1],
+                    width  = coords[i][2],
+                    height = coords[i][3],
+                    prop   = obj.properties
+
+                // Old way of testing
+                //if (mouseX >= left && mouseX <= (left + width) && mouseY >= top && mouseY <= (top + height)) {
+
+                // Recreate the path/rectangle so that it can be tested
+                //  ** DO NOT STROKE OR FILL IT **
+                if (prop['chart.tooltips.hotspot.xonly']) {
+                    pa2(co,
+                        'b r % % % %',
+                        left,
+                        this.gutterTop,
+                        width,
+                        ca.height - this.gutterBottom
+                    );
+                } else {
+                    pa2(co,
+                        'b r % % % %',
+                        left,
+                        top,
+                        width,
+                        height
+                    );
+                }
+
+                if (co.isPointInPath(mouseX, mouseY)) {
+
+
+                    if (prop['chart.tooltips']) {
+                        var tooltip = RG.parseTooltipText ? RG.parseTooltipText(prop['chart.tooltips'], i) : prop['chart.tooltips'][i];
+                    }
+
+                    // Work out the dataset
+                    var dataset = 0,
+                        idx     = i
+
+                    while (idx >=  (typeof obj.data[dataset] === 'object' && obj.data[dataset] ? obj.data[dataset].length : 1)) {
+
+                        if (typeof obj.data[dataset] === 'number') {
+                            idx -= 1;
+                        } else if (obj.data[dataset]) { // Accounts for null being an object
+                            idx -= obj.data[dataset].length;
+                        } else {
+                            idx -= 1;
+                        }
+
+                        dataset++;
+                    }
+
+                    if (typeof(obj.data[dataset]) == 'number') {
+                        idx = null;
+                    }
+
+
+                    return {
+                        0: obj, 1: left, 2: top, 3: width, 4: height, 5: i,
+                        'object': obj, 'x': left, 'y': top, 'width': width, 'height': height, 'index': i, 'tooltip': tooltip, 'index_adjusted': idx, 'dataset': dataset
+                    };
+                }
+            }
+
+            return null;
+        };
+
+
+
+
+        /**
+        * This retrives the bar based on the X coordinate only.
+        *
+        * @param object e The event object
+        * @param object   OPTIONAL You can pass in the bar object instead of the
+        *                          function using "this"
+        */
+        this.getShapeByX = function (e)
+        {
+            var canvas      = e.target;
+            var mouseCoords = RGraph.getMouseXY(e);
+
+
+            // This facilitates you being able to pass in the bar object as a parameter instead of
+            // the function getting it from itself
+            var obj = arguments[1] ? arguments[1] : this;
+
+
+            /**
+            * Loop through the bars determining if the mouse is over a bar
+            */
+            for (var i=0,len=obj.coords.length; i<len; i++) {
+
+                if (obj.coords[i].length == 0) {
+                    continue;
+                }
+
+                var mouseX = mouseCoords[0];
+                var mouseY = mouseCoords[1];
+                var left   = obj.coords[i][0];
+                var top    = obj.coords[i][1];
+                var width  = obj.coords[i][2];
+                var height = obj.coords[i][3];
+                var prop   = obj.properties;
+
+                if (mouseX >= left && mouseX <= (left + width)) {
+
+                    if (prop['chart.tooltips']) {
+                        var tooltip = RGraph.parseTooltipText ? RGraph.parseTooltipText(prop['chart.tooltips'], i) : prop['chart.tooltips'][i];
+                    }
+
+
+
+                    return {
+                            0: obj, 1: left, 2: top, 3: width, 4: height, 5: i,
+                            'object': obj, 'x': left, 'y': top, 'width': width, 'height': height, 'index': i, 'tooltip': tooltip
+                           };
+                }
+            }
+
+            return null;
+        };
+
+
+
+
+        /**
+        * When you click on the chart, this method can return the Y value at that point. It works for any point on the
+        * chart (that is inside the gutters) - not just points within the Bars.
+        *
+        * EITHER:
+        *
+        * @param object arg The event object
+        *
+        * OR:
+        *
+        * @param object arg A two element array containing the X and Y coordinates
+        */
+        this.getValue = function (arg)
+        {
+            var co   = this.context;
+            var ca   = this.canvas;
+            var prop = this.properties;
+
+            if (arg.length == 2) {
+                var mouseX = arg[0];
+                var mouseY = arg[1];
+            } else {
+                var mouseCoords = RG.getMouseXY(arg);
+                var mouseX      = mouseCoords[0];
+                var mouseY      = mouseCoords[1];
+            }
+
+            if (   mouseY < prop['chart.gutter.top']
+                || mouseY > (ca.height - prop['chart.gutter.bottom'])
+                || mouseX < prop['chart.gutter.left']
+                || mouseX > (ca.width - prop['chart.gutter.right'])
+               ) {
+                return null;
+            }
+
+            if (prop['chart.xaxispos'] == 'center') {
+                var value = (((this.grapharea / 2) - (mouseY - prop['chart.gutter.top'])) / this.grapharea) * (this.scale2.max - this.scale2.min)
+                value *= 2;
+
+                if (value >= 0) {
+                    value += this.scale2.min;
+                } else {
+                    value -= this.scale2.min;
+                }
+
+            } else if (prop['chart.xaxispos'] == 'top') {
+                var value = ((this.grapharea - (mouseY - prop['chart.gutter.top'])) / this.grapharea) * (this.scale2.max - this.scale2.min)
+                value = this.scale2.max - value;
+                value = ma.abs(value) * -1;
+            } else {
+                var value = ((this.grapharea - (mouseY - prop['chart.gutter.top'])) / this.grapharea) * (this.scale2.max - this.scale2.min)
+                value += this.scale2.min;
+            }
+
+
+
+
+            return value;
+        };
+
+
+        /**
+        * This function can be used when the canvas is clicked on (or similar - depending on the event)
+        * to retrieve the relevant Y coordinate for a particular value.
+        *
+        * @param int value The value to get the Y coordinate for
+        */
+        this.getYCoord = function (value)
+        {
+
+            if (value > this.scale2.max) {
+                return null;
+            }
+
+            var co   = this.context,
+                ca   = this.canvas,
+                prop = this.properties;
+
+            var y, xaxispos = prop['chart.xaxispos'];
+
+            if (xaxispos == 'top') {
+
+                // Account for negative numbers
+                if (value < 0) {
+                    value = ma.abs(value);
+                }
+
+                y = ((value - this.scale2.min) / (this.scale2.max - this.scale2.min)) * this.grapharea;
+                y = y + this.gutterTop
+
+            } else if (xaxispos == 'center') {
+
+                y = ((value - this.scale2.min) / (this.scale2.max - this.scale2.min)) * (this.grapharea / 2);
+                y = (this.grapharea / 2) - y;
+                y += this.gutterTop;
+
+            } else {
+
+                if (value < this.scale2.min) {
+                    value = this.scale2.min;
+                }
+
+                y  = ((value - this.scale2.min) / (this.scale2.max - this.scale2.min));
+                y *= (ca.height - this.gutterTop - this.gutterBottom);
+
+                y = ca.height - this.gutterBottom - y;
+            }
+
+            return y;
+        };
+
+
+
+        /**
+        * Each object type has its own Highlight() function which highlights the appropriate shape
+        *
+        * @param object shape The shape to highlight
+        */
+        this.highlight =
+        this.Highlight = function (shape)
+        {
+            if (typeof prop['chart.highlight.style'] === 'function') {
+                (prop['chart.highlight.style'])(shape);
+            } else {
+                // Add the new highlight
+                RG.Highlight.Rect(this, shape);
+            }
+        };
+
+
+
+        /**
+        * The getObjectByXY() worker method
+        */
+        this.getObjectByXY = function (e)
+        {
+            var mouseXY = RG.getMouseXY(e);
+
+            // Adjust the mouse Y coordinate for when the bar chart is
+            // a 3D variant
+            if (prop['chart.variant'] === '3d') {
+                var adjustment = prop['chart.variant.threed.angle'] * mouseXY[0];
+                mouseXY[1] -= adjustment;
+            }
+
+
+
+            if (
+                   mouseXY[0] >= prop['chart.gutter.left']
+                && mouseXY[0] <= (ca.width - prop['chart.gutter.right'])
+                && mouseXY[1] >= prop['chart.gutter.top']
+                && mouseXY[1] <= (ca.height - prop['chart.gutter.bottom'])
+                ) {
+
+                return this;
+            }
+        };
+
+
+
+
+        /**
+        * This method handles the adjusting calculation for when the mouse is moved
+        *
+        * @param object e The event object
+        */
+        this.adjusting_mousemove =
+        this.Adjusting_mousemove = function (e)
+        {
+            /**
+            * Handle adjusting for the Bar
+            */
+            if (prop['chart.adjustable'] && RG.Registry.Get('chart.adjusting') && RG.Registry.Get('chart.adjusting').uid == this.uid) {
+
+                // Rounding the value to the given number of decimals make the chart step
+                var value   = Number(this.getValue(e));
+                var shape   = RG.Registry.Get('chart.adjusting.shape')
+
+                if (shape) {
+
+                    RG.Registry.Set('chart.adjusting.shape', shape);
+
+                    if (this.stackedOrGrouped && prop['chart.grouping'] == 'grouped') {
+
+                        var indexes = RG.sequentialIndexToGrouped(shape['index'], this.data);
+
+                        if (typeof this.data[indexes[0]] == 'number') {
+                            this.data[indexes[0]] = Number(value);
+                        } else if (!RG.isNull(this.data[indexes[0]])) {
+                            this.data[indexes[0]][indexes[1]] = Number(value);
+                        }
+                    } else if (typeof this.data[shape['index']] == 'number') {
+
+                        this.data[shape['index']] = Number(value);
+                    }
+
+                    RG.redrawCanvas(e.target);
+                    RG.fireCustomEvent(this, 'onadjust');
+                }
+            }
+        };
+
+
+
+
+        /**
+        * This allows for easy specification of gradients
+        */
+        this.parseColors = function ()
+        {
+            // Save the original colors so that they can be restored when the canvas is reset
+            if (this.original_colors.length === 0) {
+                this.original_colors['chart.colors']                = RGraph.array_clone(prop['chart.colors']);
+                this.original_colors['chart.key.colors']            = RGraph.array_clone(prop['chart.key.colors']);
+                this.original_colors['chart.crosshairs.color']      = prop['chart.crosshairs.color'];
+                this.original_colors['chart.highlight.stroke']      = prop['chart.highlight.stroke'];
+                this.original_colors['chart.highlight.fill']        = prop['chart.highlight.fill'];
+                this.original_colors['chart.text.color']            = prop['chart.text.color'];
+                this.original_colors['chart.background.barcolor1']  = prop['chart.background.barcolor1'];
+                this.original_colors['chart.background.barcolor2']  = prop['chart.background.barcolor2'];
+                this.original_colors['chart.background.grid.color'] = prop['chart.background.grid.color'];
+                this.original_colors['chart.background.color']      = prop['chart.background.color'];
+                this.original_colors['chart.strokecolor']           = prop['chart.strokecolor'];
+                this.original_colors['chart.axis.color']            = prop['chart.axis.color'];
+            }
+
+
+            // chart.colors
+            var colors = prop['chart.colors'];
+            if (colors) {
+                for (var i=0; i<colors.length; ++i) {
+                    colors[i] = this.parseSingleColorForGradient(colors[i]);
+                }
+            }
+
+            // chart.key.colors
+            var colors = prop['chart.key.colors'];
+            if (colors) {
+                for (var i=0; i<colors.length; ++i) {
+                    colors[i] = this.parseSingleColorForGradient(colors[i]);
+                }
+            }
+
+             prop['chart.crosshairs.color']      = this.parseSingleColorForGradient(prop['chart.crosshairs.color']);
+             prop['chart.highlight.stroke']      = this.parseSingleColorForGradient(prop['chart.highlight.stroke']);
+             prop['chart.highlight.fill']        = this.parseSingleColorForGradient(prop['chart.highlight.fill']);
+             prop['chart.text.color']            = this.parseSingleColorForGradient(prop['chart.text.color']);
+             prop['chart.background.barcolor1']  = this.parseSingleColorForGradient(prop['chart.background.barcolor1']);
+             prop['chart.background.barcolor2']  = this.parseSingleColorForGradient(prop['chart.background.barcolor2']);
+             prop['chart.background.grid.color'] = this.parseSingleColorForGradient(prop['chart.background.grid.color']);
+             prop['chart.background.color']      = this.parseSingleColorForGradient(prop['chart.background.color']);
+             prop['chart.strokecolor']           = this.parseSingleColorForGradient(prop['chart.strokecolor']);
+             prop['chart.axis.color']            = this.parseSingleColorForGradient(prop['chart.axis.color']);
+        };
+
+
+
+
+        /**
+        * Use this function to reset the object to the post-constructor state. Eg reset colors if
+        * need be etc
+        */
+        this.reset = function ()
+        {
+        };
+
+
+
+        /**
+        * This parses a single color value
+        */
+        this.parseSingleColorForGradient = function (color)
+        {
+            if (!color || typeof(color) != 'string') {
+                return color;
+            }
+
+            if (color.match(/^gradient\((.*)\)$/i)) {
+
+                var parts = RegExp.$1.split(':');
+
+                // Create the gradient
+                var grad = co.createLinearGradient(0,ca.height - prop['chart.gutter.bottom'], 0, prop['chart.gutter.top']);
+
+                var diff = 1 / (parts.length - 1);
+
+                grad.addColorStop(0, RG.trim(parts[0]));
+
+                for (var j=1,len=parts.length; j<len; ++j) {
+                    grad.addColorStop(j * diff, RGraph.trim(parts[j]));
+                }
+            }
+
+            return grad ? grad : color;
+        };
+
+
+
+
+        this.drawBevel =
+        this.DrawBevel = function ()
+        {
+           var coords  = this.coords;
+           var coords2 = this.coords2;
+
+           var prop    = this.properties;
+           var co      = this.context;
+           var ca      = this.canvas;
+
+            if (prop['chart.grouping'] == 'stacked') {
+                for (var i=0; i<coords2.length; ++i) {
+                    if (coords2[i] && coords2[i][0] && coords2[i][0][0]) {
+
+                        var x = coords2[i][0][0];
+                        var y = coords2[i][0][1];
+                        var w = coords2[i][0][2];
+
+                        var arr = [];
+                        for (var j=0; j<coords2[i].length; ++j) {
+                            arr.push(coords2[i][j][3]);
+                        }
+                        var h = RGraph.array_sum(arr);
+
+
+                        co.save();
+
+                            co.strokeStyle = 'black';
+
+                            // Clip to the rect
+                            co.beginPath();
+                            co.rect(x, y, w, h);
+                            co.clip();
+
+                            // Add the shadow
+                            co.shadowColor = 'black';
+                            co.shadowOffsetX = 0;
+                            co.shadowOffsetY = 0;
+                            co.shadowBlur = 20;
+
+                            co.beginPath();
+                            co.rect(x - 3, y - 3, w + 6, h + 100);
+                            co.lineWidth = 5;
+                            co.stroke();
+                        co.restore();
+                    }
+                }
+            } else {
+
+                for (var i=0; i<coords.length; ++i) {
+                    if (coords[i]) {
+
+                        var x = coords[i][0];
+                        var y = coords[i][1];
+                        var w = coords[i][2];
+                        var h = coords[i][3];
+
+                        var xaxispos = prop['chart.xaxispos'];
+                        var xaxis_ycoord = ((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop;
+
+
+                        co.save();
+
+                            co.strokeStyle = 'black';
+
+                            // Clip to the rect
+                            co.beginPath();
+                            co.rect(x, y, w, h);
+
+                            co.clip();
+
+                            // Add the shadow
+                            co.shadowColor = 'black';
+                            co.shadowOffsetX = 0;
+                            co.shadowOffsetY = 0;
+                            co.shadowBlur =  20;
+
+                            if (xaxispos == 'top' || (xaxispos == 'center' && (y + h) > xaxis_ycoord)) {
+                                y = y - 100;
+                                h = h + 100;
+                            } else {
+                                y = y;
+                                h = h + 100;
+                            }
+
+                            co.beginPath();
+                                co.rect(x - 3, y - 3, w + 6, h + 6);
+                                co.lineWidth = 5;
+                            co.stroke();
+                        co.restore();
+                    }
+                }
+            }
+        };
+
+
+
+
+        /**
+        * This function handles highlighting an entire data-series for the interactive
+        * key
+        *
+        * @param int index The index of the data series to be highlighted
+        */
+        this.interactiveKeyHighlight = function (index)
+        {
+            this.coords2.forEach(function (value, idx, arr)
+            {
+                if (typeof value[index] == 'object' && value[index]) {
+
+                    var x = value[index][0]
+                    var y = value[index][1]
+                    var w = value[index][2]
+                    var h = value[index][3]
+
+                    co.fillStyle = prop['chart.key.interactive.highlight.chart.fill'];
+                    co.strokeStyle = prop['chart.key.interactive.highlight.chart.stroke'];
+                    co.lineWidth   = 2;
+                    co.strokeRect(x, y, w, h);
+                    co.fillRect(x, y, w, h);
+                }
+            });
+        };
+
+
+
+
+        /**
+        * Using a function to add events makes it easier to facilitate method chaining
+        *
+        * @param string   type The type of even to add
+        * @param function func
+        */
+        this.on = function (type, func)
+        {
+            if (type.substr(0,2) !== 'on') {
+                type = 'on' + type;
+              }
+
+            if (typeof this[type] !== 'function') {
+                this[type] = func;
+            } else {
+                RG.addCustomEventListener(this, type, func);
+            }
+
+            return this;
+        };
+
+
+
+
+        /**
+        * Draws the above labels
+        */
+        this.drawAboveLabels = function ()
+        {
+            var labels    = prop['chart.labels.above'],
+                specific  = prop['chart.labels.above.specific'],
+                color     = prop['chart.labels.above.color'],
+                background= prop['chart.labels.above.background'],
+                decimals  = prop['chart.labels.above.decimals'],
+                size      = prop['chart.labels.above.size'],
+                angle     = -1 * prop['chart.labels.above.angle'],
+                unitsPre  = prop['chart.labels.above.units.pre'],
+                unitsPost = prop['chart.labels.above.units.post'],
+                coords    = this.coords,
+                coords2   = this.coords2,
+                data      = this.data,
+                ldata     = RG.arrayLinearize(this.data),
+                offset    = prop['chart.labels.above.offset'],
+                text_font = prop['chart.text.font'],
+                text_size = prop['chart.text.size'],
+                grouping  = prop['chart.grouping']
+
+
+            // Turn off any shadow
+            RG.noShadow(this);
+
+            // Color
+            co.fillStyle = typeof color === 'string' ? color : prop['chart.text.color'];
+
+
+            // This bit draws the text labels that appear above the bars if requested
+            if (labels && grouping === 'grouped') {
+                for (var i=0,len=data.length,sequentialIndex=0; i<len; i+=1) {
+
+                    // Alignment for regular, positive bars
+                    if (typeof data[i] === 'number' && data[i] >= 0) {
+
+                        var angle  = angle;
+                        var halign = (angle ? 'left' : 'center');
+                        var valign = angle !== 0 ? 'center' : 'bottom';
+
+                        RG.text2(this, {
+                            'font': text_font,
+                            'size': typeof size === 'number' ? size : text_size - 3,
+                            'x': coords2[i][0][0] + (coords2[i][0][2] / 2),
+                            'y': coords2[i][0][1] - offset,
+                            'text': specific ? (specific[sequentialIndex] || '') : RG.numberFormat(this, Number(typeof data[i] === 'object' ? data[i][0] : data[i]).toFixed(decimals), unitsPre, unitsPost),
+                            'halign': halign,
+                            'valign': valign,
+                            'angle': angle,
+                            'marker': false,
+                            'bounding': true,
+                            'bounding.fill': background,
+                            'bounding.stroke': 'rgba(0,0,0,0)',
+                            'tag': 'labels.above'
+                        });
+
+                        sequentialIndex++;
+
+
+
+
+
+
+                    // Alignment for regular, negative bars
+                    } else if (typeof data[i] === 'number' && data[i] < 0) {
+
+                        var angle  = angle;
+                        var halign = angle ? 'right' : 'center';
+                        var valign = angle !== 0 ? 'center' : 'top';
+
+
+                        RG.text2(this, {
+                            'font': text_font,
+                            'size': typeof size === 'number' ? size : text_size - 3,
+                            'x': coords2[i][0][0] + (coords2[i][0][2] / 2),
+                            'y': coords2[i][0][1] + coords2[i][0][3] + offset,
+                            'text': specific ? (specific[sequentialIndex] || '') : RG.numberFormat(this, Number(typeof data[i] === 'object' ? data[i][0] : data[i]).toFixed(decimals), unitsPre, unitsPost),
+                            'halign': halign,
+                            'valign': valign,
+                            'angle': angle,
+                            'bounding': true,
+                            'bounding.fill': background,
+                            'bounding.stroke': 'rgba(0,0,0,0)',
+                            'marker': false,
+                            'tag': 'labels.above'
+                        });
+
+                        sequentialIndex++;
+
+
+
+
+
+
+                    // Alignment for grouped bars
+                    } else if (typeof data[i] === 'object') {
+
+                            for (var j=0,len2=data[i].length; j<len2; j+=1) {
+
+                                var angle  = angle;
+                                var halign = data[i][j] < 0 ? 'right' : 'left';
+                                    halign = angle === 0 ? 'center' : halign;
+                                var valign = data[i][j] < 0 ? 'top' : 'bottom';
+                                    valign = angle != 0 ? 'center' : valign;
+
+                                RG.text2(this, {
+                                    'font': text_font,
+                                    'size': typeof size === 'number' ? size : text_size - 3,
+                                    'x': coords2[i][j][0] + (coords2[i][j][2] / 2),
+                                    'y': coords2[i][j][1] + (data[i][j] < 0 ? coords2[i][j][3] + offset: -offset),
+                                    'text': specific ? (specific[sequentialIndex] || '') : RG.numberFormat(this, Number(data[i][j]).toFixed(decimals), unitsPre, unitsPost),
+                                    'halign': halign,
+                                    'valign': valign,
+                                    'angle': angle,
+                                    'bounding': true,
+                                    'bounding.fill': background,
+                                    'bounding.stroke': 'rgba(0,0,0,0)',
+                                    'marker': false,
+                                    'tag': 'labels.above'
+                                });
+                                sequentialIndex++;
+                            }
+                    }
+                }
+
+
+
+
+
+            /**
+            * STACKED bars
+            */
+            } else if (labels && grouping === 'stacked') {
+                for (var i=0,len=data.length,sequentialIndex=0; i<len; i+=1) {
+                    if (typeof data[i] === 'object') {
+
+                        var angle  = angle;
+                        var halign = angle != 0 ? 'left' : 'center';
+                        var valign = angle != 0 ? 'center' : 'bottom';
+
+                        RG.text2(this, {
+                            'font': text_font,
+                            'size': typeof size === 'number' ? size : text_size - 3,
+                            'x': coords2[i][0][0] + (coords2[i][0][2] / 2),
+                            'y': coords2[i][0][1] + (data[i][0] < 0 ? coords2[i][0][3] : 0) - offset,
+                            'text': specific ? (specific[sequentialIndex] || '') : RG.numberFormat(this, Number(RG.arraySum(data[i])).toFixed(decimals), unitsPre, unitsPost),
+                            'halign': halign,
+                            'valign': valign,
+                            'angle': angle,
+                            'bounding': true,
+                            'bounding.fill': background,
+                            'bounding.stroke': 'rgba(0,0,0,0)',
+                            'marker': false,
+                            'tag': 'labels.above'
+                        });
+
+                        sequentialIndex += data[i].length;
+
+                    /**
+                    * Regular numbers but in a stacked grouping
+                    */
+                    } else {
+
+                        var angle  = angle;
+                        var halign = angle != 0 ? 'left' : 'center';
+                        var valign = angle != 0 ? 'center' : 'bottom';
+
+                        RG.text2(this, {
+                            'font': text_font,
+                            'size': typeof size === 'number' ? size : text_size - 3,
+                            'x': coords2[i][0][0] + (coords2[i][0][2] / 2),
+                            'y': coords2[i][0][1] + (data[i][0] < 0 ? coords2[i][0][3] : 0) - offset,
+                            'text': specific ? (specific[sequentialIndex] || '') : RG.numberFormat(this, Number(data[i]).toFixed(decimals), unitsPre, unitsPost),
+                            'halign': halign,
+                            'valign': valign,
+                            'angle': angle,
+                            'bounding': true,
+                            'bounding.fill': background,
+                            'bounding.stroke': 'rgba(0,0,0,0)',
+                            'marker': false,
+                            'tag': 'labels.above'
+                        });
+
+                        sequentialIndex++;
+                    }
+                }
+            }
+        };
+
+
+
+
+        /**
+        * This function runs once only
+        */
+        this.firstDrawFunc = function ()
+        {
+        };
+
+
+
+
+        /**
+        * (new) Bar chart Wave effect. This is a rewrite that should be smoother
+        * because it just uses a single loop and not setTimeout
+        *
+        * @param object   OPTIONAL An object map of options. You specify 'frames' here to give the number of frames in the effect
+        * @param function OPTIONAL A function that will be called when the effect is complete
+        */
+        this.wave = function ()
+        {
+            var obj = this,
+                opt = arguments[0] || {},
+                labelsAbove = this.get('labelsAbove');
+
+            opt.frames =  opt.frames || 60;
+            opt.startFrames = [];
+            opt.counters    = [];
+
+            var framesperbar   = opt.frames / 3,
+                frame          = -1,
+                callback       = arguments[1] || function () {},
+                original       = RG.arrayClone(this.original_data);
+
+            //
+            // turn off the labelsAbove option whilst animating
+            //
+            this.set('labelsAbove', false);
+
+            for (var i=0,len=obj.data.length; i<len; i+=1) {
+                opt.startFrames[i] = ((opt.frames / 2) / (obj.data.length - 1)) * i;
+
+                if (typeof obj.data[i] === 'object' && obj.data[i]) {
+                    opt.counters[i] = [];
+                    for (var j=0; j<obj.data[i].length; j++) {
+                        opt.counters[i][j] = 0;
+                    }
+                } else {
+                    opt.counters[i]    = 0;
+                }
+            }
+
+            /**
+            * This stops the chart from jumping
+            */
+            obj.draw();
+            obj.Set('ymax', obj.scale2.max);
+            RG.clear(obj.canvas);
+
+            function iterator ()
+            {
+                ++frame;
+
+                for (var i=0,len=obj.data.length; i<len; i+=1) {
+                        if (frame > opt.startFrames[i]) {
+                            if (typeof obj.data[i] === 'number') {
+
+                                obj.data[i] = ma.min(
+                                    ma.abs(original[i]),
+                                    ma.abs(original[i] * ( (opt.counters[i]++) / framesperbar))
+                                );
+
+                                // Make the number negative if the original was
+                                if (original[i] < 0) {
+                                    obj.data[i] *= -1;
+                                }
+                            } else if (!RG.isNull(obj.data[i])) {
+                                for (var j=0,len2=obj.data[i].length; j<len2; j+=1) {
+
+                                    obj.data[i][j] = ma.min(
+                                        ma.abs(original[i][j]),
+                                        ma.abs(original[i][j] * ( (opt.counters[i][j]++) / framesperbar))
+                                    );
+
+                                    // Make the number negative if the original was
+                                    if (original[i][j] < 0) {
+                                        obj.data[i][j] *= -1;
+                                    }
+                                }
+                            }
+                        } else {
+                            obj.data[i] = typeof obj.data[i] === 'object' && obj.data[i] ? RG.arrayPad([], obj.data[i].length, 0) : (RG.isNull(obj.data[i]) ? null : 0);
+                        }
+                }
+
+
+                if (frame >= opt.frames) {
+
+                    if (labelsAbove) {
+                        obj.set('labelsAbove', true);
+                        RG.redraw();
+                    }
+
+                    callback(obj);
+                } else {
+                    RG.redrawCanvas(obj.canvas);
+                    RG.Effects.updateCanvas(iterator);
+                }
+            }
+
+            iterator();
+
+            return this;
+        };
+
+
+
+
+        /**
+        * Color Wave effect. This fades in color sequentially like the wave effect
+        * makes the bars grow.
+        *
+        * @param object   OPTIONAL An object map of options. You specify 'frames'
+        *                          here to give the number of frames in the effect
+        * @param function OPTIONAL A function that will be called when the effect
+        *                          is complete
+        */
+        this.colorWave = function ()
+        {
+            var obj = this,
+                opt = arguments[0] || {};
+                opt.frames =  opt.frames || 60;
+                opt.startFrames = [];
+                opt.counters    = [],
+                colors          = obj.properties['chart.colors'];
+
+            // If just one color is specified and colorsSequential is not, then
+            // pad the colors array out
+            if (colors.length <= obj.data.length) {
+                obj.set('chart.colors.sequential', true);
+                colors =  RG.arrayPad(colors, obj.data.length, colors[colors.length - 1]);
+            }
+
+            var framesperbar   = opt.frames / 2,
+                frame          = -1,
+                callback       = arguments[1] || function () {},
+                originalColors = RG.arrayClone(obj.properties['chart.colors']);
+
+
+
+            for (var i=0,len=originalColors.length; i<len; i+=1) {
+                opt.startFrames[i] = ((opt.frames / 2) / (originalColors.length - 1)) * i;
+                opt.counters[i]    = 0;
+            }
+
+
+            function iterator ()
+            {
+                ++frame;
+
+                for (var i=0,len=colors.length; i<len; i+=1) {
+                    if (frame > opt.startFrames[i] && colors[i].match(/^rgba?\(([0-9 ]+),([0-9 ]+),([0-9 ]+)(,([ 0-9.]+)?)\)/)) {
+
+                        // DO NOT USE SPACES!
+                        colors[i] = 'rgba({1},{2},{3},{4})'.format(
+                            RegExp.$1,
+                            RegExp.$2,
+                            RegExp.$3,
+                            (frame - opt.startFrames[i]) / framesperbar
+                        );
+                    } else {
+                        colors[i] = colors[i].replace(/,[0-9. ]+\)/, ',0)');
+                    }
+                }
+
+
+                if (frame >= opt.frames) {
+                    callback(obj);
+                } else {
+                    RG.redrawCanvas(obj.canvas);
+                    RG.Effects.updateCanvas(iterator);
+                }
+            }
+
+            iterator();
+
+            return this;
+        };
+
+
+
+
+        /**
+        * Grow
+        *
+        * The Bar chart Grow effect gradually increases the values of the bars
+        *
+        * @param object       An object of options - eg: {frames: 30}
+        * @param function     A function to call when the effect is complete
+        */
+        this.grow = function ()
+        {
+            // Callback
+            var opt         = arguments[0] || {},
+                frames      = opt.frames || 30,
+                frame       = 0,
+                callback    = arguments[1] || function () {},
+                obj         = this,
+                labelsAbove = this.get('labelsAbove')
+
+
+
+
+
+
+            // Go through the data and change string arguments of the format +/-[0-9]
+            // to absolute numbers
+            if (RG.isArray(opt.data)) {
+
+                var ymax = 0;
+
+                for (var i=0; i<opt.data.length; ++i) {
+                    if (typeof opt.data[i] === 'object') {
+                        for (var j=0; j<opt.data[i].length; ++j) {
+                            if (typeof opt.data[i][j] === 'string'&& opt.data[i][j].match(/(\+|\-)([0-9]+)/)) {
+                                if (RegExp.$1 === '+') {
+                                    opt.data[i][j] = this.original_data[i][j] + parseInt(RegExp.$2);
+                                } else {
+                                    opt.data[i][j] = this.original_data[i][j] - parseInt(RegExp.$2);
+                                }
+                            }
+
+                            ymax = ma.max(ymax, opt.data[i][j]);
+                        }
+                    } else if (typeof opt.data[i] === 'string' && opt.data[i].match(/(\+|\-)([0-9]+)/)) {
+                        if (RegExp.$1 === '+') {
+                            opt.data[i] = this.original_data[i] + parseInt(RegExp.$2);
+                        } else {
+                            opt.data[i] = this.original_data[i] - parseInt(RegExp.$2);
+                        }
+                        ymax = ma.max(ymax, opt.data[i]);
+                    } else {
+                        ymax = ma.max(ymax, opt.data[i]);
+                    }
+                }
+
+
+                var scale = RG.getScale2(this, {'max':ymax});
+                this.Set('chart.ymax', scale.max);
+            }
+
+
+
+
+
+
+            //
+            // turn off the labelsAbove option whilst animating
+            //
+            this.set('labelsAbove', false);
+
+
+
+
+
+
+            // Stop the scale from changing by setting chart.ymax (if it's not already set)
+            if (prop['chart.ymax'] == null) {
+
+                var ymax = 0;
+
+                for (var i=0; i<obj.data.length; ++i) {
+                    if (RG.isArray(this.data[i]) && prop['chart.grouping'] === 'stacked') {
+                        ymax = ma.max(ymax, ma.abs(RG.arraySum(this.data[i])));
+
+                    } else if (RG.isArray(this.data[i]) && prop['chart.grouping'] === 'grouped') {
+
+                        for (var j=0,group=[]; j<this.data[i].length; j++) {
+                            group.push(ma.abs(this.data[i][j]));
+                        }
+
+                        ymax = ma.max(ymax, ma.abs(RG.arrayMax(group)));
+
+                    } else {
+                        ymax = ma.max(ymax, ma.abs(this.data[i]));
+                    }
+                }
+
+                var scale = RG.getScale2(this, {'max':ymax});
+                this.Set('chart.ymax', scale.max);
+            }
+
+            // You can give a ymax to the grow function
+            if (typeof opt.ymax === 'number') {
+                obj.set('ymax', opt.ymax);
+            }
+
+
+
+            var iterator = function ()
+            {
+                var easingMultiplier = RG.Effects.getEasingMultiplier(frames, frame);
+
+                // Alter the Bar chart data depending on the frame
+                for (var j=0,len=obj.original_data.length; j<len; ++j) {
+                    if (typeof obj.data[j] === 'object' && !RG.isNull(obj.data[j])) {
+                        for (var k=0,len2=obj.data[j].length; k<len2; ++k) {
+                            if (obj.firstDraw || !opt.data) {
+                                obj.data[j][k] = easingMultiplier * obj.original_data[j][k];
+                            } else if (opt.data && opt.data.length === obj.original_data.length) {
+                                var diff    = opt.data[j][k] - obj.original_data[j][k];
+                                obj.data[j][k] = (easingMultiplier * diff) + obj.original_data[j][k];
+                            }
+                        }
+                    } else {
+
+                        if (obj.firstDraw || !opt.data) {
+                            obj.data[j] = easingMultiplier * obj.original_data[j];
+                        } else if (opt.data && opt.data.length === obj.original_data.length) {
+                            var diff    = opt.data[j] - obj.original_data[j];
+                            obj.data[j] = (easingMultiplier * diff) + obj.original_data[j];
+                        }
+                    }
+                }
+
+
+
+
+                //RGraph.clear(obj.canvas);
+                RG.redrawCanvas(obj.canvas);
+
+
+
+
+                if (frame < frames) {
+                    frame += 1;
+
+                    RG.Effects.updateCanvas(iterator);
+
+                // Call the callback function
+                } else {
+
+
+
+
+
+                    // Do some housekeeping if new data was specified thats done in
+                    // the constructor - but needs to be redone because new data
+                    // has been specified
+                    if (RG.isArray(opt.data)) {
+
+                        var linear_data = RG.arrayLinearize(data);
+
+                        for (var i=0; i<linear_data.length; ++i) {
+                            if (!obj['$' + i]) {
+                                obj['$' + i] = {};
+                            }
+                        }
+                    }
+
+
+
+                    obj.data = data;
+                    obj.original_data = RG.arrayClone(data);
+
+
+
+
+
+                    if (labelsAbove) {
+                        obj.set('labelsAbove', true);
+                        RG.redraw();
+                    }
+                    callback(obj);
+                }
+            };
+
+            iterator();
+
+            return this;
+        };
+
+
+
+
+        //
+        // Draws error-bars for the Bar and Line charts
+        //
+        this.drawErrorbars = function ()
+        {
+            var coords = this.coords,
+                 color = prop['chart.errorbars.color'] || 'black',
+     default_halfwidth = ma.min(prop['chart.errorbars.capped.width'], coords[0][2]) / 2,
+                     x = 0,
+             errorbars = prop['chart.errorbars'],
+                length = 0;
+
+
+            // If not capped set the width of the cqap to zero
+            if (!prop['chart.errorbars.capped']) {
+                prop['chart.errorbars.capped.width'] = 0;
+                halfwidth = 0;
+            }
+
+            // Set the linewidth
+            co.lineWidth = prop['chart.errorbars.linewidth'];
+
+
+
+
+            for (var i=0; i<coords.length; ++i) {
+
+
+                // Default to black
+                color = prop['chart.errorbars.color'] || 'black';
+
+                // Set the perbar linewidth if the fourth option in the array
+                // is specified
+                if (errorbars[i] && typeof errorbars[i][3] === 'number') {
+                    co.lineWidth = errorbars[i][3];
+                }
+
+                // Set the halfwidth
+                var halfwidth = (errorbars[i]&& typeof errorbars[i][4] === 'number') ? errorbars[i][4] / 2 : default_halfwidth;
+
+                if (!prop['chart.errorbars.capped']) {
+                    halfwidth = 0;
+                }
+
+
+
+                // Calulate the pixel size
+                if (typeof errorbars[i] === 'number') {
+
+                    length = ma.abs(this.getYCoord(errorbars[i]) - this.getYCoord(0));
+
+                    if (length) {
+                        pa2(
+                            co,
+                            'b m % % l % % l % % l % % s %',
+                            coords[i][0] + (coords[i][2] / 2),
+                            coords[i][1],
+                            coords[i][0] + (coords[i][2] / 2),
+                            coords[i][1] - length,
+                            coords[i][0] + (coords[i][2] / 2) - halfwidth,
+                            ma.round(coords[i][1] - length),
+                            coords[i][0] + (coords[i][2] / 2) + halfwidth,
+                            ma.round(coords[i][1] - length),
+                            color
+                        );
+                    }
+                } else if (typeof errorbars[i] === 'object' && !RG.isNull(errorbars[i])) {
+
+                    var positiveLength = ma.abs(this.getYCoord(errorbars[i][0]) - this.getYCoord(0));
+
+                    // Color
+                    if (typeof errorbars[i][1] === 'string') {
+                        color = errorbars[i][1];
+
+                    } else if (typeof errorbars[i][2] === 'string') {
+                        color = errorbars[i][2];
+                    }
+
+                    // Cap width
+                    halfwidth = typeof errorbars[i][4] === 'number' ? errorbars[i][4] / 2 : default_halfwidth;
+
+                    if (!prop['chart.errorbars.capped']) {
+                        halfwidth = 0;
+                    }
+
+                    if (!RG.isNull(errorbars[i][0])) {
+                        pa2(
+                            co,
+                            'b m % % l % % l % % l % % s %',
+                            coords[i][0] + (coords[i][2] / 2),
+                            coords[i][1],
+                            coords[i][0] + (coords[i][2] / 2),
+                            coords[i][1] - positiveLength,
+                            coords[i][0] + (coords[i][2] / 2) - halfwidth,
+                            ma.round(coords[i][1] - positiveLength),
+                            coords[i][0] + (coords[i][2] / 2) + halfwidth,
+                            ma.round(coords[i][1] - positiveLength),
+                            color
+                        );
+                    }
+
+                    if (typeof errorbars[i][1] === 'number') {
+
+                        var negativeLength = ma.abs(this.getYCoord(errorbars[i][1]) - this.getYCoord(0));
+
+                        pa2(
+                            co,
+                            'b m % % l % % l % % l % % s %',
+                            coords[i][0] + (coords[i][2] / 2),
+                            coords[i][1],
+                            coords[i][0] + (coords[i][2] / 2),
+                            coords[i][1] + negativeLength,
+                            coords[i][0] + (coords[i][2] / 2) - halfwidth,
+                            ma.round(coords[i][1] + negativeLength),
+                            coords[i][0] + (coords[i][2] / 2) + halfwidth,
+                            ma.round(coords[i][1] + negativeLength),
+                            color
+                        );
+                    }
+                }
+
+
+                // Reset the perbar linewidth to the default if the fourth option
+                // in the array was specified specified
+                if (errorbars[i] && typeof errorbars[i][3] === 'number') {
+                    co.lineWidth = prop['chart.errorbars.linewidth'];
+                }
+            }
+        };
+
+
+
+
+        //
+        // A per-object to test whether a particular bar is adjustable or not
+        //
+        // @param shape The shape object
+        //
+        this.isAdjustable = function (shape)
+        {
+            if (RG.isNull(prop['chart.adjustable.only']) || !RG.isArray(prop['chart.adjustable.only'])) {
+                return true;
+            }
+
+            if (RG.isArray(prop['chart.adjustable.only']) && prop['chart.adjustable.only'][shape.index]) {
+                return true;
+            }
+
+            return false;
+        };
+
+
+
+
+        /**
+        * Register the object
+        */
+        RG.register(this);
+
+
+
+
+        /**
+        * This is the 'end' of the constructor so if the first argument
+        * contains configuration dsta - handle that.
+        */
+        if (parseConfObjectForOptions) {
+            RG.parseObjectStyleConfig(this, conf.options);
+        }
+    };
+
+
+
+
+
+    /*********************************************************************************************************
+    * This is the combined bar and Line class which makes creating bar/line combo charts a little bit easier *
+    /*********************************************************************************************************/
+
+
+
+
+
+
+
+    RGraph.CombinedChart = function ()
+    {
+        /**
+        * Create a default empty array for the objects
+        */
+        this.objects = [];
+        var objects  = [];
+
+        if (RGraph.isArray(arguments[0])) {
+            objects = arguments[0];
+        } else {
+
+            for (var i=0; i<arguments.length; i+=1) {
+
+                objects[i] = arguments[i];
+            }
+        }
+
+        for (var i=0; i<objects.length; ++i) {
+
+            this.objects[i] = objects[i];
+
+            /**
+            * Set the Line chart gutters to match the Bar chart gutters
+            */
+            this.objects[i].set({
+                gutterLeft:   this.objects[0].get('gutter.left'), // Needs to use the dot form to skirt an IE9 bug
+                gutterRight:  this.objects[0].get('gutter.right'), // Needs to use the dot form to skirt an IE9 bug
+                gutterTop:    this.objects[0].get('gutter.top'), // Needs to use the dot form to skirt an IE9 bug
+                gutterBottom: this.objects[0].get('gutter.bottom') // Needs to use the dot form to skirt an IE9 bug
+            });
+
+            if (this.objects[i].type == 'line') {
+
+                var obj = this.objects[i];
+
+                /**
+                * Set the line chart hmargin
+                */
+                obj.set('hmargin', ((this.objects[0].canvas.width - this.objects[0].Get('chart.gutter.right') - this.objects[0].Get('chart.gutter.left')) / this.objects[0].data.length) / 2 );
+
+
+                /**
+                * No labels, axes or grid on the Line chart
+                */
+                obj.set('noaxes', true);
+                obj.set('backgroundGrid', false);
+                obj.set('ylabels', false);
+            }
+
+            /**
+            * Resizing
+            */
+            if (this.objects[i].get('chart.resizable')) {
+                var resizable_object = obj;
+            }
+        }
+
+        /**
+        * Resizing
+        */
+        if (resizable_object) {
+            /**
+            * This recalculates the Line chart hmargin when the chart is resized
+            */
+            function myOnresizebeforedraw (obj)
+            {
+                var gutterLeft  = obj.get('gutterLeft');
+                var gutterRight = obj.get('gutterRight');
+
+                obj.set('hmargin', (obj.canvas.width - gutterLeft - gutterRight) / (obj.original_data[0].length * 2));
+            }
+
+            RGraph.AddCustomEventListener(
+                resizable_object,
+                'onresizebeforedraw',
+                myOnresizebeforedraw
+            );
+        }
+    };
+
+
+
+
+    /**
+    * The Add method can be used to add methods to the CombinedChart object.
+    */
+    RGraph.CombinedChart.prototype.add =
+    RGraph.CombinedChart.prototype.Add = function (obj)
+    {
+        this.objects.push(obj);
+    };
+
+
+    /**
+    * The Draw method goes through all of the objects drawing them (sequentially)
+    */
+    RGraph.CombinedChart.prototype.draw =
+    RGraph.CombinedChart.prototype.Draw = function ()
+    {
+        for (var i=0; i<this.objects.length; ++i) {
+            if (this.objects[i].properties['chart.combinedchart.effect']) {
+
+                var options = this.objects[i].properties['chart.combinedchart.effect.options'] ? eval('(' + this.objects[i].properties['chart.combinedchart.effect.options'] + ')') : null;
+
+                (this.objects[i][this.objects[i].properties['chart.combinedchart.effect']])
+                (
+                    options,
+                    this.objects[i].properties['chart.combinedchart.effect.callback']
+                )
+            } else {
+                this.objects[i].draw();
+            }
+        }
+    };