谷歌圖表：時間軸：帶有比例尺位置的動態高度

感謝您的查看和回答。我正在使用Google Charts（TimeLine）來顯示來自數據庫的信息。但Google圖表引用僅爲圖表提供了設置固定高度。雖然我想根據從數據獲得的行數來更改圖表高度。所以我做的代碼：谷歌圖表：時間軸：帶有比例尺位置的動態高度

var graph = $('#chart_timeLine').children()[0].children[0].children[1]; 
    $(graph).css('height',graph.scrollHeight); 
    $(graph).css('overflow-y','auto');

現在圖表沒有垂直滾動條，我很滿意。但我發現顯示時間軸圖的比例尺的比例尺缺失（它實際上隱藏在圖表下方，而不是顯示在圖表底部）。

然後我將比例尺的位置改爲絕對值，並將其設置在我的圖表底部。然後它很醜，因爲它的高度爲200px，而比例尺在200px的底部，在我的圖表和比例尺之間留下了一個巨大的空白。

是否有修復？謝謝。

來源

2013-09-05 user2751332

而是與圖表的內部工作搞亂的，設置高度基於數據的行中的數據表的數目：

// set a padding value to cover the height of title and axis values 
var paddingHeight = 40; 
// set the height to be covered by the rows 
var rowHeight = data.getNumberOfRows() * 15; 
// set the total chart height 
var chartHeight = rowHeight + paddingHeight;

，然後在時間軸的選項中，設置高度：

height: chartHeight

來源

2013-09-05 18:23:16 asgallant

我明白了，謝謝你。這個想法很有效，即使我嘗試了這個實現，但它不能很好地工作。我跳回去固定高度，因爲使用動態高度最終會達到與固定高度相同的效果（滾動是不可避免的，在我的情況下，無論它是整個頁面還是圖表本身都沒有關係）。感謝你的努力。 – user2751332

@asgallant如果可以的話，我會抱你。謝謝！ –

對於併發事件，這不起作用，因爲表中的行數是相同的，但事件是堆疊顯示的。 –

我試過了答案，但它對我不起作用。我得到了它爲我的工作方式是這樣的：

// Calculate height 
    var rowHeight = 41; 
    var chartHeight = dataTable.getNumberOfRows() * rowHeight + 50; 

    var options = { 
     height: chartHeight 
    }

的+ 1到getNumberOfRows（）是X軸的文本。

來源

2013-12-12 20:14:42 ScubaSteve

這仍然沒有找到完全的高度。 – Khrys

@Khrys這是因爲'dataTable.getNumberOfRows（）'返回數據項的數量，而不是圖表中的行數。應該手動計算圖表中的行數。 – Dan

$.ajax({ 
    ... 
    success: function(jsonData){ 
    ... 
    var options = { 
     height: (jsonData.length * 40) + 80, 
     timeline: { colorByRowLabel: true } 
    }; 

    chart.draw(dataTable, options); 
} 
});

來源

2015-12-01 17:38:31

據我可以告訴它：

30像素高度，每個酒吧
10px的填充每個組。
60px爲系列。

所以對於一個9杆組=（30 * 9）+ 10 = 280像素圖身高= 280像素+ 60像素

如果您在分組行，你需要確定你的日期範圍的任何重疊其他人在該組。

谷歌通過這樣處理：

Getting the Group items IN START DATE ORDER 
Creating an empty array of Group Display Rows 

For each Group Item: 
    For each Display Row 
     If Item fits in Row... 
     Add it to existing Display Row 
    Next 

    If No existing Display row found 
     Add New Display Row 
Next

來源

2016-07-06 09:02:20

這也取決於顯示分辨率，它可能是兩個事件實際上並不重疊，但由於四捨五入，它們可以佔據相同的像素。它認爲任何重現此行爲的嘗試必然會給你帶來問題，如果API本身以某種方式支持它，那將是最好的選擇。 –

谷歌圖表：時間軸：帶有比例尺位置的動態高度

回答

相關問題