Menu
I'm having a tough time figuring out how to get labels, legend and title showing up in my Chart JS Line Chart. I've copied the code directly from the example (reproduced below). However, the label "My First dataset" doesn't show up anywhere on the chart and so I can't tell which line is which. I've also tried adding a 'title' to my datasets, but with no luck. Anyone know what I'm missing?
var data = { labels: ["January", "February", "March", "April", "May", "June", "July"], datasets: [ { label: "My First dataset", fillColor: "rgba(220,220,220,0.2)", strokeColor: "rgba(220,220,220,1)", pointColor: "rgba(220,220,220,1)", pointStrokeColor: "#fff", pointHighlightFill: "#fff", pointHighlightStroke: "rgba(220,220,220,1)", data: [65, 59, 80, 81, 56, 55, 40] }, { label: "My Second dataset", fillColor: "rgba(151,187,205,0.2)", strokeColor: "rgba(151,187,205,1)", pointColor: "rgba(151,187,205,1)", pointStrokeColor: "#fff", pointHighlightFill: "#fff", pointHighlightStroke: "rgba(151,187,205,1)", data: [28, 48, 40, 19, 86, 27, 90] } ]}; Thanks, Saswat
465
js (3.6. 0), you can control the Legend display with the following code: const options = { plugins: { ... legend: { position: "right", // by default it's top }, ... }, };
To remove legend on charts with Chart. js v2 and JavaScript, we can set the options. legend to false . const chart1 = new Chart(canvas, { type: "pie", data: data, options: { legend: { display: false, }, tooltips: { enabled: false, }, }, });
The positions of the chart legend. The supported values are: "top" - the legend is positioned on the top. "bottom" - the legend is positioned on the bottom. "left" - the legend is positioned on the left.
in the option add this parameter
multiTooltipTemplate: "<%= datasetLabel %> - <%= value %>" If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With