Angular 如何在JSON到ng2图表中以角度显示选择性字段

我有下面的JSON格式，我只想只显示“日期”作为x轴，“流量”作为y轴，如果我将鼠标悬停在条形图上，应该显示“百分比”

我有以下建议：

{
   "testdata":[
      {
         "fail":3,
         "flow":"Checkout",
         "pass":20,
         "total":23,
         "percentage":80
      },
      {
         "fail":80,
         "flow":"add-cart",
         "pass":60,
         "total":140,
         "percentage":60
      },
      {
         "fail":20,
         "flow":"refund",
         "pass":59,
         "total":79,
         "percentage":80
      }
   ]
}

调用component.ts文件中的以下方法时，我可以获得上述有效负载：

 public data:Array<String>=[]; 

 this.http.get(environmenthost.matrixFinder).subscribe((data:any)=>{
        this.data=data.testdata; // The above json is available in the data variable
   });

公共数据：数组=[]；
this.http.get（environmenthost.matrixFinder）.subscribe（（数据：any）=>{
this.data=data.testdata；//上述json在数据变量中可用
});

//下面是我刚刚尝试的另一个要求。我没有任何想法来建立上述要求的条形图

我使用ng2图表构建饼图，如下所示：

            <canvas id="pie" baseChart
            [data]="pieChartData"
            [labels]="pieChartLabels"
            [colors]="pieChartColors"
            [chartType]="pieChartType"
            [options]="barChartOptions"
            (chartClick)="chartClicked($event)"></canvas>

在component.ts文件的下面几行中用于将数据提供给饼图ng2图表

  public pieChartLabels: string[] = ['PayCreditWallet','Paypal','Google Pay','Amazon Pay'];
  public pieChartData: number[] = [1,2,3,4];
  public pieChartType: any = 'pie';

  public pieChartColors: Array < any > = [{
   backgroundColor: ['Violet', 'DodgerBlue', 'MediumSeaGreen','Tomato'],
   borderColor: ['rgba(135,206,250,1)', 'rgba(106,90,205,1)', 'rgba(148,159,177,1)'],
 }];

publicPieChartLabels:string[]=['PayCreditWallet'，'Paypal'，'Google Pay'，'Amazon Pay']；
公共数据：数字[]=[1,2,3,4]；
公共pieChartType:any='pie'；
公共颜色：数组=[{
背景颜色：[“紫罗兰色”、“淡蓝色”、“中绿色”、“番茄色”]，
边框颜色：['rgba（135206250,1）''rgba（106,90205,1）''rgba（148159177,1）'，
}];

我可以看到上述数据的饼图。就像我只想用上面的JSON文件做柱状图，特定的节点作为柱状图中的X轴和Y轴

我不知道如何将这些数据显示到条形图中。有人能帮我做到这一点吗