advent-of-code-charts

advent-of-code-charts copied to clipboard

Previous year a community PR added the feature to double-click users in the legend to "invert" the selection of shown series.

This feature is not very discoverable. Let's improve the UX/UI to help people find that feature.

A legend title would be perfect for this but there's an open issue at chart.js for that feature... 😢

Linked issue seems resolved :tada: so this issue seems fixable now, after an update of chart.js!

PS. There's a advent-of-code-charts channel in the contributing.today Discord where I'll be if anyone has hacktoberfest-related questions!

Hi, I start working on #36, 'cause it's related to this issue I can work on both.

Let me know ;)

The issue was fixed and legends are now possible. Note to self, I checked that feature works like this:

document.addEventListener("DOMContentLoaded", () => {
  new Chart(document.getElementById('chart'), {
    type: 'bar',
    data: {
      datasets: [{
        label: 'Nr of items',
        data: [{x:"A",y:23}, {x:"B",y:11}, {x:"C",y:19}],
      }],
    },
    options: {
      plugins: {
        legend: {
          title: {
            display: true,
            text: "My Title Here",
          },
        },
      },
    },
  });
});

However, it doesn't seem to work if I add a title to the existing way legend is configured in the code, not sure why yet. That is, if I just add it here:

https://github.com/jeroenheijmans/advent-of-code-charts/blob/9024661a962f9e0128438ea2de409c17531b039a/src/js/app.js#L899-L905

nothing seems to happen. Need to figure out why...

I tried adding this into the legend object:

title: {
    display: true,
    text: "Legend title",
},

Again, the above sample works just fine (and goes via options on a different object), so something going on there probably.

Well, apparently the index.html for testing purposes didn't have #81 Chart.js v4 yet, so this feature wasn't there yet. Now that #81 has been solved, the legend title also works. Slipstreaming this fix in #79 (2023 updates).