時にはうまくいくことがあります。時にはうまくいきません。非常に奇妙な。断続的なアプリケーションクラッシュ:JQM Beta 3、Google Maps v3、およびMVC
私はJQuery Mobileアプリケーションを作成しました。このアプリケーションの一部は、Googleマップにアクセスして、ユーザーが選択した特定の場所の地図を表示します。このコードは、時間の約50%を正しく実行します。私はそれが欲しいのと同じように素晴らしい作品...しかし、残りの50%はアプリケーションがクラッシュします。クラッシュすると、アプリケーションが突然停止してシャットダウンすることを意味します。警告やエラーメッセージはありません。アプリケーションはもはや実行されていません。 私のアーキテクチャはこれです:マスターページを使用するMVC 2.0。 JQM Beta 3、Google Maps API v3このアプリケーションは、先ほど紹介したテクノロジを使用したWebアプリケーションですが、インストールされている「ネイティブ」のiPhoneアプリケーション内で、WebブラウザSafari内で実行されています。上記のように、アプリケーションがクラッシュすると、ネイティブのiPhoneアプリケーションがクラッシュします。 デバッグ/トラブルシューティング:モバイルデバイス上のネイティブブラウザSafariを使用し、Webサーバー上で実行されているWebアプリケーションに移動するだけで、クラッシュすることなく、100%の時間でアプリケーションを正常に実行できます。 「インストール済み」の「ネイティブ」iPhoneアプリケーションを起動し、ネイティブアプリケーションを同じWebサーバー上で実行している同じWebアプリケーションにナビゲートしてから、アプリケーションのマップ部分に移動すると、最初の段落が発生します。私は現在、iPhoneデバイスでネイティブに生成された「クラッシュレポート」を取得して分析しようとしていますが、クラッシュレポートからの有用な情報はまだありません。
私はいくつかの非常に基本的な、標準コードで、Googleマップのかなり単純な実装を使用しています:
<script type="text/javascript">
$('#gmap-2').live("pageshow", function() {
initMap();
});
function initMap() {
var latlng = getLatLng();
var myOptions = {
zoom: 12,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function getLatLng() {
var latitude = "<%: Model.Latitude %>"; // "32.931962";
var longitude = "<%: Model.Longitude %>"; //"-96.789191";
var TSlatlng = new google.maps.LatLng(latitude, longitude);
return TSlatlng;
}
</script>
<div data-role="content" data-theme="c">
<div class="ui-bar-c ui-corner-all ui-shadow" style="padding: 1em;">
<div id="map_canvas" style="height: 300px;">
</div>
</div>
</div>
"ヘッダ" は次のようになります。
<!-- google maps api script -->
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<!-- core jQuery -->
<script src="../../../../Scripts/jquerymobile/js/jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).bind("mobileinit", function() {
$.mobile.page.prototype.options.addBackBtn = true;
});
</script>
<!-- core jQuery Mobile -->
<!-- BETA 3 -->
<script src="../../../../Scripts/jquerymobile/js/jquery.mobile-1.0b3.min.js" type="text/javascript"></script>
</head>