chartjs如何将十进制更改为整数X轴

时间:2018-05-18 19:03:42

标签: chart.js

我有这个chartjs代码,它是一个水平条形图

 new Chart(document.getElementById("bar-chart-grouped_E09"), {
                                    type: 'horizontalBar',
                                    data: {
                                      labels: E09_labels,
                                      datasets: [
                                        {
                                          label: "Male",
                                          backgroundColor: "#3e95cd",
                                          data: E09_M_values
                                        }, {
                                          label: "Female",
                                          backgroundColor: "#8e5ea2",
                                          data: E09_F_values
                                        }
                                      ]
                                    },
                                    options: {
                                      title: {
                                        display: true,
                                        text: 'Drug or chemical induced diabetes mellitus'
                                      }
                                    }
                                });
然而,对于女性1,男性的值为0,然后对于女性1,则图表的x轴显示小数值0.2,0.4 ...... 1,1.2等等。

基本上这是由于我的最大值为1,但如果数据显示十进制值,则数据没有意义。理想情况下,一旦添加了更多数据,图表就会更新,但我希望尽可能地显示实数,以使图表更加真实。

2 个答案:

答案 0 :(得分:2)

尝试将其置于您的选项中,它将从零开始(以便可以显示值为1的小节),而Math.trunc将删除小数。

scales: {
                xAxes: [{
                    ticks: {
                        beginAtZero: true,
                        userCallback: function (label, index, labels) {
                            if (Math.trunc(label) === label) {
                                return label;
                            }
                        }
                    }
                }]
            },

答案 1 :(得分:0)

检查chartjs比例的选项。您可以设置比例的最小值,最大值和步长。有了它,你可以这样只显示0和1。