0

我需要制作一个页面，提供用户的纬度和经度，然后允许用户单击一个按钮以允许他们将谷歌地图围绕图钉（显示他们当前的位置）居中。我对如何做到这一点完全感到困惑。我认为这将是一个功能。我已经在我的代码中声明了该函数，但我不确定如何执行它。任何帮助将不胜感激。谢谢！

<!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>
4

2 回答 2

0 
map.setCenter(marker.getPosition());
于 2013-05-23T18:22:04.857 回答
0

1）从地理位置存储“位置” 2）当用户点击时：map.setCenter（new google.maps.LatLng（position.coords.latitude，position.coords.longitude））``

如果您想了解有关如何实现此功能的更多详细信息，请告诉我。

于 2013-04-27T17:08:28.287 回答