Chartjs-Multi- Line title in chart.js not working

by

2👍

Your example should work fine. Make sure the rest of the code is formatted correctly as well.

Here is a working example:
https://codepen.io/ItsT-Mo/pen/rPNrGm
(The title is defined in Line 12)

var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: ['One', 'Two', 'Three'],
        datasets: [{
            label: 'Testdata',
            data: [1, 2, 3]
        }]
    },
    options: {
        title: {
            display: true,
            text: ['Title Line One', 'Title Line Two']
        },
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});

If it still doesn’t work, inspect the page and make sure both lines are in the DOM.
If they are but not both are shown, then one line of the title might be obscured by some CSS.

0👍

Make sure that you’re using Chart.js version 2.7.0 or higher.

Chart.js version 2.6.0 does not have this feature.

Chart.js version 2.7.0 does.

Leave a comment