2013-04-25 100 views
2

當窗口大小縮小時,我無法讓我的高圖減小尺寸。當窗口調整大小時,如何讓我的高圖減小尺寸

我在的jsfiddle創造了我的代碼示例http://jsfiddle.net/britboy/UvFaQ/

<table border='1' width='100%'><tr><td width='100%'> 
<div id="container" width='100%'></div> 
</td></tr></table> 

其顯示在表的簡單Highchart圖表 - 如果我使窗口更大的圖表擴展,但是如果我讓窗口更小圖表不希望減少表格獲取滾動條。

我試着設置resize事件,然後用chart.setSize()調整圖表大小,但問題是包含圖表的div永遠不會減小任何進一步的大小,所以setSize()不會觸發。由於圖表容器變大時圖表會自動調整大小,因此儘管在圖表變小時圖表容量應該一樣。我認爲問題在於圖表的大小阻止了它的容器縮小。

如何在表格中對圖表進行編碼,以減小表格時的尺寸? 謝謝

+0

檢查了這一點http://stackoverflow.com/questions/13768565/resize-height-with-highcharts – azeem 2013-04-25 12:26:33

+0

** [調整隱藏圖表+調整的窗口上risize] [1] ** [1]:http://stackoverflow.com/questions/16216722/highcharts-hidden-charts-dont-get-re-size-properly/25083192#25083192 – Davide 2014-08-01 20:11:15

回答

3

ñ數量的方式來實現它。

有人會像@Azeem指出的那樣。在評論中。

其他方式,我實際上是用window來綁定它。無論何時窗口重新調整大小,綁定事件都會觸發一個函數來重新調整用於呈現圖表的div元素的大小。

$(window).bind("resize", resizeChart); 

然後,

function resizeChart() { 
    var width = $(document).width() - 55; 
    var height = $(document).height() - 60; 
    $("#container").css("width", width); 
    $("#container").css("height", height); 
} 

退房樣品小提琴here

+0

謝謝你同時迴應。將resizeChart代碼放在一個計時器上,然後專門製作一個chart.setSize(),來設置實際的高圖表div對象的尺寸。 – Britboy 2013-04-25 15:36:24

相關問題