简单的谷歌简单事件监听器

时间:2014-01-15 11:42:34

标签: javascript jquery google-maps google-maps-api-3

我只是想让用户点击地图来设置提醒但很简单,就像这样

google.maps.event.addListener(map, 'click', function() {
    alert("Ok");
    });

我从来没有收到警告“Ok”为什么。我在这里错过了什么? 我想我已经删除了不必要的代码。

这里最相关的代码JS

var p = $("#map_search");
        var position = p.position();
        $("#directionsPanel").css({top: position.top, position:'absolute'});

        var map;
        var gmarkers = []; 
        var addressField;
        var geocoder;
        $(document).ready(function () {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(ShowPosition);
            }
            else {
                x.innerHTML = "Geolocation is not supported by this browser.";
            }
            function showError(error) {
                switch (error.code) {
                    case error.PERMISSION_DENIED:
                        alert("User denied the request for Geolocation.");
                        break;
                    case error.POSITION_UNAVAILABLE:
                        alert("Location information is unavailable.");
                        break;
                    case error.TIMEOUT:
                        alert("The request to get user location timed out.");
                        break;
                    case error.UNKNOWN_ERROR:
                        alert("An unknown error occurred.");
                        break;
                }
            }
            function ShowPosition(position) {
                //begin rest call
                $("#latitude").val(position.coords.latitude);
                $("#longitude").val(position.coords.longitude);
                var from = $("#latitude").val() + "," + $("#longitude").val();
                var urlParts = window.location.href.split('/'),
                    Id = urlParts[(urlParts.length - 1)];

                $.ajax({
                    type: "GET",
                    cache: true,
                    async: false,
                    url: "/RestService/Dentalo.svc/CompaniesByState/" + Id,
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        map = new GMaps({
                            el: 'map_search',
                            //center: Id,
                            lat: data[0].State.Latitude ,//position.coords.latitude,
                            lng: data[0].State.Longitude,
                            zoom: 13,
                            zoomControl: true,
                            mapTypeId: google.maps.MapTypeId.ROADMAP,
                            mapTypeControlOptions: {
                                style: google.maps.MapTypeControlStyle.DEFAULT,
                                position: google.maps.ControlPosition.RIGHT_RIGHT
                            },      
                            panControl: true,
                            panControlOptions: {
                                position: google.maps.ControlPosition.RIGHT_TOP
                            },      
                            zoomControl: true,
                            zoomControlOptions: {
                                style: google.maps.ZoomControlStyle.LARGE,
                                position: google.maps.ControlPosition.RIGHT_TOP
                            },
                            panControl: true,
                            scrollwheel: true
                        });

                        map.addMarker({
                            lat: position.coords.latitude,
                            lng: position.coords.longitude,
                            title: 'Min position',
                            icon: 'http://www.dentalo.se/assets/img/map/user_x64.png'
                        });
                        var h = "";
                        $.each(data, function (index, item) {
                            var to = item.Latitude + "," + item.Longitude;
                            var lat = item.Latitude;
                            var long = item.Longitude;
                            map.addMarker({
                                            lat: item.Latitude ,
                                            lng: item.Longitude ,
                                            title: item.Address ,
                                            icon: GetMarkerImage(item.Status),
                                            infoWindow: { 
                                                content: '<div style="width: 300px"><h4>' + item.Name + '</h4><br /><p>' + item.Address + ', ' + item.County.Name + '</p><div class="four columns alpha"><a class="btn blue ' + SetDisplayClass(item.Status) + '" href="/booking/' + item.CompanyId + '" ><i class="m-icon-swapright m-icon-white"></i> Boka</a> <a href="#" onClick="showPopUp(&apos;' + item.CompanyId +'&apos;);return false;" class="btn default">Information</a></div></div>',
                                            }
                                })
                        });

                        google.maps.event.addListener(map, 'click', function() {
                            alert("Ok");
                            });

                    },
                    error: function (msg, url, line) {
                        //alert('error trapped in error: function(msg, url, line)');
                        alert('msg = ' + msg + ', url = ' + url + ', line = ' + line);
                    }
                });
            }


        });

1 个答案:

答案 0 :(得分:0)

根据documentation for GMaps,您需要将地图事件添加到GMap对象本身:

map = new GMaps({
  div: '#map',
  zoom: 16,
  lat: -12.043333,
  lng: -77.028333,
  click: function(e) {
    alert('click');
  },
  dragend: function(e) {
    alert('dragend');
  }
});