Question

我有以下代码按预期工作，除了google.maps.event.addListener（标记，'click'，function（）。我包含所有代码供参考。你会看到我注释掉的代码我已经尝试了。我希望地图在点击标记时放大。感谢您的帮助。

$(document).ready(function() {
  $("#map").css({
        height: 700,
        width: 800
    });
    var myLatLng = new google.maps.LatLng(46.053791, -118.3131256);
  MYMAP.init('#map', myLatLng, 11);

  $("#showmarkers").ready(function(e){
        MYMAP.placeMarkers('markers.xml');
  });
});

var MYMAP = {
  map: null,
    bounds: null
}

MYMAP.init = function(selector, latLng, zoom) {
  var myOptions = {
    zoom:zoom,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  this.map = new google.maps.Map($(selector)[0], myOptions);
    this.bounds = new google.maps.LatLngBounds();
}

MYMAP.placeMarkers = function(filename) {
        $.get(filename, function(xml){
        $(xml).find("marker").each(function(){
            var name = $(this).find('name').text();
            var address = $(this).find('address').text();

            // create a new LatLng point for the marker
            var lat = $(this).find('lat').text();
            var lng = $(this).find('lng').text();
            var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));

            // extend the bounds to include the new point
            MYMAP.bounds.extend(point);

            var marker = new google.maps.Marker({
                position: point,
                map: MYMAP.map
            });

            var infoWindow = new google.maps.InfoWindow();
            var html='<strong>'+name+'</strong.><br />'+address;
            google.maps.event.addListener(marker, 'mouseover', function() {
                infoWindow.setContent(html);
                infoWindow.open(MYMAP.map, marker);

            });
<!--    *************** here is the code I need help with **************** -->      
            google.maps.event.addListener(marker, 'click', function() {
                <!-- attempt 1 -->
                <!--map.setZoom(10); -->
                <!--map.setCenter(marker.getPosition());-->

                <!--attempt 2 -->
                <!--mapZoom = map.getZoom();-->
                <!--startLocation = event.point; -->:

                <!--attempt 3 (with and without MYMAP-->
                <!--MYMAP.map.setZoom(10); -->
                <!--MYMAP.map.panTo(marker.position); -->
  });

            google.maps.event.addListener(marker,'mouseout', function() {
    infoWindow.close();
    });


            MYMAP.map.fitBounds(MYMAP.bounds);
        });
    });
}

Answer 1

我认为最好的方法是获取当前缩放，增加它，并将缩放设置为新值，如下所示：

google.maps.event.addListener(marker, 'click', function() {
    MYMAP.map.setZoom(MYMAP.map.getZoom()+1);
});

http://jsfiddle.net/OxyDesign/w26fL6f7/

这是你想要的吗？

Google地图点击事件无效

1 个答案: