【问题标题】:How to link a button to a google map marker?如何将按钮链接到谷歌地图标记?
【发布时间】:2012-05-31 05:29:08
【问题描述】:

我正在尝试使用谷歌地图创建自己的地图。

我想创建一个显示地图上所有现有标记的列表。当用户单击列表中的一个按钮/链接时,相应的标记将居中并显示其信息窗口,即与用户单击标记相同的效果。

我已经尝试了许多解决方案,但我无法让它们都起作用。谁能为此提供一个简单的解决方案?提前致谢!

我现有的代码如下,

  google.maps.event.addDomListener(window, 'load', function() {
      var map = new google.maps.Map(document.getElementById('map'), {
          center: new google.maps.LatLng(19.642588,151.171875),
          mapTypeId: google.maps.MapTypeId.ROADMAP,
          mapTypeControl: false
      });
      var infoWindow = new google.maps.InfoWindow;
      var onMarkerClick1 = function() {
      var marker = this;     
      infoWindow.setContent('content of infowindow');
      infoWindow.open(map, marker);
  };
  var marker1 = new google.maps.Marker({
      map: map,
      position: new google.maps.LatLng(19.642588,151.171875),
  });
  google.maps.event.addListener(marker1, 'click', onMarkerClick1);

【问题讨论】:

标签: google-maps google-maps-api-3 google-maps-markers


【解决方案1】:

这不会使地图居中,但会移动以使整个气球可见

http://econym.org.uk/gmap/example_map2.htm


尽可能简单。是的,请使用 GMarker 等。

不要忘记标题中的这一点 <script src="http://maps.google.com/maps?...

您需要包含

的 html
 <div id="map" style="width: 550px; height: 450px"></div>
 <div id="side_bar"><a href="javascript:myclick(marker)">Marker One</a><br /></div>

然后是javascript

    var map = new GMap2(document.getElementById("map"));
    map.setCenter(new GLatLng(19.642588, 151.171875), 8);

    var point = new GLatLng(19.642588, 151.171875);
    var marker = new GMarker(point);

    GEvent.addListener(marker, "click", function () {
        marker.openInfoWindowHtml("this marker has been clicked");
    });

    function myclick(i) {
        GEvent.trigger(marker, "click");
    }

    map.addOverlay(marker);

【讨论】:

  • 谢谢,但我已经看到了这个解决方案,但无法理解。我是否需要将所有标记从 Marker 更改为 GMarker 才能正常工作?
  • OP 正在使用 V3,但此答案适用于 V2。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-07-16
  • 2013-10-18
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多