score:1

Accepted answer

if you use the latest version of chart.js there is a new update allow you to show a tooltip with value/title. http://www.chartjs.org/docs/

there is several options to custom the tooltip on mouseover

// boolean - determines whether to draw tooltips on the canvas or not
showtooltips: true,

// array - array of string names to attach tooltip events
tooltipevents: ["mousemove", "touchstart", "touchmove"],

// string - tooltip background colour
tooltipfillcolor: "rgba(0,0,0,0.8)",

// string - tooltip label font declaration for the scale label
tooltipfontfamily: "'helvetica neue', 'helvetica', 'arial', sans-serif",

// number - tooltip label font size in pixels
tooltipfontsize: 14,

// string - tooltip font weight style
tooltipfontstyle: "normal",

// string - tooltip label font colour
tooltipfontcolor: "#fff",

// string - tooltip title font declaration for the scale label
tooltiptitlefontfamily: "'helvetica neue', 'helvetica', 'arial', sans-serif",

// number - tooltip title font size in pixels
tooltiptitlefontsize: 14,

// string - tooltip title font weight style
tooltiptitlefontstyle: "bold",

// string - tooltip title font colour
tooltiptitlefontcolor: "#fff",

// number - pixel width of padding around tooltip text
tooltipypadding: 6,

// number - pixel width of padding around tooltip text
tooltipxpadding: 6,

// number - size of the caret on the tooltip
tooltipcaretsize: 8,

// number - pixel radius of the tooltip border
tooltipcornerradius: 6,

// number - pixel offset from point x to tooltip edge
tooltipxoffset: 10,

// string - template string for single tooltips
tooltiptemplate: "<%if (label){%><%=label%>: <%}%><%= value %>",

score:1

i agree with @jbr

i have just updated the chart.min.js file link in your fiddle and you existing code shows tooltip on hover the chart..

check the updated fiddle


Related Query

More Query from same tag