Title

Title

The chart title defines text to draw at the top of the chart.

Title Configuration

Namespace: options.plugins.title, the global options for the chart title is defined in Chart.defaults.plugins.title.

Name	Type	Default	Scriptable	Description
`align`	`string`	`‘center’`	Yes	Alignment of the title. more…
`color`	`Color`	`Chart.defaults.color`	Yes	Color of text.
`display`	`boolean`	`false`	Yes	Is the title shown?
`fullSize`	`boolean`	`true`	Yes	Marks that this box should take the full width/height of the canvas. If `false`, the box is sized and placed above/beside the chart area.
`position`	`string`	`‘top’`	Yes	Position of title. more…
`font`	`Font`	`{style: ‘bold’}`	Yes	See Fonts
`padding`	`Padding`	`10`	Yes	Padding to apply around the title. Only `top` and `bottom` are implemented.
`text`	`string`\|`string[]`	`‘’`	Yes	Title text to display. If specified as an array, text is rendered on multiple lines.

Position

Possible title position values are:

'top'
'left'
'bottom'
'right'

Align

Alignment of the title. Options are:

'start'
'center'
'end'

Example Usage

The example below would enable a title of ‘Custom Chart Title’ on the chart that is created.

var chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        plugins: {
            title: {
                display: true,
                text: 'Custom Chart Title'
            }
        }
    }
});

This example shows how to specify separate top and bottom title text padding:

var chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        plugins: {
            title: {
                display: true,
                text: 'Custom Chart Title',
                padding: {
                    top: 10,
                    bottom: 30
                }
            }
        }
    }
});