google map的开发

  • 内容
  • 评论
  • 相关

本实例主要是基于Map JavaScript API V3的,因此扩平台性很好。

package com.example.simplemap;

import java.io.InputStream;
import org.xml.sax.InputSource;
import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.AlertDialog;
import android.view.Menu;
import android.webkit.WebView;
import android.webkit.WebViewClient;

@SuppressLint("JavascriptInterface")
public class MainActivity extends Activity {
	private WebView mWebView;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		try{
			InputStream is = getResources().getAssets().open("simple_map.html");
			byte[] buffer = new byte[2000];
			int count = is.read(buffer);
			String mapStr = new String(buffer, 0, count, "utf-8");
			is.close();
			
			mWebView = (WebView) findViewById(R.id.webview);
			mWebView.getSettings().setJavaScriptEnabled(true);
			
			mWebView.setWebViewClient(new WebViewClient());
			mWebView.addJavascriptInterface(new Object()
			{
				public void showDialog(String title, float latitude, float longitude)
				{
					new AlertDialog.Builder(MainActivity.this)
							.setTitle(title).setIcon(R.drawable.ic_launcher)
							.setMessage("纬度:" + latitude + "\n经度:" + longitude)
							.show();
				}  

			}, "android");
			mWebView.loadDataWithBaseURL(null, mapStr, "text/html", "utf-8", null);
		}catch(Exception e){
			
		}
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">

<style type="text/css">
html,body {
	height: 100%;
	margin: 0;
	padding: 0;
}

#map_canvas {
	height: 100%;
}

@media print {
	html,body {
		height: auto;
	}
	#map_canvas {
		height: 650px;
	}
}
</style>
<script
	src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
      function initialize() {
        var mapOptions = {
          zoom: 15,
          center: new google.maps.LatLng(30.211321, 120.210555),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById('map_canvas'),
            mapOptions);

       
        var p = new google.maps.LatLng(30.211321, 120.210555);
       

        var marker = new google.maps.Marker({
            position: p,
            map: map
          });

        google.maps.event.addListener(marker, 'click', function() {
           window.android.showDialog("柏悦轩", p.lat(), p.lng());
          });

      }


      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas"></div>
  </body>
</html>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical" android:layout_width="fill_parent"
	android:layout_height="fill_parent">
	<WebView
		android:id="@+id/webview" android:layout_width="fill_parent"
		android:layout_height="fill_parent"  />
</LinearLayout>

完整项目地址
http://pan.baidu.com/s/1jGmLvim

评论

0条评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注