Title

チャートの上部に表示するタイトルを定義します。

タイトル設定

タイトル設定は名前空間options.titleに渡されます。 グローバルオプションはChart.defaults.global.titleで定義されています。

position

タイトルの表示位置を指定します。以下を指定することができます。

• top
• left
• bottom
• right

例

以下は、'Custom Chart Title'というタイトルを表示する例です。

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

デモ

タイトルをチャートの下部に、改行を入れて表示しています。

JavaScript

var ctx = document.getElementById('myChart').getContext('2d');
new Chart(ctx, {
    type: 'line',
    data: {
        labels: ["January", "February", "March", "April", "May", "June", "July"],
        datasets:[{
            type: 'line',
            label: "A",
            data: [65, 59, 80, 81, 56, 55, 40],
            backgroundColor: "rgba(54, 162, 235, 0.2)",
            borderColor: "rgb(54, 162, 235)",
            borderWidth: 1
        }]
    },
    options: {
        title: {
          display: true,
            position: 'bottom',
            fontColor: '#333',
            text: ['タイトル', 'を', '改行して', '表示します。'],
        }
    }
});

HTML

<canvas id="myChart"></canvas>