add info for points in line chart (js)

Question

I'm using a line chart in js and when I put the mouse over a point I can see the (x,y) value like in the Image I added. But I want to add value to every point, for example specific number for every point so when I put the mouse over a point, I will be able to see the (x,y) value and the value I added.

this is my graph js code.

let ctx = document.getElementById('main-chart').getContext('2d');
let stackedLine = new Chart(ctx, {
  type: 'scatter',
  data: {
    datasets: [{
        label: "CpuUsage",
        data: data,
        borderColor: 'blue',
        pointBackgroundColor: 'black',
        showLine: true
      },
      {
        label: "MemUsage",
        data: data2,
        borderColor: 'red',
        pointBackgroundColor: 'black',
        showLine: true
      },
    ]
  },
  options: {
    responsive: true,
  }
});

this is the type of my object in the graph.

{x: 14, y:35, numOfDp:0}

in the point on the graph we can see only (x,y) i nedd to be able to see also the numOfDp value.

user_12699161 · Answer

I do not know how you can do this using chart.js

But you can do it easily using canvas.js

jast make your object like this {x: 14, y:35, indexLabel:'0'}

and your graph Will look like in the imge i added

(If that's what you meant)

add info for points in line chart (js)

1 Answers