Chart.jsのラベルの色を変えたい

表題の通りなのですが、
@taguchi @yamamoto
のテキストの色を変えたいのですが、
やり方が見つけられませんでした。

colorやfontColor等で指定するのかな?と思い
色々と試してみましたが、変更できませんでした。

わかる方、教えていただきたいです。

html
1<!DOCTYPE html>
2<html lang="en">
3  <head>
4    <meta charset="UTF-8" />
5    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7    <title>Document</title>
8  </head>
9  <body>
10    <canvas id="my_chart"> Canvas not Supported/.... </canvas>
11    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.min.js"></script>
12    <script>
13      (function () {
14        "use strict";
15
16        var type = "horizontalBar"; // 横棒グラフ
17        var data = {
18          labels: [2010, 2011, 2012, 2013],
19          datasets: [
20            {
21              label: "@taguchi",
22              data: [100, 200, 221, 350], // 実際のデータ
23              backgroundColor: "skyblue", //棒の色
24              borderWidth: 0, // 枠線を消す
25            },
26            {
27              label: "@yamamoto",
28              data: [-190, 500, 221, 30],
29              backgroundColor: [
30                "hsla(90,80%,60%,0.3)",
31                "hsla(180,60%,60%,0.3)",
32                "hsla(270,60%,60%,0.3)",
33                "hsla(360,60%,60%,0.3)",
34              ],
35            },
36          ],
37        };
38
39        // 軸の範囲を決める
40        var options = {
41          // 軸の設定
42          scales: {
43            xAxes: [
44              {
45                stacked: true, //積み上げグラフの設定
46              },
47            ],
48            // 縦軸の設定
49            yAxes: [
50              {
51                stacked: true, // 積み上げグラフの設定
52                ticks: {},
53              },
54            ],
55          },
56        };
57
58        var ctx = document.getElementById("my_chart").getContext("2d");
59        var myChart = new Chart(ctx, {
60          type: type,
61          data: data,
62          options: options,
63        });
64      })();
65    </script>
66  </body>
67</html>
68

行動規範の内容に同意します

回答1件

自己解決

JavaScript
1Chart.defaults.global.defaultFontColor = 'red';
2let chart = new Chart(ctx, {
3    type: 'line',
4    data: data,
5    options: {
6        legend: {
7            labels: {
8                // このフォントプロパティ指定は、グローバルプロパティを上書きします
9                fontColor: 'black'
10            }
11        }
12    }
13});
14```