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

examples/decimal-custom-hover.html

@@ -27,11 +27,12 @@ <h1>Decimal Data</h1>
   ykeys: ['y'],
   labels: ['sin(x)'],
   parseTime: false,
-  hoverCallback: function (index, options) {
+  hoverCallback: function (index, options, default_content) {
     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>
 </body>

lib/morris.bar.coffee

@@ -147,18 +147,17 @@ class Morris.Bar extends Morris.Grid
   #
   # @private
   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'
-      content = @options.hoverCallback(index, @options)
-    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>
-        """
+      content = @options.hoverCallback(index, @options, content)
     x = @left + (index + 0.5) * @width / @data.length
     [content, x]
 

lib/morris.line.coffee

@@ -103,17 +103,16 @@ class Morris.Line extends Morris.Grid
   # @private
   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'
-      content = @options.hoverCallback(index, @options)
-    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 = @options.hoverCallback(index, @options, content)
     [content, row._x, row._ymax]