Googleマップはブラウザに表示されますが、実際のデバイスには表示されません。

Question

私はイオンプラットフォームを初めて使用しています。私はapp.MapにGoogleマップを実装しようとしています.Mapはブラウザでテストしているときに表示されますが、Android上の実際のデバイスで実行すると、単に白い画面が表示されます。私は別のスレッドで推奨されるものとは異なる数のものを試しました。私は下のリンク

https://github.com/driftyco/ionic-starter-maps/issues/10

が、運に述べたように、設定ファイルの変更を適用しており、他のスレッドが、運に説明するよう個別にメタタグの異なる数を使用して変更を適用しています。コンソールでは、「Uncaught ReferenceError：google is not defined」というエラーが表示されます。このために私は

Uncaught ReferenceError: google is not defined

下に述べたように、別のスレッドを試みたが、まだ同じエラーを取得しています。私は以下の行方不明です他out.Whatこのエラーを理解することはできませんよ、私は私のapp.Indexページのコードで使用する共有していたコードが

ですこれは私のコントローラのコード

.controller('MapCtrl', function($scope, $ionicLoading) { 
google.maps.event.addDomListener(window, 'load', function() { 
     var myLatlng = new google.maps.LatLng(37.3000, -120.4833); 

     var mapOptions = { 
      center: myLatlng, 
      zoom: 16, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var myDiv=document.getElementById("map"); 
     var map = new google.maps.Map(myDiv, mapOptions); 
    }); 
}) 

です

以下は、異なるスレッド

<access origin="*"/> 
<access origin="http://maps.google.com"/> 
<access origin="https://maps.google.com"/> 
<access origin="http://*.googleapis.com"/> 
<access origin="https://*.googleapis.com"/> 

すべてのヘルプで推奨されているように私は、configファイルに追加した行です

Answer 1

ファイルindex.htmlでGoogleマップをうまく読み込んでいないようです。 <script src="//maps.google.com/maps/api/..."></script>

ブラウザ上で、それは、このスクリプトをロードします：あなたはファイルをHTTP経由で提供されているのでhttp://maps.google.com/maps/api/...

問題はラインです。

ただし、デバイスではfile://からファイルを提供していますので、このスクリプトをロードしようとします。file://maps.google.com/maps/api/... これは利用できません。

ですから、このようなhttpsを指定する必要があります。次の時間のために

<script src="https://maps.google.com/maps/api/..."></script>