Android學習紀錄 - Google Map API v3實作

STEP1：加入權限(很容易忽略)



STEP2： 在介面上設定一個WebView物件



STEP3：建立要儲存HTML檔的地圖的資料夾(資料夾名稱：Assets)

STEP4：將生成的地圖放入資料夾裡


STEP5：在程式裡指定一個字串名稱為地圖的路徑位置



>> file:///android_asset/地圖名稱.html

 >>在OnCreate呼叫設定的function

function可以這樣寫 >>



地圖html可以這樣寫：
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Google Maps API V3實作測試</title>
    <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script>
      var centerPoint = new google.maps.LatLng(23.7468758,120.9527377);/**地圖初始化的中心點經緯度座標**/
      var map;
      var image = 'picture.png';/**自定義的圖片名稱與副檔名**/
       
      function initialize() {/**初始化地圖**/
        var mapOptions = {
          zoom: 7,/**地圖的縮放比例**/
          mapTypeId: google.maps.MapTypeId.HYBRID,/** 地圖類型：ROADMAP 一般地圖, HYBRID 衛星地圖, ATELLITE 衛星地圖(無顯示街道), TERRAIN 地理地圖**/                          
          center: centerPoint/**上面設的中心點**/
        };
        map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions);
      }
    </script>
  </head>
  
  <body onload="initialize()">
    <!--在style裡面可以設定地圖顯示的大小-->
    <div id="map_canvas" style="width: device-width; height: 760px;">map div</div>
  </body>
</html>



留言

張貼留言