如何在 HighCharts 中添加自定义 FirstLabel？答案

【问题标题】：How do I add a custom FirstLabel in HighCharts?如何在 HighCharts 中添加自定义 FirstLabel？
【发布时间】：2014-02-28 00:28:46
【问题描述】：

StackedColumn 图表的 x 轴有一个 showFirstLabel 属性。如何格式化它以显示特定的文本？这可能吗？

$(function () {
    $('#container').highcharts({
        chart: {
        },
        xAxis: {
            endOnTick: true,
            showFirstLabel: true,
            startOnTick: true
        },

        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
        }]
    });
});

谢谢。

【问题讨论】：

标签： highcharts label formatter axis-labels

【解决方案1】：

使用isFirst 属性检查您是否正在格式化第一个标签，请参阅：http://jsfiddle.net/V6768/1/

    xAxis: {
        endOnTick: true,
        showFirstLabel: true,
        startOnTick: true,
        labels: {
            formatter: function() {
                var str;
                if(this.isFirst) {
                    str = "I'm first one";
                } else if(this.isLast){ 
                    str = "I'm last one";
                } else {
                    str =  this.value;   
                }
                return str;
            }
        }
    },

【讨论】：

【解决方案2】：

这似乎有点 hacky，但它对我有用：

var firstLabel;
$('#container').highcharts({
    chart: {
    },
    xAxis: {
        endOnTick: true,
        showFirstLabel: true,
        startOnTick: true,
        labels: {
            formatter: function() {
                if (!firstLabel) {
                    firstLabel = this.value;
                }
                if (this.value === firstLabel) {
                    // your custom text goes here:
                    return 'yay';
                } else {
                    return this.value;
                }
            }
        }
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
    }]
});

小提琴：http://jsfiddle.net/V6768/

【讨论】：