2013-04-27 48 views
0

我需要製作一個頁面給出用戶的經度和緯度,然後允許用戶點擊一個按鈕,讓他們可以圍繞銷釘(顯示其當前位置)圍繞谷歌地圖。我對如何做到這一點完全困惑。我認爲這將是一個功能。我已經在我的代碼中聲明瞭函數,但我不知道如何執行此操作。任何幫助將不勝感激。謝謝!中心pin google地圖

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8" /> 

<!-- This page will allow the suer to track their location through means of the HTML5 Geolocation feature --> 

<title>Assignment 4:Track My Location</title> 
<meta name="author" content="Alan Sylvestre" /> 

<script src="http://maps.google.com/maps/api/js?sensor=false"></script> 

<script> 
    function myLocation() { 
     if (navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(locationReveal); 
     } else { 
      alert("Please use a different browser that supports geolocation."); 
     } 
    } 


    window.onload = myLocation; 

    function locationReveal(position) { 
     showMap(position.coords); 
     var latitude = position.coords.latitude; 
     var longitude = position.coords.longitude; 
     var div = document.getElementById("location"); 
     div.innerHTML = "You are at Latitude: " + latitude + ", Longitude: " + longitude; 
    } 

    var map; 
    function showMap(coords) { 
     var googleLatAndLong = new google.maps.LatLng(coords.latitude, coords.longitude); 
     var mapOptions = { 
      zoom : 18, 
      center : googleLatAndLong, 
      mapTypeId : google.maps.MapTypeId.SATELLITE 
     }; 
     var mapDiv = document.getElementById("map"); 
     map = new google.maps.Map(mapDiv, mapOptions); 
     addMarker(googleLatAndLong); 

    } 


    google.maps.Map(mapDiv, mapOptions); 

    var marker; 
    function addMarker(latlong) { 
     var markerOptions = { 
      position : latlong, 
      map : map 
     }; 
     marker = new google.maps.Marker(markerOptions); 
    } 

    var center; 
    function calculateCenter() { 
     center = map.getCenter(); 
    } 

</script> 

</head> 

<body style="background-color:yellow;" text="blue;"> 
<div align="center"> 
    <h1>Reveal My Location</h1> 
    <p> 
     You know what's pretty cool? Tracking your location using a simple internet connection. By clicking this button, you're browser will track a global database and reveal your location in terms of latitude and longitude. Enjoy! 
    </p> 
    <div id="location"></div> 
    <br> 
    <div id="map" style="width:400px; height:400px;"></div> 
    <br> 
    <input type="button" id="centerOfMap" value="Center" onclick="calculateCenter()"> 
    <footer> 
     <p> 
      &copy; Copyright by Alan Sylvestre 
     </p> 
    </footer> 
</div> 
</body> 

回答

0

1)從地理位置 2)存儲 '位置' 時用戶點擊: map.setCenter(新google.maps.LatLng(position.coords.latitude,position.coords.longitude))``

讓我知道你是否想要更多細節如何實現這一點。

+0

謝謝!我會在幾分鐘內嘗試一下,看看是否有效。謝謝。 – 2013-04-27 21:26:04

0
map.setCenter(marker.getPosition());