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

Customizing hover content using default content (fixes #179).

Browse source
This commit is contained in:
Olly Smith 2013-04-14 10:25:14 +01:00
parent b9f53a8fdb
commit 67caadb600
5 changed files with 39 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
examples/decimal-custom-hover.html
View file

@ -27,11 +27,12 @@ window.m = Morris.Line({
ykeys: ['y'], ykeys: ['y'],
labels: ['sin(x)'], labels: ['sin(x)'],
parseTime: false, parseTime: false,
hoverCallback: function (index, options) { hoverCallback: function (index, options, default_content) {
var row = options.data[index]; var row = options.data[index];
return "1.5 + 1.5 sin(" + row.x + ") = " + row.y; return default_content.replace("sin(x)", "1.5 + 1.5 sin(" + row.x + ")");
}, },
xLabelMargin: 10 xLabelMargin: 10,
integerYLabels: true
}); });
</pre> </pre>
</body> </body>

21
lib/morris.bar.coffee
View file

@ -147,18 +147,17 @@ class Morris.Bar extends Morris.Grid
# #
# @private # @private
hoverContentForRow: (index) -> hoverContentForRow: (index) ->
row = @data[index]
content = "<div class='morris-hover-row-label'>#{row.label}</div>"
for y, j in row.y
content += """
<div class='morris-hover-point' style='color: #{@colorFor(row, j, 'label')}'>
#{@options.labels[j]}:
#{@yLabelFormat(y)}
</div>
"""
if typeof @options.hoverCallback is 'function' if typeof @options.hoverCallback is 'function'
content = @options.hoverCallback(index, @options) content = @options.hoverCallback(index, @options, content)
else
row = @data[index]
content = "<div class='morris-hover-row-label'>#{row.label}</div>"
for y, j in row.y
content += """
<div class='morris-hover-point' style='color: #{@colorFor(row, j, 'label')}'>
#{@options.labels[j]}:
#{@yLabelFormat(y)}
</div>
"""
x = @left + (index + 0.5) * @width / @data.length x = @left + (index + 0.5) * @width / @data.length
[content, x] [content, x]

19
lib/morris.line.coffee
View file

@ -103,17 +103,16 @@ class Morris.Line extends Morris.Grid
# @private # @private
hoverContentForRow: (index) -> hoverContentForRow: (index) ->
row = @data[index] row = @data[index]
content = "<div class='morris-hover-row-label'>#{row.label}</div>"
for y, j in row.y
content += """
<div class='morris-hover-point' style='color: #{@colorFor(row, j, 'label')}'>
#{@options.labels[j]}:
#{@yLabelFormat(y)}
</div>
"""
if typeof @options.hoverCallback is 'function' if typeof @options.hoverCallback is 'function'
content = @options.hoverCallback(index, @options) content = @options.hoverCallback(index, @options, content)
else
content = "<div class='morris-hover-row-label'>#{row.label}</div>"
for y, j in row.y
content += """
<div class='morris-hover-point' style='color: #{@colorFor(row, j, 'label')}'>
#{@options.labels[j]}:
#{@yLabelFormat(y)}
</div>
"""
[content, row._x, row._ymax] [content, row._x, row._ymax]

32
morris.js
View file

@ -754,15 +754,14 @@
Line.prototype.hoverContentForRow = function(index) { Line.prototype.hoverContentForRow = function(index) {
var content, j, row, y, _i, _len, _ref; var content, j, row, y, _i, _len, _ref;
row = this.data[index]; row = this.data[index];
content = "<div class='morris-hover-row-label'>" + row.label + "</div>";
_ref = row.y;
for (j = _i = 0, _len = _ref.length; _i < _len; j = ++_i) {
y = _ref[j];
content += "<div class='morris-hover-point' style='color: " + (this.colorFor(row, j, 'label')) + "'>\n " + this.options.labels[j] + ":\n " + (this.yLabelFormat(y)) + "\n</div>";
}
if (typeof this.options.hoverCallback === 'function') { if (typeof this.options.hoverCallback === 'function') {
content = this.options.hoverCallback(index, this.options); content = this.options.hoverCallback(index, this.options, content);
} else {
content = "<div class='morris-hover-row-label'>" + row.label + "</div>";
_ref = row.y;
for (j = _i = 0, _len = _ref.length; _i < _len; j = ++_i) {
y = _ref[j];
content += "<div class='morris-hover-point' style='color: " + (this.colorFor(row, j, 'label')) + "'>\n " + this.options.labels[j] + ":\n " + (this.yLabelFormat(y)) + "\n</div>";
}
} }
return [content, row._x, row._ymax]; return [content, row._x, row._ymax];
}; };
@ -1441,16 +1440,15 @@
Bar.prototype.hoverContentForRow = function(index) { Bar.prototype.hoverContentForRow = function(index) {
var content, j, row, x, y, _i, _len, _ref; var content, j, row, x, y, _i, _len, _ref;
row = this.data[index];
content = "<div class='morris-hover-row-label'>" + row.label + "</div>";
_ref = row.y;
for (j = _i = 0, _len = _ref.length; _i < _len; j = ++_i) {
y = _ref[j];
content += "<div class='morris-hover-point' style='color: " + (this.colorFor(row, j, 'label')) + "'>\n " + this.options.labels[j] + ":\n " + (this.yLabelFormat(y)) + "\n</div>";
}
if (typeof this.options.hoverCallback === 'function') { if (typeof this.options.hoverCallback === 'function') {
content = this.options.hoverCallback(index, this.options); content = this.options.hoverCallback(index, this.options, content);
} else {
row = this.data[index];
content = "<div class='morris-hover-row-label'>" + row.label + "</div>";
_ref = row.y;
for (j = _i = 0, _len = _ref.length; _i < _len; j = ++_i) {
y = _ref[j];
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.width / this.data.length; x = this.left + (index + 0.5) * this.width / this.data.length;
return [content, x]; return [content, x];

2
morris.min.js vendored
View file

File diff suppressed because one or more lines are too long