2015-06-30 90 views
0

目前有一種方法可以顛倒折線圖xaxis標籤的順序,使標籤以升序方式排列,並且最右邊的刻度是'開始'嗎?我當前的代碼如下所示:Highcharts折線圖XAxis標籤訂單

legend: { enabled: false}, 
    xAxis: { 
    title: { text: null}, 
    categories: chartCategories, 
    tickmarkPlacement: 'on', 
    labels: { 
     useHTML: false, 
     step: 2, 
     rotation: -40 
    }, 
    y: 30 
} 

這裏是我的榜樣

http://jsfiddle.net/skqshs9e/1/

我已經整理我的數據數組是在正確的順序,它仍然顯示在升序標籤,但它不會將最右邊的刻度線作爲起點。如果您將鼠標懸停在最後一幅圖上,則會在工具提示中看到「2015-12-19 - 2015-12-31」標籤。

我想這是起點,並顯示在xaxis和第2步,並沒有第一個'2015-01-01 - 2015-02-01'顯示在x軸上。任何幫助,將不勝感激!

回答

0

如果我正確理解您的要求。嘗試在X軸做這個對象

xAxis: { 
    reversed:true, 
    title: { text: null}, 
    categories: chartCategories, 
    tickmarkPlacement: 'on', 
    labels: { 
     useHTML: false, 
     step: 2, 
     rotation: -40 
    }, 
    y: 30 
} 

結帳here

0

您可以隨時扭轉你的數據:http://jsfiddle.net/skqshs9e/4/

var chartCategories = [ 
    '2015-01-01 - 2015-02-01', 
    '2015-02-02 - 2015-03-04', 
    '2015-03-05 - 2015-04-05', 
    '2015-04-06 - 2015-05-06', 
    '2015-05-07 - 2015-06-08', 
    '2015-06-09 - 2015-07-10', 
    '2015-07-11 - 2015-08-11', 
    '2015-08-12 - 2015-09-12', 
    '2015-09-13 - 2015-10-14', 
    '2015-10-15 - 2015-11-16', 
    '2015-11-17 - 2015-12-18', 
    '2015-12-19 - 2015-12-31' 
].reverse(); 
$('#container').highcharts({ 
    legend: { enabled: false}, 
    xAxis: { 
     title: { text: null}, 
     categories: chartCategories, 
     tickmarkPlacement: 'on', 
     labels: { 
      useHTML: false, 
      step: 2, 
      rotation: -40 
     }, 
     y: 30 
    }, 

    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].reverse() 
    }] 
});