Tidy up grid option.

This commit is contained in:
Olly Smith 2012-12-20 07:44:32 +00:00
parent 672583b1e7
commit c82d335976
7 changed files with 32 additions and 30 deletions

View File

@ -7,6 +7,7 @@
<script src="lib/example.js"></script>
<link rel="stylesheet" href="lib/example.css">
<link rel="stylesheet" href="lib/prettify.css">
<link rel="stylesheet" href="../morris.css">
</head>
<body>
<h1>Bar charts</h1>
@ -15,7 +16,7 @@
// Use Morris.Bar
Morris.Bar({
element: 'graph',
gridEnabled: false,
grid: false,
data: [
{x: '2011 Q1', y: 3, z: 2, a: 3},
{x: '2011 Q2', y: 2, z: null, a: 1},

View File

@ -7,6 +7,7 @@
<script src="lib/example.js"></script>
<link rel="stylesheet" href="lib/example.css">
<link rel="stylesheet" href="lib/prettify.css">
<link rel="stylesheet" href="../morris.css">
</head>
<body>
<h1>Formatting Dates YYYY-MM-DD</h1>
@ -27,7 +28,7 @@ var day_data = [
];
Morris.Line({
element: 'graph',
gridEnabled: false,
grid: false,
data: day_data,
xkey: 'period',
ykeys: ['licensed', 'sorned'],

View File

@ -46,7 +46,7 @@ class Morris.Bar extends Morris.Grid
# Draws the bar chart.
#
draw: ->
@drawXAxis() if @options.gridEnabled
@drawXAxis() if @options.grid
@drawSeries()
# draw the x-axis labels
@ -122,7 +122,7 @@ class Morris.Bar extends Morris.Grid
hitTest: (x, y) ->
x = Math.max(Math.min(x, @right), @left)
Math.min(@data.length - 1,
Math.floor((x - @left) / ((@right - @left) / @data.length)))
Math.floor((x - @left) / (@width / @data.length)))
# hover movement event handler
#
@ -154,5 +154,5 @@ class Morris.Bar extends Morris.Grid
#{@yLabelFormat(y)}
</div>
"""
x = @left + (index + 0.5) * (@right - @left) / @data.length
x = @left + (index + 0.5) * @width / @data.length
[content, x]

View File

@ -59,7 +59,7 @@ class Morris.Grid extends Morris.EventEmitter
#
gridDefaults:
dateFormat: null
gridEnabled: true
grid: true
gridLineColor: '#aaa'
gridStrokeWidth: 0.5
gridTextColor: '#888'
@ -194,17 +194,17 @@ class Morris.Grid extends Morris.EventEmitter
@elementWidth = w
@elementHeight = h
@dirty = false
# calculate grid dimensions
maxYLabelWidth = 0
if @options.gridEnabled
# recalculate grid dimensions
@left = @options.padding
@right = @elementWidth - @options.padding
@top = @options.padding
@bottom = @elementHeight - @options.padding
if @options.grid
maxYLabelWidth = Math.max(
@measureText(@yAxisFormat(@ymin), @options.gridTextSize).width,
@measureText(@yAxisFormat(@ymax), @options.gridTextSize).width)
@left = maxYLabelWidth + @options.padding
@right = @elementWidth - @options.padding
@top = @options.padding
@bottom = @elementHeight - @options.padding;
@bottom -= 1.5 * @options.gridTextSize if @options.gridEnabled
@left += maxYLabelWidth
@bottom -= 1.5 * @options.gridTextSize if @options.grid
@width = @right - @left
@height = @bottom - @top
@dx = @width / (@xmax - @xmin)
@ -227,7 +227,7 @@ class Morris.Grid extends Morris.EventEmitter
redraw: ->
@r.clear()
@_calc()
@drawGrid() if @options.gridEnabled
@drawGrid() if @options.grid
@drawGoals()
@drawEvents()
@draw() if @draw

View File

@ -124,7 +124,7 @@ class Morris.Line extends Morris.Grid
# Draws the line chart.
#
draw: ->
@drawXAxis() if @options.gridEnabled
@drawXAxis() if @options.grid
@drawSeries()
if @options.hideHover is false
@displayHoverForRow(@data.length - 1)

View File

@ -117,7 +117,7 @@
Grid.prototype.gridDefaults = {
dateFormat: null,
gridEnabled: true,
grid: true,
gridLineColor: '#aaa',
gridStrokeWidth: 0.5,
gridTextColor: '#888',
@ -290,16 +290,16 @@
this.elementWidth = w;
this.elementHeight = h;
this.dirty = false;
maxYLabelWidth = 0;
if (this.options.gridEnabled) {
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.options.padding;
this.left = this.options.padding;
this.right = this.elementWidth - this.options.padding;
this.top = this.options.padding;
this.bottom = this.elementHeight - this.options.padding;
if (this.options.gridEnabled) {
this.bottom -= 1.5 * this.options.gridTextSize;
if (this.options.grid) {
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;
if (this.options.grid) {
this.bottom -= 1.5 * this.options.gridTextSize;
}
}
this.width = this.right - this.left;
this.height = this.bottom - this.top;
@ -326,7 +326,7 @@
Grid.prototype.redraw = function() {
this.r.clear();
this._calc();
if (this.options.gridEnabled) {
if (this.options.grid) {
this.drawGrid();
}
this.drawGoals();
@ -707,7 +707,7 @@
};
Line.prototype.draw = function() {
if (this.options.gridEnabled) {
if (this.options.grid) {
this.drawXAxis();
}
this.drawSeries();
@ -1158,7 +1158,7 @@
};
Bar.prototype.draw = function() {
if (this.options.gridEnabled) {
if (this.options.grid) {
this.drawXAxis();
}
return this.drawSeries();
@ -1253,7 +1253,7 @@
Bar.prototype.hitTest = function(x, y) {
x = Math.max(Math.min(x, this.right), this.left);
return Math.min(this.data.length - 1, Math.floor((x - this.left) / ((this.right - this.left) / this.data.length)));
return Math.min(this.data.length - 1, Math.floor((x - this.left) / (this.width / this.data.length)));
};
Bar.prototype.onHoverMove = function(x, y) {
@ -1281,7 +1281,7 @@
content += "<div class='morris-hover-point' style='color: " + (this.colorFor(row, j, 'label')) + "'>\n " + this.options.labels[j] + ":\n " + (this.yLabelFormat(y)) + "\n</div>";
}
}
x = this.left + (index + 0.5) * (this.right - this.left) / this.data.length;
x = this.left + (index + 0.5) * this.width / this.data.length;
return [content, x];
};

2
morris.min.js vendored

File diff suppressed because one or more lines are too long