Chartjs-Chart.js legend long labels clipped

1👍

You should set the option options.plugins.legend.maxWidth, see the docs

You may set a large number, like maxWidth: 1000, but since it is scriptable, you may use a function to make sure you leave some width to the chart itself. For a maxWidth of 90% of the chart width, you may use

{
    options: {
        // other options .....
        plugins: {
            // other plugins .....
            legend: {
                 // other legend options .....
                 maxWidth: ({chart}) => chart.width * 0.9
             }
        }
    }
}

codepen fork

Leave a comment