2012-12-24 52 views
1

我正在使用Google的圖表API開發移動網站。一切工作都很精美,並且在其他測試設備上應該可以縮放,但由於某種原因,Google的「桌子」圖表在iPhone上查看時已經脫離了它的容器。它在縮小的瀏覽器窗口,Android平板電腦和Galaxy SII上看起來很好。我已經確認這不是移動Safari的問題。Google Chart API突破iPhone上的容器

圖表通過iFrame加載,並按比例縮放以適合寬度:其容器的100%,即Dreamweaver「Fluid Grid Layout - Gridcontainer」元素。柱形圖和折線圖都可以正確縮放到100%,但表格會增長以適應所有內容,然後脫離gridcontainer。

在其他設備上,網格會顯示邊界內的內容並添加滾動。

這是將圖表繪製到頁面的php/html代碼。

<div id="top-prods" class="chart" style="width: 100%; height: 500px;"> 
<?php 
    if($charts->isData() == "true"){ 
     echo "<iframe id=\"top-chart\" src=\"controls/charts/top_prods.php?loc=".$loc."&comp=".$company_id; 
     if($xDate != "") {echo "&xDate=".$xDate;} 
     if($yDate != "") {echo "&yDate=".$xDate;} 
     echo "\" style=\"width:100%;\" scrolling=\"no\"></iframe>"; 
    } 
?> 

唯一的CSS是在Gridcontainer定義,因爲所述iFrame應該只是調整大小以適合在容器內。

任何幫助將不勝感激。

回答