Google Maps v3 - 将标记替换为infoWindow显示

时间:2013-12-09 16:13:24

标签: javascript google-maps

我发现有很多单独定制标记/ infoWindow,但是可以将infoWindow用作标记吗? (仅显示infoWindow)。我已尝试将标记css作为display: hidden;进行尝试,但很少有其他事情,但没有运气。

var mapOptions = {
        center: new google.maps.LatLng(37.7831,-122.4039),
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };

    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    var acOptions = {
      types: ['establishment']
    };
    var autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'),acOptions);
    autocomplete.bindTo('bounds',map);
    var infoWindow = new google.maps.InfoWindow();
    var marker = new google.maps.Marker({
      map: map
    });

    google.maps.event.addListener(autocomplete, 'place_changed', function() {
      infoWindow.close();
      var place = autocomplete.getPlace();
      if (place.geometry.viewport) {
        map.fitBounds(place.geometry.viewport);
      } else {
        map.setCenter(place.geometry.location);
        map.setZoom(17);
      }
      marker.setPosition(place.geometry.location);
      infoWindow.setContent('<div><strong>' + place.name + '</strong><br>');
      infoWindow.open(map, marker);
      google.maps.event.addListener(marker,'click',function(e){

        infoWindow.open(map, marker);

      });
    });

1 个答案:

答案 0 :(得分:0)

这对我有用:

google.maps.event.addListener(autocomplete, 'place_changed', function() {
  infoWindow.close();
  var place = autocomplete.getPlace();
  if (place.geometry.viewport) {
    map.fitBounds(place.geometry.viewport);
  } else {
    map.setCenter(place.geometry.location);
    map.setZoom(17);
  }
  infoWindow.setContent('<div><strong>' + place.name + '</strong><br>');
  infoWindow.setPosition(place.geometry.location);
  infoWindow.open(map);
});

working example