Question

我正在尝试当用户点击标记时，它会打开并关闭所有先前打开的标记。我正在尝试使用此代码而没有运气，不知道该怎么做？

使用我正在使用的完整脚本进行更新，并根据答案的可能解决方案进行更新：

    (function($) {

    /*
    *  new_map
    *
    *  This function will render a Google Map onto the selected jQuery element
    *
    *  @type  function
    *  @date  8/11/2013
    *  @since 4.3.0
    *
    *  @param $el (jQuery element)
    *  @return  n/a
    */

    function new_map( $el ) {

      // var
      var $markers = $el.find('.marker');


      // vars
      var args = {
        scrollwheel: false,
        zoom    : 5,
        center    : new google.maps.LatLng(0, 0),
        mapTypeId : google.maps.MapTypeId.ROADMAP
      };


      // create map           
      var map = new google.maps.Map( $el[0], args);


      // add a markers reference
      map.markers = [];


      // add markers
      $markers.each(function(){

          add_marker( $(this), map );

      });


      // center map
      center_map( map );


      // return
      return map;

    }

    /*
    *  add_marker
    *
    *  This function will add a marker to the selected Google Map
    *
    *  @type  function
    *  @date  8/11/2013
    *  @since 4.3.0
    *
    *  @param $marker (jQuery element)
    *  @param map (Google Map object)
    *  @return  n/a
    */

    function add_marker( $marker, map ) {

      // var
      var latlng = new google.maps.LatLng( $marker.attr('data-lat'), $marker.attr('data-lng') );

      // create marker
      var marker = new google.maps.Marker({
        position  : latlng,
        map     : map,
        icon: '<?php echo get_template_directory_uri(); ?>/assets/img/google-map-marker.png',
      });

      // add to array
      map.markers.push( marker );

      if( $marker.html() ){
         var infoWindows = [];
        // show info window when marker is clicked
        google.maps.event.addListener(marker, 'click', function() {

           // Need to clear up old info windows before adding new ones
          for (var i = 0; i < infoWindows.length; i++) {
            infoWindows[i].setMap(null);
          }

        // create info window
          var infoWindow = new google.maps.InfoWindow({
            content   : $marker.html()
          });

          infoWindow.open( map, marker );
          infoWindows.push(infoWindow);
        });
      }  

    }


    /*
    *  center_map
    *
    *  This function will center the map, showing all markers attached to this map
    *
    *  @type  function
    *  @date  8/11/2013
    *  @since 4.3.0
    *
    *  @param map (Google Map object)
    *  @return  n/a
    */

    function center_map( map ) {

      // vars
      var bounds = new google.maps.LatLngBounds();

      // loop through all markers and create bounds
      $.each( map.markers, function( i, marker ){

        var latlng = new google.maps.LatLng( marker.position.lat(), marker.position.lng() );

        bounds.extend( latlng );

      });

      // only 1 marker?
      if( map.markers.length == 1 )
      {
        // set center of map
          map.setCenter( bounds.getCenter() );
          map.setZoom( 16 );
      }
      else
      {
        // fit to bounds
        map.fitBounds( bounds );
      }

    }

    /*
    *  document ready
    *
    *  This function will render each map when the document is ready (page has loaded)
    *
    *  @type  function
    *  @date  8/11/2013
    *  @since 5.0.0
    *
    *  @param n/a
    *  @return  n/a
    */
    // global var
    var map = null;

    $(document).ready(function(){

      $('.acf-map').each(function(){

        // create map
        map = new_map( $(this) );

      });

    });

    })(jQuery);

Answer 1

我在代码中稍微改了一下。

var infoWindows = [];
if( $marker.html() ){

    // Need to clear up old info windows before adding new ones
    for (var i = 0; i < infoWindows.length; i++) {
      infoWindows[i].setMap(null);
    }
  // show info window when marker is clicked
  google.maps.event.addListener(marker, 'click', function() {

  // create info window
    var infoWindow = new google.maps.InfoWindow({
      content   : $marker.html()
    });

    infoWindow.open( map, marker );
    infoWindows.push(infoWindow);
  });
}

我希望它能奏效。如果没有，请告诉我有关您的代码的更多详细信息。感谢

关闭打开的infowindows - 谷歌地图api

1 个答案: