5

我想在 highcharts 折线图上显示几个点，这些点是大数字。

例如 100,000、10,000,000、1,000,000,000

当我显示这些时，y 轴会自动将数字格式化为 100 k、10 M、1,000 M 等，但工具提示仍然显示实际的大数字。

是否可以在工具提示本身中将 1,000,000,000 显示为 1 B 或 1000 M。

示例 - http://jsfiddle.net/ynCKW/1/

我正在尝试使用 numberFormat 函数，但我认为它不是正确的函数。

Highcharts.numberFormat(this.y,0)

我是否必须编写一个自定义函数来在工具提示中进行这种格式化？

4

2 回答 2

5

您可以使用在 Highcharts 核心中实现的相同逻辑：

    tooltip: {
        formatter: function () {
            var ret = '',
                multi,
                axis = this.series.yAxis,
                numericSymbols = ['k', 'M', 'G', 'T', 'P', 'E'],
                i = numericSymbols.length;
            while (i-- && ret === '') {
                multi = Math.pow(1000, i + 1);
                if (axis.tickInterval >= multi && numericSymbols[i] !== null) {
                    ret = Highcharts.numberFormat(this.y / multi, -1) + numericSymbols[i];
                }
            }
            return ret;
        }
    },

和 jsFiddle：http: //jsfiddle.net/ynCKW/2/

编辑 Highcharts v6：

我们可以调用内置方法，应该更容易维护：http: //jsfiddle.net/BlackLabel/ynCKW/104/

    tooltip: {
        valueSuffix: '',
        formatter: function () {
            var axis = this.series.yAxis;

            return axis.defaultLabelFormatter.call({
                axis: axis,
                value: this.y
            });
        }
    },
于 2013-04-29T11:26:17.817 回答
2

捎带@Pawel Fus，一个轻微的调整可以让你也有负的货币价值，但在外面有负值$（即-$100K与-$-100k）。

function () {
    var isNegative = this.value < 0 ? '-' : '';
    var absValue = Math.abs(this.value);
    return isNegative + '$' + this.axis.defaultLabelFormatter.call({
        axis: this.axis,
        value: absValue
    });
}

这是一个 jsFiddle：http: //jsfiddle.net/4yuo9mww/1/

于 2016-07-26T16:55:18.723 回答