Highchart泡沫與最大x/y軸線隔絕

-1

我需要有xAxis和yAxis從0到5的氣泡圖。如果我在xAxis或yAxis 5上有氣泡，氣泡會被切割。Highchart泡沫與最大x/y軸線隔絕

$(function() { 
    $('#container').highcharts({ 

     chart: { 
      type: 'bubble', 
      zoomType: 'xy', 
      height: 500, 
      width: 500, 
     }, 
     title: { 
      text: 'Highcharts Bubbles' 
     }, 
     yAxis: { 
      min: 0, 
      max: 5, 
      gridLineWidth: 1, 
     }, 
     xAxis: { 
      min: 0, 
      max: 5, 
      gridLineWidth: 1, 
     }, 
     series: [{ 
      data: [[5, 4, 2], [3, 1, 1], [4, 2, 3], [1, 2, 3], [1, 4, 1], [2, 5, 1], [5, 2, 3], [3, 2, 1]] 
     }] 
    }); 
});

http://jsfiddle.net/tum3zzzu/1/

我莫名其妙地發現了一個招用做最大：5.5，但它僅適用於x軸的工作。 On yAxis max：5.5被四捨五入爲6.

我該如何解決這個問題？

來源

2015-04-23 Alexandre

如果我把endOnTick：false;和最大值：5.5;它以某種方式使工作，但它仍然不完美，因爲我們看到網格線超過5. http://jsfiddle.net/tum3zzzu/2/ – Alexandre

而不是最大，你可以使用[maxPadding]（http：//api.highcharts。 com/highcharts＃yAxis.maxPadding），那麼你就避免了靜態值。 –

@SebastianBochan我需要使用max來顯示軸直到5，即使沒有氣泡的X或Y爲5。 – Alexandre

您可以使用tickPositioner告訴圖表確切地顯示爲滴答。我還用showLastLabel: false隱藏最後一個勾號（5.5）。您可以在代碼中執行以下操作：

yAxis: { 
    min: 0, 
    max: 5.5, 
    endOnTick: true, 
    showLastLabel: false,  // to hide 5.5 
    gridLineWidth: 1, 
    tickPositioner: function() { 

     var positions = [0],  // to start from 0 
      tick = Math.floor(this.dataMin), 
      increment = Math.ceil((this.dataMax - this.dataMin)/6); 

     for (tick; tick - increment < this.dataMax; tick += increment) { 
      positions.push(tick); 
     } 

     positions.push(this.dataMax + 0.5); // to add the last label 5.5 

     return positions; 
    } 
}

而這裏是DEMO。

來源

2015-04-25 05:11:31

@Alexandre是否可以工作？ –

爲showLastLabel +1。但是，我沒有看到你的代碼其餘部分的目的！最大值：5.5，endOnTick：true就足夠了。但實際上，最好的方法是獲得像填充一樣的東西，並使座標軸真的從0到5. – Alexandre

下面是如果刪除** tickPositioner **函數時的樣子：http://jsfiddle.net/tum3zzzu/9/yAxis變爲6，xAxis變爲5.5，圖表不再是方形，它是一個矩形。 –

Highchart泡沫與最大x/y軸線隔絕

回答

相關問題