Robot/morris.js
1
0
Fork 0
mirror of https://github.com/morrisjs/morris.js.git synced 2024-11-10 21:36:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #120 from dynaum/master

Browse Source 
Adding support to stacked bars
This commit is contained in:
Olly Smith 2012-12-02 13:06:53 -08:00
commit 691bd8d017
4 changed files with 57 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
examples/staked_bars.html Normal file
View File

@ -0,0 +1,30 @@
<!doctype html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://raw.github.com/DmitryBaranovskiy/raphael/300aa589f5a0ba7fce667cd62c7cdda0bd5ad904/raphael-min.js"></script>
<script src="../morris.js"></script>
<script src="lib/prettify.js"></script>
<script src="lib/example.js"></script>
<link rel="stylesheet" href="lib/example.css">
<link rel="stylesheet" href="lib/prettify.css">
</head>
<body>
<h1>Stacked Bars chart</h1>
<div id="graph"></div>
<pre id="code" class="prettyprint linenums">
// Use Morris.Bar
Morris.Bar({
element: 'graph',
data: [
{x: '2011 Q1', y: 3, z: 2, a: 3},
{x: '2011 Q2', y: 2, z: null, a: 1},
{x: '2011 Q3', y: 0, z: 2, a: 4},
{x: '2011 Q4', y: 2, z: 4, a: 3}
],
xkey: 'x',
ykeys: ['y', 'z', 'a'],
labels: ['Y', 'Z', 'A'],
stacked: true
});
</pre>
</body>

15
lib/morris.bar.coffee
View File

@ -8,6 +8,7 @@ class Morris.Bar extends Morris.Grid
# setup event handlers
#
init: ->
@cumulative = @options.stacked
@prevHilight = null
@el.mousemove (evt) =>
@updateHilight evt.pageX
@ -105,11 +106,12 @@ class Morris.Bar extends Morris.Grid
# @private
drawSeries: ->
groupWidth = @width / @options.data.length
numBars = @options.ykeys.length
numBars = if @options.stacked? then 1 else @options.ykeys.length
barWidth = (groupWidth * @options.barSizeRatio - @options.barGap * (numBars - 1)) / numBars
leftPadding = groupWidth * (1 - @options.barSizeRatio) / 2
zeroPos = if @ymin <= 0 and @ymax >= 0 then @transY(0) else null
@bars = for row, idx in @data
lastTop = 0
for ypos, sidx in row._y
if ypos != null
if zeroPos
@ -118,10 +120,17 @@ class Morris.Bar extends Morris.Grid
else
top = ypos
bottom = @bottom
left = @left + idx * groupWidth + leftPadding + sidx * (barWidth + @options.barGap)
@r.rect(left, top, barWidth, bottom - top)
left = @left + idx * groupWidth + leftPadding
left += sidx * (barWidth + @options.barGap) unless @options.stacked
size = bottom - top
top -= lastTop if @options.stacked
@r.rect(left, top, barWidth, size)
.attr('fill', @colorFor(row, sidx, 'bar'))
.attr('stroke-width', 0)
lastTop += size
else
null

18
morris.js
View File

@ -1033,6 +1033,7 @@
Bar.prototype.init = function() {
var touchHandler,
_this = this;
this.cumulative = this.options.stacked;
this.prevHilight = null;
this.el.mousemove(function(evt) {
return _this.updateHilight(evt.pageX);
@ -1138,9 +1139,9 @@
};
Bar.prototype.drawSeries = function() {
var barWidth, bottom, groupWidth, idx, left, leftPadding, numBars, row, sidx, top, ypos, zeroPos;
var barWidth, bottom, groupWidth, idx, lastTop, left, leftPadding, numBars, row, sidx, size, top, ypos, zeroPos;
groupWidth = this.width / this.options.data.length;
numBars = this.options.ykeys.length;
numBars = this.options.stacked != null ? 1 : this.options.ykeys.length;
barWidth = (groupWidth * this.options.barSizeRatio - this.options.barGap * (numBars - 1)) / numBars;
leftPadding = groupWidth * (1 - this.options.barSizeRatio) / 2;
zeroPos = this.ymin <= 0 && this.ymax >= 0 ? this.transY(0) : null;
@ -1150,6 +1151,7 @@
_results = [];
for (idx = _i = 0, _len = _ref.length; _i < _len; idx = ++_i) {
row = _ref[idx];
lastTop = 0;
_results.push((function() {
var _j, _len1, _ref1, _results1;
_ref1 = row._y;
@ -1164,8 +1166,16 @@
top = ypos;
bottom = this.bottom;
}
left = this.left + idx * groupWidth + leftPadding + sidx * (barWidth + this.options.barGap);
_results1.push(this.r.rect(left, top, barWidth, bottom - top).attr('fill', this.colorFor(row, sidx, 'bar')).attr('stroke-width', 0));
left = this.left + idx * groupWidth + leftPadding;
if (!this.options.stacked) {
left += sidx * (barWidth + this.options.barGap);
}
size = bottom - top;
if (this.options.stacked) {
top -= lastTop;
}
this.r.rect(left, top, barWidth, size).attr('fill', this.colorFor(row, sidx, 'bar')).attr('stroke-width', 0);
_results1.push(lastTop += size);
} else {
_results1.push(null);
}

2
morris.min.js vendored
View File

File diff suppressed because one or more lines are too long