当前位置: 代码迷 >> HTML/CSS >> Google Map跟HTML5定位和动态加载
  详细解决方案

Google Map跟HTML5定位和动态加载

热度:152   发布时间:2012-11-04 10:42:42.0
Google Map和HTML5定位和动态加载
动态加载!
<script>
function loadScript() {
			var script = document.createElement("script");  
			script.type = "text/javascript";
			script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=getGeoLocation";  
			document.body.appendChild(script);  
};
function getGeoLocation(){
	if(navigator.geolocation) {
		navigator.geolocation.getCurrentPosition(function(position) {
			var point = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
			console.log("position.coords.latitude:"+position.coords.latitude+"   position.coords.longitude:"+position.coords.longitude);
			var myOptions = {
				zoom: 15,
				center: point,
				mapTypeId: google.maps.MapTypeId.ROADMAP
			};
			
			var mapDiv = document.getElementById("rescue-map");
			var map = new google.maps.Map(mapDiv, myOptions);
			
			var marker = new google.maps.Marker({
				position: point,
				map: map,
				title: "You are here"
			});
		});
	}
}
window.onload = loadScript;
<script>
<div id="rescue-map" ></div>
  相关解决方案