diff --git a/dist/origami.js b/dist/origami.js
index a87c1c7..72cf68c 100644
--- a/dist/origami.js
+++ b/dist/origami.js
@@ -17,7 +17,7 @@
* You should have received a copy of the GNU General Public License
* along with this program. If not, see .
*
- * Date: 2016-10-29T20:51Z
+ * Date: 2017-10-30T17:49Z
*/
(function( window ) {
@@ -904,6 +904,186 @@ Origami.text = function(text, x, y, style) {
return this;
};
+function ChartBar(config) {
+ var ctx = this.paper.ctx,
+ width = this.paper.width,
+ height = this.paper.height;
+
+ if (config.frame)
+ ctx.clearRect(0, 0, this.paper.width, this.paper.height);
+
+ var animation = config.animation;
+
+ var xPadding = 40;
+ var yPadding = 40;
+ var sets = config.datasets;
+
+ var gridLines = {
+ vertical: true,
+ horizontal: true
+ };
+
+ function getMaxOfArray(numArray) {
+ return Math.max.apply(null, numArray);
+ }
+
+ function getMinOfArray(numArray) {
+ return Math.min.apply(null, numArray);
+ }
+
+ function getMaxAndMin() {
+ var max = 0,
+ min = 0;
+
+ for (var i = 0; i < config.datasets.length; i++) {
+ var biggest, lowest;
+ biggest = getMaxOfArray(config.datasets[i].data);
+ lowest = getMinOfArray(config.datasets[i].data);
+
+ if (biggest > max) {
+ max = biggest;
+ }
+ if (lowest < min) {
+ min = lowest;
+ }
+ }
+ return {
+ max: max,
+ min: min
+ };
+ }
+
+ var maxAndMin = getMaxAndMin();
+ var maxY = Math.round(maxAndMin.max);
+ var minY = Math.round(maxAndMin.min);
+
+ var xScale = Math.floor((width - (xPadding*3)/2))/config.labels.length;
+
+ function getXPixel(i) {
+ return xPadding + xScale * i;
+ }
+
+ var yRange = maxY - minY;
+ var unRoundedTickGap = yRange / 10;
+ var magnitude = Math.ceil(Math.log10(unRoundedTickGap));
+ var roundedTickGap = ( (Math.round(unRoundedTickGap / Math.pow(10,magnitude-1))/10) * Math.pow(10,magnitude));
+ var lowerBound = roundedTickGap * Math.floor(minY/roundedTickGap);
+ var upperBound = roundedTickGap * Math.floor(1 + maxY/roundedTickGap);
+ var yScale = (height - ((3/2)*yPadding))/(upperBound - lowerBound);
+
+ function getYPixel(val) {
+ return height - (yScale * (val - lowerBound) + yPadding);
+ }
+
+ var gridLinesColor = '#e7e7e7';
+ if (config.gridLinesColor) {
+ gridLinesColor = config.gridLinesColor;
+ }
+
+ if (config.gridLines) {
+ if (config.gridLines.vertical === false)
+ gridLines.vertical = false;
+
+ if (config.gridLines.horizontal === false)
+ gridLines.horizontal = false;
+ }
+
+ ctx.fillStyle = '#5e5e5e';
+ if (config.labelColor) {
+ ctx.fillStyle = config.labelColor;
+ }
+
+ ctx.font = 'normal 11px Helvetica';
+ ctx.globalAlpha = 1;
+
+ // axes
+ ctx.beginPath();
+ ctx.strokeStyle=gridLinesColor;
+ ctx.lineWidth = 1.6;
+ ctx.moveTo(xPadding,yPadding/2);
+ ctx.lineTo(xPadding,height - yPadding);
+ ctx.lineTo(width - xPadding/2, height - yPadding);
+ ctx.stroke();
+
+ // vertical gridlines and label
+ ctx.textAlign = "center";
+ ctx.textBaseline = "alphabetic";
+ for (var i=0;i 1)
+ var barSpacing = parseFloat((0.15 * (getXPixel(1) - getXPixel(0)))/(config.datasets.length - 1));
+ else
+ var barSpacing = 0;
+
+ // drawing bars
+ for (var i=0;i max) {
- max = m;
+ var biggest, lowerst;
+ if (typeof(sets[i].data[0]) === 'object') {
+ biggest = getMaxOfArray(sets[i].data.map(function(x){
+ return x[1]
+ }));
+ lowerst = getMinOfArray(sets[i].data.map(function(x){
+ return x[1]
+ }));
+ } else {
+ biggest = getMaxOfArray(sets[i].data);
+ lowerst = getMinOfArray(sets[i].data);
+ }
+ if (biggest > max) {
+ max = biggest;
+ }
+ if (lowerst < min) {
+ min = lowerst;
}
}
+
max += yPadding - max % 10;
- return max;
+ min -= yPadding + min % 10;
+ return {
+ max: max,
+ min: min
+ };
}
function getXPixel(val) {
- return ((width - xPadding) / config.labels.length) * val + xPadding;
+ return parseFloat(((width - xPadding) / config.labels.length) * val + xPadding);
}
function getYPixel(val) {
- return height - (((height - yPadding) / getMaxY()) * val) - yPadding;
+ var scale = maxY / (maxY - minY);
+ return parseFloat((height - (((height - yPadding) / maxY) * val)) * scale);
}
if (animation) {
@@ -1048,8 +1257,11 @@ function ChartLine(config) {
ctx.strokeStyle = line.borderColor;
ctx.moveTo(getXPixel(0), getYPixel(set.data[0]));
- for (var x = 1; x < set.data.length; x++) {
- ctx.lineTo(getXPixel(x), getYPixel(set.data[x]));
+ for (var x = 0; x < set.data.length; x++) {
+ if (typeof(set.data[x]) === 'object')
+ ctx.lineTo(getXPixel(set.data[x][0]), getYPixel(set.data[x][1]));
+ else
+ ctx.lineTo(getXPixel(x), getYPixel(set.data[x]));
}
ctx.stroke();
@@ -1068,7 +1280,11 @@ function ChartLine(config) {
for (var z = 0; z < set.data.length; z++) {
ctx.beginPath();
ctx.fillStyle = (set.pointsColor) ? set.pointsColor : 'rgb(75,75,75)';
- ctx.arc(getXPixel(z), getYPixel(set.data[z]), 4, 0, Math.PI * 2, true);
+ if (typeof(set.data[z]) === 'object')
+ ctx.arc(getXPixel(set.data[z][0]), getYPixel(set.data[z][1]), 4, 0, Math.PI * 2, true);
+ else
+ ctx.arc(getXPixel(z), getYPixel(set.data[z]), 4, 0, Math.PI * 2, true);
+
ctx.fill();
ctx.closePath();
ctx.beginPath();
diff --git a/dist/origami.min.js b/dist/origami.min.js
index 9899409..b228f8f 100644
--- a/dist/origami.min.js
+++ b/dist/origami.min.js
@@ -1,2 +1,2 @@
-!function(a){function b(a,b,c){this.paper.queue.push({assign:a,params:b,loaded:c})}function c(a,b){for(var c=0;c',e=a.URL||a.webkitURL||a,f=new Image,g=new Blob([d],{type:"image/svg+xml;charset=utf-8"}),h=e.createObjectURL(g);return f.src=h,f.addEventListener("load",function(){c.paper.ctx.beginPath(),c.paper.ctx.drawImage(f,0,0),e.revokeObjectURL(h),c.paper.ctx.closePath()}),c}function s(a){var b=a.properties,c=a.width/b.frames;t.call(this,{image:a.image,posX:b.currentFrame>0&&b.currentFrame<=b.frames?c*(b.currentFrame-1):0,posY:0,animation:b.animation,frame:b.frames,loop:b.loop,width:c,widthTotal:a.width,height:a.height,dx:a.x,dy:a.y,speed:b.speed,update:null})}function t(b){var c=this;if(b.posX===b.widthTotal){if(!b.loop)return void a.cancelAnimationFrame(b.update);b.posX=0}c.paper.ctx.clearRect(b.dx,b.dy,b.width,b.height),c.paper.ctx.beginPath(),c.paper.ctx.drawImage(b.image,b.posX,b.posY,b.width,b.height,b.dx,b.dy,b.width,b.height),c.paper.ctx.closePath(),b.animation&&(b.posX=b.posX+b.width),setTimeout(function(){b.update=a.requestAnimationFrame(t.bind(c,b))},b.speed)}function u(a){var b=x.defaults.text,c=a.text,d=a.x,e=a.y,f=a.style;this.paper.ctx.beginPath(),this.paper.ctx.setLineDash(f.borderStyle),this.paper.ctx.textBaseline="middle",this.paper.ctx.lineWidth=f.borderSize?f.borderSize:b.lineWidth,this.paper.ctx.strokeStyle=f.borderColor?f.borderColor:b.strokeStyle,this.paper.ctx.font=f.font||b.font,this.paper.ctx.fillStyle=f.color||b.color,this.paper.ctx.textAlign=f.align||b.align,this.paper.ctx.fillText(c,d,e),this.paper.ctx.strokeText(c,d,e),this.paper.ctx.fill(),this.paper.ctx.stroke(),this.paper.ctx.setLineDash([]),this.paper.ctx.closePath()}function v(a){function b(a){return Math.max.apply(null,a)}function c(){for(var a=0,c=0;ca&&(a=d)}return a+=n-a%10}function d(b){return(i-m)/a.labels.length*b+m}function f(a){return j-(j-n)/c()*a-n}function g(a,b){return Math.random()*(b-a)+a}var h=this.paper.ctx,i=this.paper.width,j=this.paper.height;a.frame&&h.clearRect(0,0,this.paper.width,this.paper.height);var k=2,l=a.animation;a.props||(a.props={alpha:1});var m=40,n=40,o=a.datasets,p={vertical:!0,horizontal:!0},q="#e7e7e7";a.gridLinesColor&&(q=a.gridLinesColor),a.gridLines&&(a.gridLines.vertical===!1&&(p.vertical=!1),a.gridLines.horizontal===!1&&(p.horizontal=!1)),h.fillStyle="#5e5e5e",a.labelColor&&(h.fillStyle=a.labelColor),h.font="normal 11px Helvetica",h.globalAlpha=1,h.textAlign="left",h.textBaseline="alphabetic";for(var r=0;r',e=a.URL||a.webkitURL||a,f=new Image,g=new Blob([d],{type:"image/svg+xml;charset=utf-8"}),h=e.createObjectURL(g);return f.src=h,f.addEventListener("load",function(){c.paper.ctx.beginPath(),c.paper.ctx.drawImage(f,0,0),e.revokeObjectURL(h),c.paper.ctx.closePath()}),c}function s(a){var b=a.properties,c=a.width/b.frames.total,d=b.frames,e=0;d.current&&d.current<=d.total&&(e=c*(d.current-1)),t.call(this,{image:a.image,posX:e,posY:0,frames:b.frames,animation:b.animation,loop:b.loop,width:c,widthTotal:a.width,height:a.height,dx:a.x,dy:a.y,speed:b.speed,update:null})}function t(b){var c=this;if(b.posX===b.widthTotal){if(b.loop!==!0)return void a.cancelAnimationFrame(b.update);b.posX=0}c.paper.ctx.clearRect(b.dx,b.dy,b.width,b.height),c.paper.ctx.beginPath(),c.paper.ctx.drawImage(b.image,b.posX,b.posY,b.width,b.height,b.dx,b.dy,b.width,b.height),c.paper.ctx.closePath(),b.animation!==!1&&(b.posX=b.posX+b.width),setTimeout(function(){b.update=a.requestAnimationFrame(t.bind(c,b))},b.speed)}function u(a){var b=y.defaults.text,c=a.text,d=a.x,e=a.y,f=a.style;this.paper.ctx.beginPath(),this.paper.ctx.setLineDash(f.borderStyle),this.paper.ctx.textBaseline="middle",this.paper.ctx.lineWidth=f.borderSize?f.borderSize:b.lineWidth,this.paper.ctx.strokeStyle=f.borderColor?f.borderColor:b.strokeStyle,this.paper.ctx.font=f.font||b.font,this.paper.ctx.fillStyle=f.color||b.color,this.paper.ctx.textAlign=f.align||b.align,this.paper.ctx.fillText(c,d,e),this.paper.ctx.strokeText(c,d,e),this.paper.ctx.fill(),this.paper.ctx.stroke(),this.paper.ctx.setLineDash([]),this.paper.ctx.closePath()}function v(a){function b(a){return Math.max.apply(null,a)}function c(a){return Math.min.apply(null,a)}function d(){for(var d=0,e=0,f=0;fd&&(d=g),h1)var B=parseFloat(.15*(e(1)-e(0))/(a.datasets.length-1));else var B=0;for(var y=0;ya&&(a=f),g max) {
+ max = biggest;
+ }
+ if (lowest < min) {
+ min = lowest;
+ }
+ }
+ return {
+ max: max,
+ min: min
+ };
+ }
+
+ var maxAndMin = getMaxAndMin();
+ var maxY = Math.round(maxAndMin.max);
+ var minY = Math.round(maxAndMin.min);
+
+ var xScale = Math.floor((width - (xPadding*3)/2))/config.labels.length;
+
+ function getXPixel(i) {
+ return xPadding + xScale * i;
+ }
+
+ var yRange = maxY - minY;
+ var unRoundedTickGap = yRange / 10;
+ var magnitude = Math.ceil(Math.log10(unRoundedTickGap));
+ var roundedTickGap = ( (Math.round(unRoundedTickGap / Math.pow(10,magnitude-1))/10) * Math.pow(10,magnitude));
+ var lowerBound = roundedTickGap * Math.floor(minY/roundedTickGap);
+ var upperBound = roundedTickGap * Math.floor(1 + maxY/roundedTickGap);
+ var yScale = (height - ((3/2)*yPadding))/(upperBound - lowerBound);
+
+ function getYPixel(val) {
+ return height - (yScale * (val - lowerBound) + yPadding);
+ }
+
+ var gridLinesColor = '#e7e7e7';
+ if (config.gridLinesColor) {
+ gridLinesColor = config.gridLinesColor;
+ }
+
+ if (config.gridLines) {
+ if (config.gridLines.vertical === false)
+ gridLines.vertical = false;
+
+ if (config.gridLines.horizontal === false)
+ gridLines.horizontal = false;
+ }
+
+ ctx.fillStyle = '#5e5e5e';
+ if (config.labelColor) {
+ ctx.fillStyle = config.labelColor;
+ }
+
+ ctx.font = 'normal 11px Helvetica';
+ ctx.globalAlpha = 1;
+
+ // axes
+ ctx.beginPath();
+ ctx.strokeStyle=gridLinesColor;
+ ctx.lineWidth = 1.6;
+ ctx.moveTo(xPadding,yPadding/2);
+ ctx.lineTo(xPadding,height - yPadding);
+ ctx.lineTo(width - xPadding/2, height - yPadding);
+ ctx.stroke();
+
+ // vertical gridlines and label
+ ctx.textAlign = "center";
+ ctx.textBaseline = "alphabetic";
+ for (var i=0;i 1)
+ var barSpacing = parseFloat((0.15 * (getXPixel(1) - getXPixel(0)))/(config.datasets.length - 1));
+ else
+ var barSpacing = 0;
+
+ // drawing bars
+ for (var i=0;i