【问题标题】:chartjs how to change decimal to integers X-axischartjs如何将十进制更改为整数X轴
【发布时间】:2018-05-18 19:03:41
【问题描述】:

我有这个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'
                                      }
                                    }
                                });

但是男性的值为 0,女性的值为 1,那么图形的 x 轴显示十进制值 0.2、0.4....1、1.2 等等。

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

【问题讨论】:

    标签: chart.js


    【解决方案1】:

    尝试将其放入您的选项中,它将从零开始(以便显示值为 1 的条形图)并且 Math.trunc 将删除小数。

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

    【讨论】:

      【解决方案2】:

      检查 chartjs 比例的选项。您可以设置体重秤的最小值、最大值和步长。这样你就可以让它只显示 0 和 1。

      【讨论】:

        猜你喜欢
        • 2021-09-29
        • 1970-01-01
        • 2021-05-09
        • 2017-12-21
        • 2012-02-21
        • 2017-02-04
        • 1970-01-01
        • 2014-04-16
        • 1970-01-01
        相关资源
        最近更新 更多