diff --git a/examples/bar.html b/examples/bar.html
index eba7186..2209fa7 100644
--- a/examples/bar.html
+++ b/examples/bar.html
@@ -17,13 +17,13 @@ Morris.Bar({
element: 'graph',
data: [
{x: '2011 Q1', y: 3, z: 2, a: 3},
- {x: '2011 Q2', y: 2, z: 1, a: 1},
+ {x: '2011 Q2', y: 2, z: null, a: 1},
{x: '2011 Q3', y: 0, z: 2, a: 4},
- {x: '2011 Q4', y: 4, z: 4, a: 3}
+ {x: '2011 Q4', y: 2, z: 4, a: 3}
],
xkey: 'x',
ykeys: ['y', 'z', 'a'],
labels: ['Y', 'Z', 'A']
});
-
\ No newline at end of file
+
diff --git a/lib/morris.bar.coffee b/lib/morris.bar.coffee
index afd0479..f213b78 100644
--- a/lib/morris.bar.coffee
+++ b/lib/morris.bar.coffee
@@ -3,13 +3,11 @@ class Morris.Bar extends Morris.Grid
#
constructor: (options) ->
return new Morris.Bar(options) unless (@ instanceof Morris.Bar)
- super(options)
-
+ super($.extend {}, options, parseTime: false)
+
+ # setup event handlers
+ #
init: ->
- # Some instance variables for later
- @barFace = Raphael.animation opacity: @options.barHoverOpacity, 25, 'linear'
- @barDeface = Raphael.animation opacity: 1.0, 25, 'linear'
- # data hilight events
@prevHilight = null
@el.mousemove (evt) =>
@updateHilight evt.pageX
@@ -23,15 +21,13 @@ class Morris.Bar extends Morris.Grid
@el.bind 'touchstart', touchHandler
@el.bind 'touchmove', touchHandler
@el.bind 'touchend', touchHandler
-
+
# Default configuration
#
defaults:
- barSizeRatio: 0.5
+ barSizeRatio: 0.75
barGap: 3
- barStrokeWidths: [0]
- barStrokeColors: ['#ffffff']
- barFillColors: [
+ barColors: [
'#0b62a4'
'#7a92a3'
'#4da74d'
@@ -40,7 +36,6 @@ class Morris.Bar extends Morris.Grid
'#cb4b4b'
'#9440ed'
]
- barHoverOpacity: 0.95
hoverPaddingX: 10
hoverPaddingY: 5
hoverMargin: 10
@@ -51,65 +46,30 @@ class Morris.Bar extends Morris.Grid
hoverLabelColor: '#444'
hoverFontSize: 12
hideHover: false
- xLabels: 'auto'
- xLabelFormat: null
-
- # Override padding
- #
- # @private
- overridePadding: ->
- maxYLabelWidth = Math.max(
- @measureText(@yAxisFormat(@ymin), @options.gridTextSize).width,
- @measureText(@yAxisFormat(@ymax), @options.gridTextSize).width)
- @left = maxYLabelWidth + @paddingLeft
- @right = @elementWidth - @paddingRight
- @width = @right - @left
-
- xgap = @width / @data.length
- @barsoffset = @options.barSizeRatio * xgap / 2.0;
- @barwidth = (@options.barSizeRatio * xgap - ( @options.ykeys.length - 1 ) * @options.barGap ) / @options.ykeys.length
- @halfBarsWidth = Math.round( @options.ykeys.length / 2 ) * ( @barwidth + @options.barGap )
-
- @paddingLeft += @halfBarsWidth
- @paddingRight += @halfBarsWidth
-
+
# Do any size-related calculations
#
# @private
calc: ->
@calcBars()
- @generateBars()
@calcHoverMargins()
-
+
# calculate series data bars coordinates and sizes
#
# @private
calcBars: ->
- for row in @data
- row._x = @transX(row.x)
+ for row, idx in @data
+ row._x = @left + @width * (idx + 0.5) / @data.length
row._y = for y in row.y
- if y is null
- null
- else
- @transY(y)
-
+ if y is null then null else @transY(y)
+
# calculate hover margins
#
# @private
calcHoverMargins: ->
- @hoverMargins = $.map @data.slice(1), (r, i) => (r._x + @data[i]._x) / 2
-
- # generate bars for series
- #
- # @private
- generateBars: ->
- @bars = for i in [0..@options.ykeys.length]
- coords = ({x: r._x - @barsoffset + i * (@options.barGap + @barwidth) , y: r._y[i], v: r.y[i] } for r in @data when r._y[i] isnt null)
- if coords.length > 1
- @createBars i, coords, @barwidth
- else
- null
-
+ @hoverMargins = for i in [1...@data.length]
+ @left + i * @width / @data.length
+
# Draws the bar chart.
#
draw: ->
@@ -117,7 +77,7 @@ class Morris.Bar extends Morris.Grid
@drawSeries()
@drawHover()
@hilight(if @options.hideHover then null else @data.length - 1)
-
+
# draw the x-axis labels
#
# @private
@@ -126,8 +86,9 @@ class Morris.Bar extends Morris.Grid
ypos = @bottom + @options.gridTextSize * 1.25
xLabelMargin = 50 # make this an option?
prevLabelMargin = null
- drawLabel = (labelText, xpos) =>
- label = @r.text(@transX(xpos), ypos, labelText)
+ for i in [0...@data.length]
+ row = @data[@data.length - 1 - i]
+ label = @r.text(row._x, ypos, row.label)
.attr('font-size', @options.gridTextSize)
.attr('fill', @options.gridTextColor)
labelBox = label.getBBox()
@@ -138,54 +99,32 @@ class Morris.Bar extends Morris.Grid
prevLabelMargin = labelBox.x - xLabelMargin
else
label.remove()
- if @options.parseTime
- if @data.length == 1 and @options.xLabels == 'auto'
- # where there's only one value in the series, we can't make a
- # sensible guess for an x labelling scheme, so just use the original
- # column label
- labels = [[@data[0].label, @data[0].x]]
- else
- labels = Morris.labelSeries(@xmin, @xmax, @width, @options.xLabels, @options.xLabelFormat)
- else
- labels = ([row.label, row.x] for row in @data)
- labels.reverse()
- for l in labels
- drawLabel(l[0], l[1])
-
+
# draw the data series
#
# @private
drawSeries: ->
- @seriesBars = ([] for i in [0...@options.ykeys.length])
- for i in [@options.ykeys.length-1..0]
- bars = @bars[i]
- if bars.length > 0
- for bar in bars
- if bar isnt null
- rect = @r.rect(bar.x, bar.y, bar.width, bar.height)
- .attr('fill', bar.fill)
- .attr('stroke', @strokeForSeries(i))
- .attr('stroke-width', @strokeWidthForSeries(i))
+ groupWidth = @width / @options.data.length
+ numBars = @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
+ for ypos, sidx in row._y
+ if ypos != null
+ if zeroPos
+ top = Math.min(ypos, zeroPos)
+ bottom = Math.max(ypos, zeroPos)
else
- rect = null
- @seriesBars[i].push(rect)
-
- # create bars for a data series
- #
- # @private
- createBars: (index, coords, barwidth) ->
- bars = []
- for coord in coords
- bars.push(
- x: coord.x
- y: coord.y
- width: barwidth
- height: @bottom - coord.y
- fill: @colorForSeriesAndValue(index, coord.v)
- )
-
- return bars
-
+ top = ypos
+ bottom = @bottom
+ left = @left + idx * groupWidth + leftPadding + sidx * (barWidth + @options.barGap)
+ @r.rect(left, top, barWidth, bottom - top)
+ .attr('fill', @options.barColors[sidx % @options.barColors.length])
+ .attr('stroke-width', 0)
+ else
+ null
+
# draw the hover tooltip
#
# @private
@@ -206,8 +145,7 @@ class Morris.Bar extends Morris.Grid
@hoverSet.push(@xLabel)
@yLabels = []
for i in [0...@options.ykeys.length]
- idx = if @cumulative then (@options.ykeys.length - i - 1) else i
- yLabel = @r.text(0, @options.hoverFontSize * 1.5 * (idx + 1.5) - @hoverHeight / 2, '')
+ yLabel = @r.text(0, @options.hoverFontSize * 1.5 * (i + 1.5) - @hoverHeight / 2, '')
.attr('font-size', @options.hoverFontSize)
@yLabels.push(yLabel)
@hoverSet.push(yLabel)
@@ -218,7 +156,7 @@ class Morris.Bar extends Morris.Grid
row = @data[index]
@xLabel.attr('text', row.label)
for y, i in row.y
- @yLabels[i].attr('fill', @hoverColorForSeriesAndValue(i, y))
+ @yLabels[i].attr('fill', @options.barColors[i % @options.barColors.length])
@yLabels[i].attr('text', "#{@options.labels[i]}: #{@yLabelFormat(y)}")
# recalculate hover box width
maxLabelWidth = Math.max.apply null, $.map @yLabels, (l) ->
@@ -227,89 +165,26 @@ class Morris.Bar extends Morris.Grid
@hover.attr 'width', maxLabelWidth + @options.hoverPaddingX * 2
@hover.attr 'x', -@options.hoverPaddingX - maxLabelWidth / 2
# move to y pos
- yloc = Math.min.apply null, (y for y in row._y when y isnt null).concat(@bottom)
- if yloc > @hoverHeight + @options.hoverPaddingY * 2 + @options.hoverMargin + @top
- yloc = yloc - @hoverHeight / 2 - @options.hoverPaddingY - @options.hoverMargin
- else
- yloc = yloc + @hoverHeight / 2 + @options.hoverPaddingY + @options.hoverMargin
- yloc = Math.max @top + @hoverHeight / 2 + @options.hoverPaddingY, yloc
- yloc = Math.min @bottom - @hoverHeight / 2 - @options.hoverPaddingY, yloc
+ yloc = (@bottom + @top) / 2
xloc = Math.min @right - maxLabelWidth / 2 - @options.hoverPaddingX, @data[index]._x
xloc = Math.max @left + maxLabelWidth / 2 + @options.hoverPaddingX, xloc
@hoverSet.attr 'transform', "t#{xloc},#{yloc}"
-
+
# @private
hideHover: ->
@hoverSet.hide()
-
+
# @private
hilight: (index) =>
- if @prevHilight isnt null and @prevHilight isnt index
- for i in [0..@seriesBars.length-1]
- if @seriesBars[i][@prevHilight]
- @seriesBars[i][@prevHilight].animate @barDeface
if index isnt null and @prevHilight isnt index
- for i in [0..@seriesBars.length-1]
- if @seriesBars[i][index]
- @seriesBars[i][index].animate @barFace
@updateHover index
@prevHilight = index
if index is null
@hideHover()
-
+
# @private
updateHilight: (x) =>
x -= @el.offset().left
for hoverIndex in [0...@hoverMargins.length]
break if @hoverMargins[hoverIndex] > x
@hilight hoverIndex
-
- # @private
- strokeWidthForSeries: (index) ->
- @options.barStrokeWidths[index % @options.barStrokeWidths.length]
-
- # @private
- strokeForSeries: (index) ->
- @options.barStrokeColors[index % @options.barStrokeColors.length]
-
- # @private
- hoverColorForSeriesAndValue: (index, value) =>
- colorOrGradient = @colorForSeriesAndValue index, value
- if typeof colorOrGradient is 'string'
- return colorOrGradient.split('-').pop()
-
- return colorOrGradient
-
- # @private
- colorForSeriesAndValue: (index, value) =>
- color = @options.barFillColors[index % @options.barFillColors.length]
- if color.indexOf(' ') is -1
- return color
-
- color = color.split(/\s/)
-
- colorAt = (top, bottom, relPos) ->
- chan = (a, b) -> a + Math.round((b-a)*relPos)
- newColor =
- r: chan(top.r, bottom.r)
- g: chan(top.g, bottom.g)
- b: chan(top.b, bottom.b)
- return Raphael.color("rgb(#{newColor.r},#{newColor.g},#{newColor.b})")
-
- position = 1.0 - (value - @ymin) / (@ymax - @ymin)
- top = Raphael.color(color[0])
- bottom = Raphael.color(color[1])
-
- if color.length is 3
- bottom = Raphael.color(color[2])
- middle = Raphael.color(color[1])
- if position > 0.5
- start = colorAt(middle, bottom, 2 * (position - 0.5))
- return "90-#{bottom.hex}-#{start.hex}"
- else
- start = colorAt(top, middle, position * 2)
- middlepos = 100 - Math.round(100 * (0.5 - position) / (1.0 - position))
- return "90-#{bottom.hex}-#{middle.hex}:#{middlepos}-#{start.hex}"
-
- start = colorAt(top, bottom, position)
- return "90-#{bottom.hex}-#{start.hex}"
\ No newline at end of file
diff --git a/morris.js b/morris.js
index 3485ea3..f666446 100644
--- a/morris.js
+++ b/morris.js
@@ -228,7 +228,7 @@
};
Grid.prototype._calc = function() {
- var h, maxYLabelWidth, padding, w;
+ var h, maxYLabelWidth, w;
w = this.el.width();
h = this.el.height();
if (this.elementWidth !== w || this.elementHeight !== h || this.dirty) {
@@ -236,38 +236,11 @@
this.elementHeight = h;
this.dirty = false;
maxYLabelWidth = Math.max(this.measureText(this.yAxisFormat(this.ymin), this.options.gridTextSize).width, this.measureText(this.yAxisFormat(this.ymax), this.options.gridTextSize).width);
- if (typeof this.options.padding === 'string') {
- padding = this.options.padding.split(/\s+/);
- if (padding.length === 2) {
- this.paddingLeft = this.paddingRight = padding[1];
- this.paddingTop = this.paddingBottom = padding[0];
- } else if (padding.length === 3) {
- this.paddingLeft = this.paddingRight = padding[1];
- this.paddingTop = padding[0];
- this.paddingBottom = padding[2];
- } else if (padding.length === 4) {
- this.paddingTop = padding[0];
- this.paddingRight = padding[1];
- this.paddingBottom = padding[2];
- this.paddingLeft = padding[3];
- }
- } else {
- this.paddingTop = this.paddingBottom = this.options.padding;
- this.paddingLeft = this.paddingRight = this.options.padding;
- }
- this.gridPaddingRight = this.paddingRight;
- this.gridPaddingLeft = this.paddingLeft;
- if (this.overridePadding) {
- this.overridePadding();
- }
- this.left = maxYLabelWidth + this.paddingLeft;
- this.gridLeft = maxYLabelWidth + this.gridPaddingLeft;
- this.right = this.elementWidth - this.paddingRight;
- this.gridRight = this.elementWidth - this.gridPaddingRight;
- this.top = this.paddingTop;
- this.bottom = this.elementHeight - this.paddingBottom - 1.5 * this.options.gridTextSize;
+ this.left = maxYLabelWidth + this.options.padding;
+ this.right = this.elementWidth - this.options.padding;
+ this.top = this.options.padding;
+ this.bottom = this.elementHeight - this.options.padding - 1.5 * this.options.gridTextSize;
this.width = this.right - this.left;
- this.gridWidth = this.gridRight - this.gridLeft;
this.height = this.bottom - this.top;
this.dx = this.width / (this.xmax - this.xmin);
this.dy = this.height / (this.ymax - this.ymin);
@@ -306,8 +279,8 @@
for (lineY = _i = firstY, _ref = this.yInterval; firstY <= lastY ? _i <= lastY : _i >= lastY; lineY = _i += _ref) {
v = parseFloat(lineY.toFixed(this.precision));
y = this.transY(v);
- this.r.text(this.gridLeft - this.gridPaddingLeft / 2, y, this.yAxisFormat(v)).attr('font-size', this.options.gridTextSize).attr('fill', this.options.gridTextColor).attr('text-anchor', 'end');
- _results.push(this.r.path("M" + this.gridLeft + "," + y + "H" + (this.gridLeft + this.gridWidth)).attr('stroke', this.options.gridLineColor).attr('stroke-width', this.options.gridStrokeWidth));
+ this.r.text(this.left - this.options.padding / 2, y, this.yAxisFormat(v)).attr('font-size', this.options.gridTextSize).attr('fill', this.options.gridTextColor).attr('text-anchor', 'end');
+ _results.push(this.r.path("M" + this.left + "," + y + "H" + (this.left + this.width)).attr('stroke', this.options.gridLineColor).attr('stroke-width', this.options.gridStrokeWidth));
}
return _results;
};
@@ -953,10 +926,6 @@
__extends(Bar, _super);
function Bar(options) {
- this.colorForSeriesAndValue = __bind(this.colorForSeriesAndValue, this);
-
- this.hoverColorForSeriesAndValue = __bind(this.hoverColorForSeriesAndValue, this);
-
this.updateHilight = __bind(this.updateHilight, this);
this.hilight = __bind(this.hilight, this);
@@ -965,18 +934,14 @@
if (!(this instanceof Morris.Bar)) {
return new Morris.Bar(options);
}
- Bar.__super__.constructor.call(this, options);
+ Bar.__super__.constructor.call(this, $.extend({}, options, {
+ parseTime: false
+ }));
}
Bar.prototype.init = function() {
var touchHandler,
_this = this;
- this.barFace = Raphael.animation({
- opacity: this.options.barHoverOpacity
- }, 25, 'linear');
- this.barDeface = Raphael.animation({
- opacity: 1.0
- }, 25, 'linear');
this.prevHilight = null;
this.el.mousemove(function(evt) {
return _this.updateHilight(evt.pageX);
@@ -998,12 +963,9 @@
};
Bar.prototype.defaults = {
- barSizeRatio: 0.5,
+ barSizeRatio: 0.75,
barGap: 3,
- barStrokeWidths: [0],
- barStrokeColors: ['#ffffff'],
- barFillColors: ['#0b62a4', '#7a92a3', '#4da74d', '#afd8f8', '#edc240', '#cb4b4b', '#9440ed'],
- barHoverOpacity: 0.95,
+ barColors: ['#0b62a4', '#7a92a3', '#4da74d', '#afd8f8', '#edc240', '#cb4b4b', '#9440ed'],
hoverPaddingX: 10,
hoverPaddingY: 5,
hoverMargin: 10,
@@ -1013,38 +975,21 @@
hoverOpacity: 0.95,
hoverLabelColor: '#444',
hoverFontSize: 12,
- hideHover: false,
- xLabels: 'auto',
- xLabelFormat: null
- };
-
- Bar.prototype.overridePadding = function() {
- var maxYLabelWidth, xgap;
- maxYLabelWidth = Math.max(this.measureText(this.yAxisFormat(this.ymin), this.options.gridTextSize).width, this.measureText(this.yAxisFormat(this.ymax), this.options.gridTextSize).width);
- this.left = maxYLabelWidth + this.paddingLeft;
- this.right = this.elementWidth - this.paddingRight;
- this.width = this.right - this.left;
- xgap = this.width / this.data.length;
- this.barsoffset = this.options.barSizeRatio * xgap / 2.0;
- this.barwidth = (this.options.barSizeRatio * xgap - (this.options.ykeys.length - 1) * this.options.barGap) / this.options.ykeys.length;
- this.halfBarsWidth = Math.round(this.options.ykeys.length / 2) * (this.barwidth + this.options.barGap);
- this.paddingLeft += this.halfBarsWidth;
- return this.paddingRight += this.halfBarsWidth;
+ hideHover: false
};
Bar.prototype.calc = function() {
this.calcBars();
- this.generateBars();
return this.calcHoverMargins();
};
Bar.prototype.calcBars = function() {
- var row, y, _i, _len, _ref, _results;
+ var idx, row, y, _i, _len, _ref, _results;
_ref = this.data;
_results = [];
- for (_i = 0, _len = _ref.length; _i < _len; _i++) {
- row = _ref[_i];
- row._x = this.transX(row.x);
+ for (idx = _i = 0, _len = _ref.length; _i < _len; idx = ++_i) {
+ row = _ref[idx];
+ row._x = this.left + this.width * (idx + 0.5) / this.data.length;
_results.push(row._y = (function() {
var _j, _len1, _ref1, _results1;
_ref1 = row.y;
@@ -1064,39 +1009,12 @@
};
Bar.prototype.calcHoverMargins = function() {
- var _this = this;
- return this.hoverMargins = $.map(this.data.slice(1), function(r, i) {
- return (r._x + _this.data[i]._x) / 2;
- });
- };
-
- Bar.prototype.generateBars = function() {
- var coords, i, r;
- return this.bars = (function() {
+ var i;
+ return this.hoverMargins = (function() {
var _i, _ref, _results;
_results = [];
- for (i = _i = 0, _ref = this.options.ykeys.length; 0 <= _ref ? _i <= _ref : _i >= _ref; i = 0 <= _ref ? ++_i : --_i) {
- coords = (function() {
- var _j, _len, _ref1, _results1;
- _ref1 = this.data;
- _results1 = [];
- for (_j = 0, _len = _ref1.length; _j < _len; _j++) {
- r = _ref1[_j];
- if (r._y[i] !== null) {
- _results1.push({
- x: r._x - this.barsoffset + i * (this.options.barGap + this.barwidth),
- y: r._y[i],
- v: r.y[i]
- });
- }
- }
- return _results1;
- }).call(this);
- if (coords.length > 1) {
- _results.push(this.createBars(i, coords, this.barwidth));
- } else {
- _results.push(null);
- }
+ for (i = _i = 1, _ref = this.data.length; 1 <= _ref ? _i < _ref : _i > _ref; i = 1 <= _ref ? ++_i : --_i) {
+ _results.push(this.left + i * this.width / this.data.length);
}
return _results;
}).call(this);
@@ -1110,101 +1028,66 @@
};
Bar.prototype.drawXAxis = function() {
- var drawLabel, l, labels, prevLabelMargin, row, xLabelMargin, ypos, _i, _len, _results,
- _this = this;
+ var i, label, labelBox, prevLabelMargin, row, xLabelMargin, ypos, _i, _ref, _results;
ypos = this.bottom + this.options.gridTextSize * 1.25;
xLabelMargin = 50;
prevLabelMargin = null;
- drawLabel = function(labelText, xpos) {
- var label, labelBox;
- label = _this.r.text(_this.transX(xpos), ypos, labelText).attr('font-size', _this.options.gridTextSize).attr('fill', _this.options.gridTextColor);
- labelBox = label.getBBox();
- if ((prevLabelMargin === null || prevLabelMargin >= labelBox.x + labelBox.width) && labelBox.x >= 0 && (labelBox.x + labelBox.width) < _this.el.width()) {
- return prevLabelMargin = labelBox.x - xLabelMargin;
- } else {
- return label.remove();
- }
- };
- if (this.options.parseTime) {
- if (this.data.length === 1 && this.options.xLabels === 'auto') {
- labels = [[this.data[0].label, this.data[0].x]];
- } else {
- labels = Morris.labelSeries(this.xmin, this.xmax, this.width, this.options.xLabels, this.options.xLabelFormat);
- }
- } else {
- labels = (function() {
- var _i, _len, _ref, _results;
- _ref = this.data;
- _results = [];
- for (_i = 0, _len = _ref.length; _i < _len; _i++) {
- row = _ref[_i];
- _results.push([row.label, row.x]);
- }
- return _results;
- }).call(this);
- }
- labels.reverse();
_results = [];
- for (_i = 0, _len = labels.length; _i < _len; _i++) {
- l = labels[_i];
- _results.push(drawLabel(l[0], l[1]));
+ for (i = _i = 0, _ref = this.data.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
+ row = this.data[this.data.length - 1 - i];
+ label = this.r.text(row._x, ypos, row.label).attr('font-size', this.options.gridTextSize).attr('fill', this.options.gridTextColor);
+ labelBox = label.getBBox();
+ if ((prevLabelMargin === null || prevLabelMargin >= labelBox.x + labelBox.width) && labelBox.x >= 0 && (labelBox.x + labelBox.width) < this.el.width()) {
+ _results.push(prevLabelMargin = labelBox.x - xLabelMargin);
+ } else {
+ _results.push(label.remove());
+ }
}
return _results;
};
Bar.prototype.drawSeries = function() {
- var bar, bars, i, rect, _i, _ref, _results;
- this.seriesBars = (function() {
- var _i, _ref, _results;
+ var barWidth, bottom, groupWidth, idx, left, leftPadding, numBars, row, sidx, top, ypos, zeroPos;
+ groupWidth = this.width / this.options.data.length;
+ numBars = 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;
+ return this.bars = (function() {
+ var _i, _len, _ref, _results;
+ _ref = this.data;
_results = [];
- for (i = _i = 0, _ref = this.options.ykeys.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
- _results.push([]);
- }
- return _results;
- }).call(this);
- _results = [];
- for (i = _i = _ref = this.options.ykeys.length - 1; _ref <= 0 ? _i <= 0 : _i >= 0; i = _ref <= 0 ? ++_i : --_i) {
- bars = this.bars[i];
- if (bars.length > 0) {
+ for (idx = _i = 0, _len = _ref.length; _i < _len; idx = ++_i) {
+ row = _ref[idx];
_results.push((function() {
- var _j, _len, _results1;
+ var _j, _len1, _ref1, _results1;
+ _ref1 = row._y;
_results1 = [];
- for (_j = 0, _len = bars.length; _j < _len; _j++) {
- bar = bars[_j];
- if (bar !== null) {
- rect = this.r.rect(bar.x, bar.y, bar.width, bar.height).attr('fill', bar.fill).attr('stroke', this.strokeForSeries(i)).attr('stroke-width', this.strokeWidthForSeries(i));
+ for (sidx = _j = 0, _len1 = _ref1.length; _j < _len1; sidx = ++_j) {
+ ypos = _ref1[sidx];
+ if (ypos !== null) {
+ if (zeroPos) {
+ top = Math.min(ypos, zeroPos);
+ bottom = Math.max(ypos, zeroPos);
+ } else {
+ 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.options.barColors[sidx % this.options.barColors.length]).attr('stroke-width', 0));
} else {
- rect = null;
+ _results1.push(null);
}
- _results1.push(this.seriesBars[i].push(rect));
}
return _results1;
}).call(this));
- } else {
- _results.push(void 0);
}
- }
- return _results;
- };
-
- Bar.prototype.createBars = function(index, coords, barwidth) {
- var bars, coord, _i, _len;
- bars = [];
- for (_i = 0, _len = coords.length; _i < _len; _i++) {
- coord = coords[_i];
- bars.push({
- x: coord.x,
- y: coord.y,
- width: barwidth,
- height: this.bottom - coord.y,
- fill: this.colorForSeriesAndValue(index, coord.v)
- });
- }
- return bars;
+ return _results;
+ }).call(this);
};
Bar.prototype.drawHover = function() {
- var i, idx, yLabel, _i, _ref, _results;
+ var i, yLabel, _i, _ref, _results;
this.hoverHeight = this.options.hoverFontSize * 1.5 * (this.options.ykeys.length + 1);
this.hover = this.r.rect(-10, -this.hoverHeight / 2 - this.options.hoverPaddingY, 20, this.hoverHeight + this.options.hoverPaddingY * 2, 10).attr('fill', this.options.hoverFillColor).attr('stroke', this.options.hoverBorderColor).attr('stroke-width', this.options.hoverBorderWidth).attr('opacity', this.options.hoverOpacity);
this.xLabel = this.r.text(0, (this.options.hoverFontSize * 0.75) - this.hoverHeight / 2, '').attr('fill', this.options.hoverLabelColor).attr('font-weight', 'bold').attr('font-size', this.options.hoverFontSize);
@@ -1214,8 +1097,7 @@
this.yLabels = [];
_results = [];
for (i = _i = 0, _ref = this.options.ykeys.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
- idx = this.cumulative ? this.options.ykeys.length - i - 1 : i;
- yLabel = this.r.text(0, this.options.hoverFontSize * 1.5 * (idx + 1.5) - this.hoverHeight / 2, '').attr('font-size', this.options.hoverFontSize);
+ yLabel = this.r.text(0, this.options.hoverFontSize * 1.5 * (i + 1.5) - this.hoverHeight / 2, '').attr('font-size', this.options.hoverFontSize);
this.yLabels.push(yLabel);
_results.push(this.hoverSet.push(yLabel));
}
@@ -1230,7 +1112,7 @@
_ref = row.y;
for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
y = _ref[i];
- this.yLabels[i].attr('fill', this.hoverColorForSeriesAndValue(i, y));
+ this.yLabels[i].attr('fill', this.options.barColors[i % this.options.barColors.length]);
this.yLabels[i].attr('text', "" + this.options.labels[i] + ": " + (this.yLabelFormat(y)));
}
maxLabelWidth = Math.max.apply(null, $.map(this.yLabels, function(l) {
@@ -1239,25 +1121,7 @@
maxLabelWidth = Math.max(maxLabelWidth, this.xLabel.getBBox().width);
this.hover.attr('width', maxLabelWidth + this.options.hoverPaddingX * 2);
this.hover.attr('x', -this.options.hoverPaddingX - maxLabelWidth / 2);
- yloc = Math.min.apply(null, ((function() {
- var _j, _len1, _ref1, _results;
- _ref1 = row._y;
- _results = [];
- for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
- y = _ref1[_j];
- if (y !== null) {
- _results.push(y);
- }
- }
- return _results;
- })()).concat(this.bottom));
- if (yloc > this.hoverHeight + this.options.hoverPaddingY * 2 + this.options.hoverMargin + this.top) {
- yloc = yloc - this.hoverHeight / 2 - this.options.hoverPaddingY - this.options.hoverMargin;
- } else {
- yloc = yloc + this.hoverHeight / 2 + this.options.hoverPaddingY + this.options.hoverMargin;
- }
- yloc = Math.max(this.top + this.hoverHeight / 2 + this.options.hoverPaddingY, yloc);
- yloc = Math.min(this.bottom - this.hoverHeight / 2 - this.options.hoverPaddingY, yloc);
+ yloc = (this.bottom + this.top) / 2;
xloc = Math.min(this.right - maxLabelWidth / 2 - this.options.hoverPaddingX, this.data[index]._x);
xloc = Math.max(this.left + maxLabelWidth / 2 + this.options.hoverPaddingX, xloc);
return this.hoverSet.attr('transform', "t" + xloc + "," + yloc);
@@ -1268,20 +1132,7 @@
};
Bar.prototype.hilight = function(index) {
- var i, _i, _j, _ref, _ref1;
- if (this.prevHilight !== null && this.prevHilight !== index) {
- for (i = _i = 0, _ref = this.seriesBars.length - 1; 0 <= _ref ? _i <= _ref : _i >= _ref; i = 0 <= _ref ? ++_i : --_i) {
- if (this.seriesBars[i][this.prevHilight]) {
- this.seriesBars[i][this.prevHilight].animate(this.barDeface);
- }
- }
- }
if (index !== null && this.prevHilight !== index) {
- for (i = _j = 0, _ref1 = this.seriesBars.length - 1; 0 <= _ref1 ? _j <= _ref1 : _j >= _ref1; i = 0 <= _ref1 ? ++_j : --_j) {
- if (this.seriesBars[i][index]) {
- this.seriesBars[i][index].animate(this.barFace);
- }
- }
this.updateHover(index);
}
this.prevHilight = index;
@@ -1301,61 +1152,6 @@
return this.hilight(hoverIndex);
};
- Bar.prototype.strokeWidthForSeries = function(index) {
- return this.options.barStrokeWidths[index % this.options.barStrokeWidths.length];
- };
-
- Bar.prototype.strokeForSeries = function(index) {
- return this.options.barStrokeColors[index % this.options.barStrokeColors.length];
- };
-
- Bar.prototype.hoverColorForSeriesAndValue = function(index, value) {
- var colorOrGradient;
- colorOrGradient = this.colorForSeriesAndValue(index, value);
- if (typeof colorOrGradient === 'string') {
- return colorOrGradient.split('-').pop();
- }
- return colorOrGradient;
- };
-
- Bar.prototype.colorForSeriesAndValue = function(index, value) {
- var bottom, color, colorAt, middle, middlepos, position, start, top;
- color = this.options.barFillColors[index % this.options.barFillColors.length];
- if (color.indexOf(' ') === -1) {
- return color;
- }
- color = color.split(/\s/);
- colorAt = function(top, bottom, relPos) {
- var chan, newColor;
- chan = function(a, b) {
- return a + Math.round((b - a) * relPos);
- };
- newColor = {
- r: chan(top.r, bottom.r),
- g: chan(top.g, bottom.g),
- b: chan(top.b, bottom.b)
- };
- return Raphael.color("rgb(" + newColor.r + "," + newColor.g + "," + newColor.b + ")");
- };
- position = 1.0 - (value - this.ymin) / (this.ymax - this.ymin);
- top = Raphael.color(color[0]);
- bottom = Raphael.color(color[1]);
- if (color.length === 3) {
- bottom = Raphael.color(color[2]);
- middle = Raphael.color(color[1]);
- if (position > 0.5) {
- start = colorAt(middle, bottom, 2 * (position - 0.5));
- return "90-" + bottom.hex + "-" + start.hex;
- } else {
- start = colorAt(top, middle, position * 2);
- middlepos = 100 - Math.round(100 * (0.5 - position) / (1.0 - position));
- return "90-" + bottom.hex + "-" + middle.hex + ":" + middlepos + "-" + start.hex;
- }
- }
- start = colorAt(top, bottom, position);
- return "90-" + bottom.hex + "-" + start.hex;
- };
-
return Bar;
})(Morris.Grid);
diff --git a/morris.min.js b/morris.min.js
index e17c802..8e2314d 100644
--- a/morris.min.js
+++ b/morris.min.js
@@ -1 +1 @@
-(function(){var e,t,n,r,i=[].slice,s={}.hasOwnProperty,o=function(e,t){function r(){this.constructor=e}for(var n in t)s.call(t,n)&&(e[n]=t[n]);return r.prototype=t.prototype,e.prototype=new r,e.__super__=t.prototype,e},u=function(e,t){return function(){return e.apply(t,arguments)}},a=[].indexOf||function(e){for(var t=0,n=this.length;t