Currently, there's no way to tell exactly what line on our chart represents what project. We can see one colored line for each project, but we can't associate these colors. What we need is a simple legend that helps our users to associate line chart colors to projects.
Let's look at the required code changes to implement legends on our chart. Open our tasks chart component class, located on the path src/app/projects-dashboard/tasks-chart/tasks-chart.component.ts, and apply the following changes. Irrelevant parts of this change are hidden using the ellipsis character, while effective changes are marked in bold:
…export interface ChartLegendItem { title: string; class: string;}@Component({ selector: 'mac-tasks-chart', ...
