Highcharts柱形圖溢出的繪圖區

的問題是如下：Highcharts柱形圖溢出的繪圖區

如果非要用柱圖表類型非常人口稀少日期時間x軸然後一些列得到切割。

這裏是小提琴例如：http://jsfiddle.net/qzqnX/

在這個例子中，我有兩列，在最末端的列得到削減。

如果我將數據增加到3列，其中一個系列會完全隱藏。

這裏是小提琴例如：http://jsfiddle.net/GrKKt/

我想有繪圖區域內顯示的列，並沒有得到部分切割或隱藏。如果他們從劇情區域的四肢畫出一些邊緣，也會很好。謝謝。

來源

2011-10-17 Mr.Hunt

我已經發現了兩個解決問題的方案上面：

首先解決作爲第一個答案是給予加空。我發現添加兩個空值是最佳的，並且工作正常。即使你的數據有很多系列。

實施例：http://jsfiddle.net/vwzeP/

第二溶液是添加minPadding，maxPadding到x軸。無需爲您的輸入添加空值。但是highcharts在填充行爲方面有點不一致。所以你需要爲min/maxPadding屬性應用不同的值。一旦在datetime x軸上的點數超過6個點，列寬就會根據繪圖區域自動設置，您可以將minPadding/maxPadding設置爲默認值0.01。

良好填充值以下：http://jsfiddle.net/J7zsk/

希望這有助於其它：填充有2個數據陣列

switch (numberOfPointsInDataArray) { 
     case 1: 
     case 2: 
      padding = 0.25; 
      break; 
     case 3: 
      padding = 0.13; 
      break; 
     case 4: 
      padding = 0.075; 
      break; 
     case 5: 
      padding = 0.05; 
      break; 
     case 6: 
      padding = 0.03; 
      break; 
    }

實施例。

來源

2011-10-21 08:11:29

使用日期時間軸時，不能很好地處理列的寬度，解決此問題的最佳方法是在日期之間輸入空值。像這樣：

chart: { 
    renderTo: 'container', 
    type: 'column' 
}, 

xAxis: { 
    type: 'datetime' 
}, 

series: [{ 
    data: [29.9, null, null, null, null, null, 71.5], 
    pointStart: Date.UTC(2010, 0, 1), 
    pointInterval: 1 * 24 * 3600 * 1000 // one day 
    }, 
{ 
    data: [29.9, null, null, null, null, null, 71.5], 
    pointStart: Date.UTC(2010, 0, 1), 
    pointInterval: 1 * 24 * 3600 * 1000 // one day 
    }]

這將使計算寬度在7天之間均勻分佈。例如jsfiddle。

http://i55.tinypic.com/o5x451.png

來源

2011-10-18 12:56:32 eolsson

謝謝你的迴應。有用。 –

Highcharts柱形圖溢出的繪圖區

回答

相關問題