Angular Chart.js 条形图

阿巴斯如何

**在此处输入图片描述**我在 angular 7 中使用了 chart.js 的条形图。此图表显示了政策与其销售数量之间的关系。如果最大销售数量是 2 或 1 或一个小数字,图表会以点数显示沿 y 轴的值,从 1 开始到最大值结束。现在我最多有 6 个策略,因此这些值是其中没有点数,但是当最大策略数减少到 2 时,值为 1.0、1.1、1.2、1.3....2.0。我希望 y 轴上的值是非十进制的,并且它们应该从零开始到最大数字 0,1,2,3...,。是否有可能?

//成分

   chartData1 = [
      {
        label: 'Policies',
        data: this.policies 
      },

    ];

chartOptions = {
  responsive: true    // THIS WILL MAKE THE CHART RESPONSIVE (VISIBLE IN ANY DEVICE).
}

//模板

<canvas
        baseChart
        [chartType]="'bar'"
        [datasets]="chartData"
        [labels]="labels"
        [options]="chartOptions"
        [legend]="true"
        height="80"
        width="100"
        [colors]="colors"
        (chartClick)="onChartClick($event)">
    </canvas>
乌明德

在您的组件中,尝试chartOptions如下定义

chartOptions = {
  responsive: true,
  scales: {
     yAxes: [{
        ticks: {
            beginAtZero: true,
            stepSize: 1
        }
    }]
  }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章