Chart.js: How to pass info to custom tooltip using time scale

[timalbert]

If I am passing through my data as { "x": value, "y": value } for a time scale (v2), how to would I pass along info to parse in a tooltip? Previously, I would just separate values by a delimiter and put them all in the label, but as best I can tell that is not possible using the time scale.

example time data:
data: [ {"x":"2012-01-02T00:00:00+00:00","y":80}, {"x":"2012-03-13T00:00:00+00:00","y":150}, {"x":"2012-12-18T00:00:00+00:00","y":230}, {"x":"2013-01-11T00:00:00+00:00","y":310}, {"x":"2013-09-18T00:00:00+00:00","y":410}, {"x":"2013-10-16T00:00:00+00:00","y":510} ]

[etimberg]

@timalbert in your data objects you can add your extra information as keys. Only the x and y keys are reserved.

Then, you can update the callbacks that generate the tooltip strings.

var config = {
    tooltips: {
        callbacks: {
            title: function(tooltipItems, data) { /* generate title here */ },
            label: function(tooltipItem, data) { /* generate individual tooltip item here */ }
        }
    }
}

The data object is the data object that was originally passed to the chart. tooltipItem is an object that looks like

{
    xLabel: <x value of item as string>,
    yLabel: <y value of item as string>,
    datasetIndex: index of the dataset,
    index: index in the data array
}

To get the data object for the item, you'd do

data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index]

[timalbert]

Thanks that was very helpful!