热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

在图表js中设置最小步长

如何解决《在图表js中设置最小步长》经验,为你挑选了2个好方法。

我使用Chart.js 2.0版本绘制图形,我想在条形图中定义最小步长

var myNewChart = new Chart(grapharea, {
                type: 'bar',
                data: barData,
                options: {
                    responsive: true,                        
                    scales: {
                        yAxes: [
                            {
                                ticks: {
                                    min: 0, // it is for ignoring negative step.
                                    beginAtZero: true,
                                    stepSize: 1  // if i use this it always set it '1', which look very awkward if it have high value  e.g. '100'.
                                }
                            }
                        ]
                    }
                }
            });

这次我正在使用

stepSize:1

我使用这个步长来忽略点值,例如'0.5',它表示当最大图值id较小时,例如'2'.
如果我使用它,它总是将步骤设置为'1',如果它具有高值,例如'100',则看起来很尴尬.

我在寻找这样的东西:suggestMin = 1

是否有任何东西来定义最小步长,在较高值的情况下不应该修复.



1> Daantie..:

如果您不想显示点值(例如0.5)标签,则可以编写回调函数来过滤点值标签,而不是使用stepSize.

像这样:

ticks: {
    min: 0, // it is for ignoring negative step.
    beginAtZero: true,
    callback: function(value, index, values) {
        if (Math.floor(value) === value) {
            return value;
        }
    }
}

在这里工作小提琴:https://jsfiddle.net/ma7h611L/


我尝试了精度:0,它对我有用https://www.chartjs.org/docs/latest/axes/cartesian/linear.html
从2.7.3版开始,precision属性是新的,并且确实更干净。我还将更新此答案并添加此信息。

2> Lekoaf..:
ticks: {
    precision: 0
}

这与上面的回调函数同样有效,并且更加简洁。

精度(如果已定义且未指定stepSize),则步长将舍入到许多小数位。

https://www.chartjs.org/docs/latest/axes/cartesian/linear.html


推荐阅读
author-avatar
曾经
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有