高图在Y轴上重复相同的标签值

Highcharts repeating same label value on Y Axis

本文关键字:标签 高图      更新时间:2023-09-26

我有一个Highcharts线形图,其中Y轴标签没有显示大数的小数点。如果值超过5位,则小数点不显示,这意味着所有标签显示相同的值。

我知道我可以定义一个自定义格式化器来显示小数点,但是图表是非常动态的,可以显示具有广泛变化值的行。有些级数可以只有整数,有些级数需要小数点后5位。我不想在加载新序列后,为了正确缩放轴而搜索序列并传回最大值和最小值。图表通常自动缩放并显示正确的标签,那么这里有什么问题呢?以下是该问题的简化示例:JSFiddle

Y轴有一个基本的定义;

        yAxis: {
        max: 33999.253,
        min: 33999.219,
        title: {
            text: 'm',
            style: {
                color: '#000000',
                fontWeight: 'bold'
            }
        },
        labels: {
            style: {
                color: '#000000'
            }
        }
    },

正如您所看到的,最初显示的所有Y轴标签都是相同的。但是,当您更新序列(使用dataSet按钮)并显示具有更低值的不同数据序列时,会显示小数点。当你缩放轴(使用自动缩放按钮)时,标签甚至不显示。

这是一个由空白间距引起的问题,还是我缺少了其他一些配置设置?

默认情况下Highcharts会将标签四舍五入为两位小数。你可以用yAxis.labels.formatter来改变它。看到:

        yAxis: {
            max: 33999.253,
            min: 33999.219,
            title: {
                text: 'm',
                style: {
                    color: '#000000',
                    fontWeight: 'bold'
                }
            },
            labels: {
                formatter: function() {
                    return this.value;
                },
                style: {
                    color: '#000000'
                }
            }
        },

和演示:http://jsfiddle.net/NZjUg/4/

有一个简单的解决方案,

使用你自己的格式化器

            yAxis: {
                max: 33999.253,
                min: 33999.219,
                title: {
                    text: 'm',
                    style: {
                        color: '#000000',
                        fontWeight: 'bold'
                    }
                },
                labels: {
                    style: {
                        color: '#000000'
                    },
                    formatter: function () {
                        return this.value
                    }
                }
            },

更新了你的提琴:http://jsfiddle.net/NZjUg/5/