是否可以在phonegap中運行google map api？

我正在用apache cordava（Phonegap）構建一個應用程序。我的問題是，我可以在那裏運行谷歌地圖API？在此先感謝是否可以在phonegap中運行google map api？

2016-03-26 arun kamaraj

是的，你可以在你的phonegap/cordova應用程序中運行googlemaps API。首先你需要得到一個API鍵（基於瀏覽器，而不是Android的）。通過生成您的API_KEY並使用它開始。

然後你需要將網址列入白名單，下面是一個簡單的index.html，它用一個標記加載地圖。希望它有助於

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta http-equiv="Content-Security-Policy" content="script-src 'self' https://maps.googleapis.com/ https://maps.gstatic.com/ https://mts0.googleapis.com/ 'unsafe-inline' 'unsafe-eval'"> 
<style> 
    body, html, #map { margin: 0;width:100%;height:400px } 
#map { 
    position: relative; 
    width:400px; 
    height: :50%; 
} 

#map:after { 
    width: 22px; 
    height: 40px; 
    display: block; 
    content: ' '; 
    position: absolute; 
    top: 50%; left: 50%; 
    margin: -40px 0 0 -11px; 
    background: url('https://maps.gstatic.com/mapfiles/api-3/images/spotlight-poi_hdpi.png'); 
    background-size: 22px 40px; 
    pointer-events: none; 
} 

    </style> 



    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initialize" async defer></script> 
    <script type="text/javascript" src="cordova.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> 


    <script type="text/javascript"> 
     function initialize() { 
      var mapOptions = { 
      zoom: 4, 
      center: new google.maps.LatLng(-33, 151), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      map = new google.maps.Map(document.getElementById('map'), mapOptions); 
     } 



    </script> 
    </head> 
    <body> 
    <div id="map"></div> 

    </body> 
</html>

您可以在這裏

https://developers.google.com/maps/documentation/javascript/examples/map-simple

你可以看到在這裏創建API密鑰閱讀更多關於谷歌地圖API

https://developers.google.com/maps/documentation/javascript/get-api-key

來源

2016-03-31 09:51:45 IamKarim1992

讓我試試這個，會讓你知道@IamKarim –

是否可以在phonegap中運行google map api？

回答

相關問題