2017-08-10 136 views
0

我想在y轴上显示带有天数(2,4,6,8,10 ..)的条形图,并在x轴上显示org1,org2,org3的条形图。默认情况下,天数在y轴上显示为10,20,30。你能不能让我知道如何改变这一点。如何在primeng条形图中更改y轴标签?

** ** component.ts

this.chartdata = { 
      labels: ['Org1', 'Org2', 'Org3', 'Org4', 'Org5', 'Org6', 'Org7'], 
      datasets: [ 
       { 
        label: '< 7 days', 
        backgroundColor: '#9CCC65', 
        borderColor: '#7CB342', 
        data: [2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22] 
       }, 
       { 
        label: '< 14 days', 
        backgroundColor: '#f4eb3d', 
        borderColor: '#f4eb3d', 
        data: [1, 3, 5, 7, 9, 11, 13, 15, 17, 19, 21] 
       }, 
       { 
        label: '> 21 days', 
        backgroundColor: '#ef220b', 
        borderColor: '#ef220b', 
        data: [1, 3, 5, 7, 9,12, 14, 16, 18, 20, 22] 
       } 

      ] 
     } 

** HTML页面**

<p-chart type="bar" [data]="chartdata"></p-chart> 

** **输出

enter image description here

回答

1

你需要指定图表选项为

<p-chart type="bar" [data]="chartdata" [options]="chartOptions"></p-chart> 

,然后你可以改变y轴蜱在选项:

public chartOptions = { 
    scales: { 
    yAxes: [{ 
     ticks: { 
     stepSize: 2, 
     beginAtZero: true 
     } 
    }] 
    } 
} 
+0

Thanks.It工作。 – Jan69