mirror of
https://github.com/morrisjs/morris.js.git
synced 2024-11-10 21:36:34 +01:00
Tidy up grid option.
This commit is contained in:
parent
672583b1e7
commit
c82d335976
@ -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},
|
||||
|
@ -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'],
|
||||
|
@ -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]
|
||||
|
@ -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
|
||||
|
@ -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)
|
||||
|
26
morris.js
26
morris.js
@ -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
2
morris.min.js
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user