[Chartjs]-Is there a way to hide/customize ChartJS' above legend?

14👍

When creating a chart, you can give it a set of chart options. One of the possible options is the Legend Configuration. To hide the legend, simply use an option like this:

options: {
    legend: { display: false }
}

Although I haven’t used ng2-charts, looking through the documentation (specifically the charts example) it seems you can simply define a chart legend boolean like this:

public lineChartLegend:boolean = true;

And then add this value to the chart like this:

   <base-chart class="chart"
                   ...
                   [legend]="lineChartLegend"
                   [chartType]="lineChartType"
                   ...></base-chart>

Finally, the likely reason why Chartjs Legend Styling solution doesn’t work is that it was designed for chart.js v1.x, while ng2-charts appears to work with chart.js v2.x, which is a major change to the previous version.

Hope this helps!

Leave a comment