Question

我需要制作一个提供用户纬度和经度的页面，然后允许用户点击一个按钮，让他们将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>

Answer 1

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

如果您想了解有关如何实施此功能的详细信息，请与我们联系。

Answer 2

map.setCenter(marker.getPosition());

中心针谷歌地图

2 个答案: