高圖將標簽分配給x軸最大值

Question

我有一個具有最大x軸值設置的Highcharts圖表。 可以在以下位置看到：

http://jsfiddle.net/7N8he/28/

我要做的是為我的最大x軸設置標簽。 因此，在圖表的末尾顯示100 ，我希望能夠將其設置為隨機字符串，例如butterfly 。 我的x軸值設置為category ，所以我不在乎x軸是否顯示數字。

我的JavaScript代碼如下：

$('#container').highcharts({
    xAxis: {
        type: 'category',
        max: 100
    },
    series: [{
        data: [0, 1, 56, 32]
    }]
});

不確定Highcharts中是否有功能可以讓我執行此操作。

我要實現這一目標的另一個選擇是寫出每個類別。 就像我這樣：

http://jsfiddle.net/7N8he/29/

但是，我希望有一個較少的冗余方法來實現此目的，因為我只想更改未到達終點的序列的最后一個x軸值（即最大x軸）。 您將注意到，在我的兩個示例中，數據點均未到達x軸。

Answer 1

你可以這樣

  chart: {
    events: {
      load: function() {
        //console.log(this.xAxis[0])
        this.xAxis[0].paddedTicks[this.xAxis[0].paddedTicks.length - 1] = "butterfly";  //update last element of array

        this.update({
          xAxis: {
            categories: this.xAxis[0].paddedTicks,
            max: this.xAxis[0].tickPositions.length-1 //update chart max value to number of element in category array
          }
        })
      }
    }
  },

注意整頁演示將正確顯示

 $('#container').highcharts({ chart: { events: { load: function() { this.xAxis[0].paddedTicks[this.xAxis[0].paddedTicks.length - 1] = "butterfly"; //console.log(this.xAxis[0]) this.update({ xAxis: { categories: this.xAxis[0].paddedTicks, max: this.xAxis[0].tickPositions.length-1 } }) } } }, xAxis: { type: 'category', max: 100 }, series: [{ data: [0, 1, 56, 32] }] }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://github.highcharts.com/highcharts.js"></script> <script src="https://github.highcharts.com/modules/exporting.js"></script> <div id="container" style="min-width: 300px; height: 300px; margin: 1em"></div> 

小提琴演示