我正在使用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應該只是調整大小以適合在容器內。
任何幫助將不勝感激。