ANDROID 开发：谷歌地图开发入门（3）--- google map api v3 入门教程辅助_android studio 3.4 google map api v几-CSDN博客

原创:http://blog.csdn.net/springyama/article/details/8518459

google map api v3是不用密钥的，其是将网页加载到ANDROID的WEBVIEW控件中来实现。以下链接是官方开发指南，但是由于某些原因，照搬指南可能会不成功。

https://developers.google.com/maps/documentation/javascript/tutorial?hl=zh-CN

以下是我经过实践的步骤：

一、新建一个ANDROID 项目，目录应该如下（其中“images”文件夹为我后来添加的），

接着在assets文件夹下新建一个HTML文件“map_v3.html”，内容如下：

[html]view plaincopy 
   
 <html>  
 <head>  
 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
 <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>  
 <title>this is title.</title>  
   
 <script type="text/javascript"  
     src="http://maps.google.com/maps/api/js?sensor=true">  
 </script>  
 <script type="text/javascript">  
   var map;  
   function initialize() {  
     var latitude = 0;  
     var longitude = 0;  
     if (window.android){  
       latitude = window.android.getLatitude();  
       longitude = window.android.getLongitude();  
     }  
       
     var myLatlng = new google.maps.LatLng(latitude,longitude);  
     var myOptions = {  
       zoom: 8,  
       center: myLatlng,  
       mapTypeId: google.maps.MapTypeId.ROADMAP  
     }  
     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);  
       
     var marker = new google.maps.Marker({  
       position: myLatlng,   
       map: map,    
       title:"Hello World,I am here!"  
   });     
     // To add the marker to the map, call setMap();  
    //marker.setMap(map);    
   
   }  
   function centerAt(latitude, longitude){  
     myLatlng = new google.maps.LatLng(latitude,longitude);  
     map.panTo(myLatlng);  
       
   }  
   
 </script>  
   
 </head>  
 <body style="margin:0px; padding:0px;" onload="initialize()">  
   <div id="map_canvas" style="width:100%; height:100%"></div>  
 </body>  
 </html>  

二、在“layout”文件夹下新建一个XML文件“map_v3.xml”，在其中放置一个WebView控件，具体代码如下：

[html]view plaincopy 
   
 <?xml version="1.0" encoding="utf-8"?>  
 <LinearLayout  
   xmlns:android="http://schemas.android.com/apk/res/android"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent">  
   <WebView  
   android:layout_width="match_parent"  
   android:layout_height="match_parent"  
   android:id="@+id/webview01"  
   ></WebView>  
 </LinearLayout>  

三、在"src"文件夹下新建一个“WebMapActivityJSInterface.java“文件，代码如下：

[java]view plaincopy 
   
    
   
 package test.com;  
   
 import android.app.Activity;  
 import android.content.Context;  
 import android.content.pm.ActivityInfo;  
 import android.location.Location;  
 import android.location.LocationListener;  
 import android.location.LocationManager;  
 import android.location.Criteria;  
 import android.os.Bundle;  
 import android.webkit.WebView;  
 import android.webkit.WebViewClient;  
   
 public class WebMapActivityJSInterface extends Activity implements LocationListener {  
 //  private static final String MAP_URL = "http://gmaps-samples.googlecode.com/svn/trunk/articles-android-webmap/simple-android-map.html";  
   private static final String MAP_URL = "file:///android_asset/map_v3.html";  
   private WebView webView;  
   private Location mostRecentLocation;  
   
   @Override  
   /** Called when the activity is first created. */  
   public void onCreate(Bundle savedInstanceState) {  
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.map_v3);  
     getLocation();  
     setupWebView();  
     this.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);  
   
   }  
   /** Sets up the WebView object and loads the URL of the page **/  
   private void setupWebView(){  
   
     webView = (WebView) findViewById(R.id.webview01);  
     webView.getSettings().setJavaScriptEnabled(true);  
     webView.setWebViewClient(new WebViewClient());  
     webView.loadUrl(MAP_URL);    
   
     /** Allows JavaScript calls to access application resources **/  
   //  webView.addJavascriptInterface(new JavaScriptInterface(), "android");  
   
   }  
   
   /** Sets up the interface for getting access to Latitude and Longitude data from device **/  
   private class JavaScriptInterface {  
     public double getLatitude(){  
       return mostRecentLocation.getLatitude();  
     }   
     public double getLongitude(){  
       return mostRecentLocation.getLongitude();  
     }  
   
   }  
   
   
   /** The Location Manager manages location providers. This code searches 
         for the best provider of data (GPS, WiFi/cell phone tower lookup, 
         some other mechanism) and finds the last known location. 
    **/  
   private void getLocation() {        
     LocationManager locationManager = (LocationManager)getSystemService(Context.LOCATION_SERVICE);  
     Criteria criteria = new Criteria();  
     criteria.setAccuracy(Criteria.ACCURACY_FINE);  
     String provider = locationManager.getBestProvider(criteria,true);  
   
     //In order to make sure the device is getting location, request updates.        locationManager.requestLocationUpdates(provider, 1, 0, this);  
     mostRecentLocation = locationManager.getLastKnownLocation(provider);  
   }  
   
   /** Sets the mostRecentLocation object to the current location of the device **/  
   @Override  
   public void onLocationChanged(Location location) {  
     mostRecentLocation = location;  
   }  
   
   /** The following methods are only necessary because WebMapActivity implements LocationListener **/   
   @Override  
   public void onProviderDisabled(String provider) {  
   }  
   
   @Override  
   public void onProviderEnabled(String provider) {  
   }  
   
   @Override  
   public void onStatusChanged(String provider, int status, Bundle extras) {  
   }  
   
 }  