cant make地図がJquery touchでモバイルアプリに表示される

Question

Google Maps APIを使用して地図を表示するアプリケーションを開発しようとしています。しかし、私はそれを最新のリリース候補と連動させることはできません。 私はこのベビーベッドを古いバージョンで扱っています。 私はそれをこのjsFiddleに入れて、あなたはそれが生きているのを見ることができます。事前に
http://jsfiddle.net/huqY3/

おかげ

Answer 1

あなた#map_canvasとそのdivの親は0PXの高さを持っています。 Googleマップは読み込まれますが、目に見えないコンテナに表示されます。

私はJqueryMobileがあなたのインラインCSSスタイルをオーバーライドすると思います。

これを修正するには、pagecreateイベントの後に#map_canvasの高さを手動で設定するだけです。固定の高さ（すなわち500pxなど）、または計算された1（文書の高さを取得し、ヘッダの高さを引きます。）

例えば次のいずれかの

$('.page-map').live("pagecreate", function() 
{ 
    var docH = $('body').height(); 
    var headH= $('body > div:eq(1)').height(); 
    $('#map_canvas').height(docH-headH); 

    initialize(); 
}); 

はたぶんそれが最善の方法ではないのですが、それは難しいですあなたのプロジェクトについて知らずに教えてください。