Highcharts Y軸水平標題

Question

我使用highcharts來創建一個簡單的折線圖。默認情況下，Y軸有一個垂直標題，但我希望水平位於頂部。

長話短說 - 我被困在左邊的額外空間。這是我如何定義我的Y軸：

yAxis: [{ 
    title: { 
    align: "high", 
    textAlign: "left", 
    rotation: 0, 
    offset: 0, 
    margin: 0, 
    y: -20, 
    x: -15, 
    text: "some long axis title" 
    }, 
    labels: { 
    align: "left", 
    y: -5, 
    x: -15 
    } 
}] 

的工作示例見琴：http://jsfiddle.net/zc1Lc5c6/3/

試着改變y軸的文字，看看會發生什麼。我可以通過使用負的spacingLeft來修復它，但軸標題是動態的，如果可能的話，我更喜歡更好的方法。

這是一個錯誤還是我錯過了什麼？

Answer 1

我相信這是一個錯誤，但這種情況下的一個簡單的解決方法是設置一個左邊距。 一個例子來看看這個小提琴：http://jsfiddle.net/zc1Lc5c6/6/

小提琴代碼：

$(function() { 

    $('#container').highcharts({ 
    title: "", 
    chart: { 
     spacing: [5, 5, 5, 5], 
     marginLeft: 32 
    }, 
    legend: { 
     layout: "horizontal", 
     align: "right", 
     verticalAlign: "top", 
     itemDistance: 10, 
     symbolHeight: 8, 
     symbolPadding: 1, 
     padding: 0, 
     margin: 20, 
     itemMarginBottom: 3 
    }, 
    plotOptions: { 
     series: { 
     dataLabels: { 
      enabled: false 
     }, 
     marker: { 
      symbol: "circle", 
      radius: 4, 
      states: { 
      hover: { 
       radiusPlus: 1 
      } 
      } 
     }, 
     showInLegend: true 
     }, 
     line: { 
     states: { 
      hover: { 
      halo: { 
       size: 8 
      } 
      } 
     } 
     } 
    }, 
    series: [{ 
     type: "column", 
     name: "First column", 
     data: [5, 2, 13, 3, 3, 6, 2, 3, 2, 1, 5, 2, 1] 
    }, { 
     type: "line", 
     name: "First line", 
     data: [3, 1, 7, 1, 1, 5, 1, 2, 1, 1, 3, 1, 0], 
     yAxis: 1, 
     showInLegend: false 
    }, { 
     type: "column", 
     name: "Second column", 
     data: [7, 1, 2, 6, 2, 6, 4, 2, 3, 3, 6, 2, 3] 
    }, { 
     type: "line", 
     name: "Second line", 
     data: [3, 0, 2, 3, 1, 3, 2, 2, 3, 1, 3, 2, 2], 
     yAxis: 1, 
     showInLegend: false 
    }], 
    yAxis: [{ 
     visible: true, 
     tickPosition: "inside", 
     offset: 0, 
     title: { 
     text: "# tasks", 
     align: "high", 
     textAlign: "left", 
     rotation: 0, 
     offset: 0, 
     margin: 0, 
     y: -5, 
     x: -7 
     }, 
     labels: { 
     align: "right", 
     y: -5 
     } 
    }, { 
     visible: true, 
     tickPosition: "inside", 
     offset: 0, 
     type: "linear", 
     title: { 
     text: "# completed", 
     align: "high", 
     textAlign: "left", 
     rotation: 0, 
     offset: 0, 
     margin: 0, 
     y: 12, 
     x: -7 
     }, 
     labels: { 
     align: "right", 
     y: 12 
     } 
    }], 
    xAxis: { 
     labels: { 
     y: 16 
     }, 
     categories: [ 
     "2016 W31", 
     "2016 W32", 
     "2016 W33", 
     "2016 W34", 
     "2016 W35", 
     "2016 W36", 
     "2016 W37", 
     "2016 W38", 
     "2016 W39", 
     "2016 W40", 
     "2016 W41", 
     "2016 W42", 
     "2016 W43" 
     ] 
    } 
    }); 
});