javascript - Chart JS Y轴标注

标签 javascript php jquery laravel-5 chart.js

我一直在使用 chartjs 制作图表,显示每天的锻炼持续时间。所以 x 轴有日期,y 轴有持续时间,数据集的值最大持续时间为 1.30,最小值为 0.00。我想要y 轴显示标签,如 0.00、0.10、0.20...、1.20、1.30。

我可以显示标签为 .1、.2 ... 1.3 的图表。代码如下。

我可以显示标签为 .1、.2 ..1.3 的图表。代码如下。
enter image description here

              var options = {
                type: 'line',
                data: {
                    labels: newDates.split(','),datasets: [{
                        label: 'Time',
                        data: newDuration.split(','),
                        borderWidth: 1,
                        fill: false,
                        borderColor: "#fff"
                    }]
                },
                options: {
                    responsive: true,
              maintainAspectRatio: false,
                        title: {
                            display: true,
                        },
                  legend: {
                        display: false
                    },
                    scales: {
                        yAxes: [{
                    ticks: {
                      beginAtZero: true,
                      suggestedMax: 1.30,
                      stepSize: .10,
                      fontColor: 'rgba(255, 255, 255)' // makes grid lines from y axis red
                   },
                            gridLines: {
                            color: 'rgba(255, 255, 255, 0.2)' // makes grid lines from y axis red
                            }
                        }],
                        xAxes: [{
                  ticks: {
                    beginAtZero: true,
                     fontColor: 'rgba(255, 255, 255)' // makes grid lines from y axis red

                 },
                            gridLines: {
                                display:false
                            }
                        }]
                    }
                }
            }

            var ctx = document.getElementById('chartJSContainer').getContext('2d');
            new Chart(ctx, options);

预期结果:

y 轴显示标签为 0 0.10 0.20 0.30 ... 1.20,1.30

最佳答案

改变这个

yAxes: [{
    ticks: {
       precision: 2
    }
}],

关于javascript - Chart JS Y轴标注,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54396386/

相关文章:

php - SQL 查询返回空值?

javascript - $ ('select option:selected' ).text() 和 Attr.specified 已弃用警告

javascript - AngularJS - $q 的 Promise 未正确级联到 Controller

javascript - 在 D3.js 中使用 geoJSON 数据绘制线条

javascript - 在 php 变量中分配一个选择的值

php - 无法将针对一个 id 的多个数据插入到 mySQL 表的多个字段中?

javascript - SmoothSate.js 问题

javascript - Div 中的垂直/水平对齐

javascript - 创建名称可动态更改的 obj

javascript - 如何在每次刷新页面时执行一次函数?