Google地图未显示在我的网页上

时间:2015-01-22 13:42:28

标签: javascript jquery html google-maps

我正在尝试在Chrome中实现谷歌地图,但是地理定位似乎没有起作用我还将设置更改为“允许所有网站跟踪' 我已经从在线教程中获取了这些代码,因此我无法找到使其正常工作的方法

<head>
    <title>Map</title>
    <!-- Google Maps and Places API -->
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>

    <!-- jQuery -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript">
        function initGeolocation(){
            if( navigator.geolocation ){
                // Call getCurrentPosition with success and failure callbacks
                navigator.geolocation.getCurrentPosition( success, fail );
            }else{
                alert("Sorry, your browser does not support geolocation services.");
            }
        }

        var map;
        function success(position){
           // Define the coordinates as a Google Maps LatLng Object
           var coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);

           // Prepare the map options
           var mapOptions = {
                zoom: 14,
                center: coords,
                mapTypeControl: false,
                navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

            // Create the map, and place it in the map_canvas div
            map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

            //search for schools within 1500 metres of our current location, and as a marker use school.png
            //placesRequest('Schools',coords,1500,['school']);


            // Place the initial marker
            var marker = new google.maps.Marker({
                position: coords,
                map: map,
                title: "Your current location!"
            });

        }

        function fail(){
            // Could not obtain location
        }

        //Request places from Google
        function placesRequest(title,latlng,radius,types,icon){
            //Parameters for our places request
            var request = {
                location: latlng,
                radius: radius,
                types: types
            };
            //Make the service call to google
            var callPlaces = new google.maps.places.PlacesService(map);
            callPlaces.search(request, function(results,status){
                //trace what Google gives us back
                $.each(results, function(i,place){
                    var placeLoc = place.geometry.location;
                    var thisplace = new google.maps.Marker({
                        map: map,
                        position: place.geometry.location,
                        icon: icon,
                        title: place.name
                     });
                })
            });
        }
</script>

2 个答案:

答案 0 :(得分:1)

initGeolocation()不会在任何地方触发。

答案 1 :(得分:1)

缺少id为map_canvas的div,并且您不会在代码中的任何位置调用initGeolocation函数。

检查here,一切正常