がどのようにTSファイルに次の

Question

は、私は私のアプリ内のチャートを表示するためにimport { Chart } from 'chart.js';を使用クリックせずに、チャート内の値を取得して使用する

ionViewDidLoad() { 
console.log("milk total",this.chartValue); 
     this.barChart = new Chart(this.barCanvas.nativeElement, { 

       type: 'bar', 
       data: { 
        labels: ["Milk", "News Paper", "Laundry", "Fruit/Veg"], 
        datasets: [{ 
         label: '# of Total Price', 
         data: this.chartValue, 
         backgroundColor: [ 
          'rgba(255, 99, 132, 0.2)', 
          'rgba(54, 162, 235, 0.2)', 
          'rgba(255, 206, 86, 0.2)', 
          'rgba(75, 192, 192, 0.2)', 
          'rgba(153, 102, 255, 0.2)', 
          'rgba(255, 159, 64, 0.2)', 
         ], 
         borderColor: [ 
          'rgba(255,99,132,1)', 
          'rgba(54, 162, 235, 1)', 
          'rgba(255, 206, 86, 1)', 
          'rgba(75, 192, 192, 1)', 
          'rgba(153, 102, 255, 1)', 
          'rgba(255, 159, 64, 1)' 
         ], 
         borderWidth: 1 
        }] 
       }, 
       options: { 
        scales: { 
         yAxes: [{ 
          ticks: { 
           beginAtZero: true 
          } 
         }] 
        } 
       } 

      }); 
} 

私は上記の配列を取得することができる午前

は 値しかし、私はこれらの価値を得ています。

"22"、 "0"、 "18" .....のような配列値を得ることができます。棒グラフの上に赤い色のラベルをクリックした場合に限ります。ページが読み込まれるとその値を表示するためのグラフが必要です。その赤いラベルを削除する方法を教えてください

Answer 1

コードに問題はありません。それはそのまま動作するはずです。

はおそらくのような、update()方法を使用して、それを作成した後、グラフを更新する力を試してみてください：APIから

ionViewDidLoad() { 

    this.barChart = new Chart(this.barCanvas.nativeElement, { 
    ... 
    ... 
    }); 

    this.barChart.update(); 
}