chart.jsのtooltipに表示させる文字列を変える

やりたいこと

• chart.jsのtooltip（カーソルをグラフに合わせると出てくる吹き出しみたいないやつ）に表示させる文字列を変更する
• デフォルトではtitleにx軸、labelにy軸の値とグラフの色が入る

今回はcoffeescriptで記述した

やりかた

myChart = new Chart(ctx, {
  type: 'line',
  data: { ... }, # 表示するデータ
  options: {
    tooltips: {
      callbacks: {
        title: (tooltipItem, data) ->
          # title内ではtooltipItemの値（カーソルが重なった箇所のデータ）を表示する場合は`tooltip[0]`のよう要素を指定することに注意!!
          return tooltipItem[0].xLabel + "hoge"
        label: (tooltipItem, data) ->
          return [tooltipItem.yLabel + "huga"] # リストで記述すると改行される
       }
    }
  })

今回はRailsに組み込みたかったので、このへんを参考にしました
参考：https://qiita.com/Y_uuu/items/ef107a02c27836696545

chart.jsのドキュメントは日本語版があるので助かる
参考：https://misc.0o0o.org/chartjs-doc-ja/configuration/tooltip.html