score:0

similar to the answer by hannes but the documentation has been updated since then - there are various options now and the link he provided no longer goes anywhere as that option is deprecated.

i'm adding a new answer as it took me a while to find.

this is x mode - displays multiple dataset info in tooltip based on x axis

var chart = new chart(ctx, {
    type: 'line',
    data: data,
    options: {
        tooltips: {
            mode: 'x'
        }
    }
})

http://www.chartjs.org/docs/latest/general/interactions/modes.html#x

there is also 'y' mode. label mode is now deprecated.

you can also use 'point', 'index' and 'nearest' mode.

score:1

as i answered here, you can give multitooltiptemplate a function. put a breakpoint inside that function with 'debugger', and explore the given object for all the properties you'd like. then construct a string to be displayed in your tooltip:

multitooltiptemplate: function(v) {debugger; return somemanipulation(v);}
tooltiptemplate: function(v) {return someothermanipulation(v);}

score:10

want to update the answer, because i was searching for a long time.

you can now change the tooltips settings inside the options. see docu: http://www.chartjs.org/docs/#chart-configuration-tooltip-configuration

as for the asked question, to show all x data.

window.mybar = new chart(ctx).line(barchartdata, {
  tooltips: {
   mode: 'label'
 }           
});

cheers hannes

score:134

change

window.mybar = new chart(ctx).line(barchartdata, {
   responsive : true,
   animation: true,
   barvaluespacing : 5,
   bardatasetspacing : 1,
   tooltipfillcolor: "rgba(0,0,0,0.8)",                
   multitooltiptemplate: "<%= label %> - <%= value %>"
});

to:

window.mybar = new chart(ctx).line(barchartdata, {
   responsive : true,
   animation: true,
   barvaluespacing : 5,
   bardatasetspacing : 1,
   tooltipfillcolor: "rgba(0,0,0,0.8)",                
   multitooltiptemplate: "<%= datasetlabel %> - <%= value %>"
});

the change is to the last line

multitooltiptemplate: "<%= datasetlabel %> - <%= value %>"

datasetlabel gets the value of the label from the dataset objects (in this case 'bob' and 'tina'), whereas label gets the caption printed on the x-axis (part of the labels array)


Related Query

More Query from same tag