javascript - 折れ線グラフまたは棒グラフに凡例が表示されない - React-Chartjs-2

Question

反応ダッシュボードのいくつかのグラフに凡例を表示するのに苦労しています。React-Chartjs-2 を使用しています。凡例はもともと機能していましたが、Chart.default プロパティで凡例をオフにしてテストしましたが、再びオンにしようとすると、再び表示されませんでした。

私のグローバルチャート設定は次のとおりです。

// React-Chartjs-2 Global Styling 
defaults.global.elements.point.radius = 1;
defaults.global.elements.line.tension = 0.1;
defaults.global.elements.point.hoverRadius = 10;
defaults.global.elements.point.hitRadius = 12;

// Font
defaults.global.defaultFontSize = 12;
defaults.global.defaultFontColor = "#838383";

// Legend
defaults.global.legend.display = true;
defaults.global.legend.align = "start";
defaults.global.legend.position = "bottom";
defaults.global.legend.labels = {
  padding: 30,
  boxWidth: 15,
};

折れ線グラフ、棒グラフ、ドーナツ グラフのローカル グラフ プロパティはすべて、次のような同様のレイアウトに従います。

        <Line
          data={props.graph.data}
          height={300}
          options={{
            maintainAspectRatio: false,
            legend: {
              display: true,
            },
            scales: {
              xAxes: [{
                gridLines: {
                  display: false
                }
              }],
              yAxes: [{
                gridLines: {
                  drawBorder: false,
                },
                ticks: {
                  beginAtZero:true,
                  // Include a kwh sign in the ticks
                  callback: function(value, index, values) {
                      return value + 'kWh';
                  }
                },
              }]
            }
          }}
        />

ご覧のとおり、凡例はグローバル設定とローカル設定の両方でオンになっています。現在、ドーナツ チャートのみが凡例を表示しています。display:true の値を切り替えると、折れ線/棒グラフの下部がわずかに上下に移動します。

誰かが同様の問題に遭遇しましたか?