首页 > 解决方案 > 如何将 NG2 图表的某些选项绑定到某些控件

问题描述

我有以下 NG2 图表:

<canvas baseChart [datasets]="cpuData" [options]="cpuChartOptions" chartType="line"> </canvas>

它具有以下图表选项:

   public cpuChartOptions: ChartOptions = {
      title: {
         text: 'CPU usage',
         display: true,
      },
      scales: {
         xAxes: [
            {
               type: 'time',
               time: {
                  unit: 'second',
               },
            },
         ],
         yAxes: [
            {
               type: 'linear',
               scaleLabel: {
                  display: true,
                  labelString: 'CPU (%)',
               },
               stacked: true,
            },
         ],
      },
      responsive: true,
      tooltips: {
         enabled: true,
      },
   };

我希望能够有一个可以绑定在 cpuChartOptions.scales.yAxes[0].stacked.

我首先尝试创建一个通过切换按钮调用的方法:

   public toggleStacked(chartOptions: ChartOptions) {
      chartOptions.scales.yAxes[0].stacked = !chartOptions.scales.yAxes[0].stacked;

      //this.cpuChartOptions.scales.yAxes[0].stacked = !this.cpuChartOptions.scales.yAxes[0].stacked; --> Doesn't work either
      //this.cpuChartOptions = this.cpuChartOptions; -->Doesn't help
   }

是否可以更改/更新图表选项?

标签: angularng2-charts

解决方案


推荐阅读