javascript - 图表刻度问题

Question

我有一个带有自定义刻度格式化程序函数的 flot 图形，

if ((val / 1000) >= 1) {
    val = String(Math.round(val / 1000)) + 'K';
}

return String(val);

但问题是它会为某些报价单返回相同的值。

关于代码的小解释:

val --> any integer value ranging from 1 to infinity

val/1000逻辑是将tick转换为用户好友(可读)格式(1K、2K等)。

但这里的问题是，当一些 val 舍入到相等的值时，我会得到重复的刻度标签。

想知道有什么好的方法可以固定这个算法来计算这个吗？

附录

val/1000 并不意味着 val 是 1000 的倍数，它可以是从 1 到无穷大的任何整数值。

例如:对于 val = 1000 或 1001，它在两个刻度标签上返回 1K。

我知道它的算法错误，我只是想知道有没有办法彻底修复它

注意事项

1. 刻度必须最多四舍五入到小数点后两位(最好没有小数点)。
2. 您不能更改 val/1000。您可以使用 Math.round() 函数玩一轮游戏。
3. 即使要使用toFixed()也要遵循规则1

Answer 1

这是一个在保持准确性的同时对大数字使用后缀的解决方案:

function tick_label(val) {
    if (val < 0) return "\u2212" + tick_label(-val);
    if (val < 1000) return String(val);

    var mag = 1;
    var suffix = "";

    if (val >= 1000) { mag = 1000; suffix = "k" }
    if (val >= 1000000) { mag = 1000000; suffix = "M" }
    if (val >= 1000000000) { mag = 1000000000; suffix = "G" }

    var div = mag;

    while (val % 10 == 0) {
        val /= 10;
        div /= 10;
    }

    return String(val / div) + suffix;
}

此代码依赖于整数来表示刻度，因此确切的数字看起来不会很奇怪或过于精确。 (1.002k、1.004k、1.006k 的比例看起来还可以，但是 1.102k、1.202k、1.302k 的比例不合适。我对 Flot 不熟悉，但我想它会解决这个问题。)