Titles

The default in Chart.js is to have the title turned off, since you can also create your title with greater flexibility in HTML. If you still want to have a title in your chart, you need to set at least set two properties: display (with the value true) and text (with the text of your title). Other properties you might want to configure are listed as follows:

Property

Value

Description

display

true or false

Displays the title. The default is false.

text

String or String[]

A string containing the text of the title or an array of strings, for a multi-line title.

fontStyle, fontFamily, fontSize, fontColor

String and Number

Font attributes. The default fontStyle is bold, but the others are inherited.

lineHeight

Number

The default line height is 1.2.

padding

Number

The default padding is 10.

position

'top', 'bottom', 'left' or 'right'

This is where the title should be placed. The default is 'top'. The titles' places on the sides will be rotated 90 degrees counterclockwise.

Main properties of the options.title object

You can configure the title using Chart.defaults.global.title for all charts, or in the options object for a new chart instance. You can also change the title at any time after updating a chart or responding to events.