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

Added parseTime option to allow non-date parsing line charts

Browse Source
This commit is contained in:
Kefan Xie 2012-03-04 17:31:26 -05:00
parent 8446be205e
commit df38727182
2 changed files with 43 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
example.html
View File

@ -114,4 +114,31 @@
}); });
}); });
</script> </script>
<h3>Formatting Non-date Arbitrary X-axis</h3>
<div id="graph-random" class="graph"></div>
<script>
$(function () {
var day_data = [
{"elapsed": "I", "value": 34},
{"elapsed": "II", "value": 24},
{"elapsed": "III", "value": 3},
{"elapsed": "IV", "value": 12},
{"elapsed": "V", "value": 13},
{"elapsed": "VI", "value": 22},
{"elapsed": "VII", "value": 5},
{"elapsed": "VIII", "value": 26},
{"elapsed": "IX", "value": 12},
{"elapsed": "X", "value": 19},
];
Morris.Line({
element: 'graph-random',
data: day_data,
xkey: 'elapsed',
ykeys: ['value'],
labels: ['value'],
parseTime: false
});
});
</script>
</body> </body>

20
morris.js
View File

@ -44,7 +44,8 @@
hoverOpacity: 0.95, hoverOpacity: 0.95,
hoverLabelColor: '#444', hoverLabelColor: '#444',
hoverFontSize: 12, hoverFontSize: 12,
smooth: true smooth: true,
parseTime: true
}; };
Line.prototype.precalc = function() { Line.prototype.precalc = function() {
@ -65,9 +66,16 @@
return d[ykey]; return d[ykey];
})); }));
} }
this.xvals = $.map(this.columnLabels, function(x) { if (_this.options.parseTime) {
return _this.parseYear(x); this.xvals = $.map(this.columnLabels, function(x) {
}); return _this.parseYear(x);
});
} else {
this.xvals = [];
for (_i = this.columnLabels.length - 1; _i >= 0; _i--) {
this.xvals.push(_i);
}
}
this.xmin = Math.min.apply(null, this.xvals); this.xmin = Math.min.apply(null, this.xvals);
this.xmax = Math.max.apply(null, this.xvals); this.xmax = Math.max.apply(null, this.xvals);
if (this.xmin === this.xmax) { if (this.xmin === this.xmax) {
@ -115,6 +123,10 @@
xLabelMargin = 50; xLabelMargin = 50;
for (i = _ref2 = Math.ceil(this.xmin), _ref3 = Math.floor(this.xmax); _ref2 <= _ref3 ? i <= _ref3 : i >= _ref3; _ref2 <= _ref3 ? i++ : i--) { for (i = _ref2 = Math.ceil(this.xmin), _ref3 = Math.floor(this.xmax); _ref2 <= _ref3 ? i <= _ref3 : i >= _ref3; _ref2 <= _ref3 ? i++ : i--) {
label = this.r.text(transX(i), this.options.marginTop + height + this.options.marginBottom / 2, i).attr('font-size', this.options.gridTextSize).attr('fill', this.options.gridTextColor); label = this.r.text(transX(i), this.options.marginTop + height + this.options.marginBottom / 2, i).attr('font-size', this.options.gridTextSize).attr('fill', this.options.gridTextColor);
if (_this.options.parseTime == false) {
var l = this.columnLabels.length - 1;
label = label.attr('text', this.columnLabels[l - i]);
}
labelBox = label.getBBox(); labelBox = label.getBBox();
if (prevLabelMargin === null || prevLabelMargin <= labelBox.x) { if (prevLabelMargin === null || prevLabelMargin <= labelBox.x) {
prevLabelMargin = labelBox.x + labelBox.width + xLabelMargin; prevLabelMargin = labelBox.x + labelBox.width + xLabelMargin;