显示和屏蔽onclick Marker Google Map

时间:2016-07-29 07:50:08

标签: jquery google-maps dictionary

我对谷歌地图有疑问。

我的谷歌地图上有三个标记。

在第一个视图中,我想要显示一个标记。

如果我点击btn2或btn3,我想显示它并屏蔽标记1。 如果我在显示btn2或btn3时单击btn1,则相同。

我也想用特定的网址自定义我的标记。

这是我的代码Js。

    var locations = [
      ['Homexpo', 44.89589669999999, -0.5713743999999679, 3],
      ['Biganos', 44.640044, -0.9629101000000446, 2],
      ['Siege social', 44.8864352, -0.6952949999999873, 1]
    ];

    var map = new google.maps.Map(document.getElementById('ggmap-offre'), {
      zoom: 9,
      center: new google.maps.LatLng(44.795454, -1.147783000000004),
      scrollwheel: false,
      draggable: false,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var marker, i;

    for (i = 0; i < locations.length; i++) { 
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });
    }

这是我的代码HTML

    <div id="ggmap-offre"></div>
    <div id="bloc-txt-ggmap">
        <h4>Nos <span class="gras">adresses</span></h4>
        <div class="clear"></div>
        <a class="clik-map btn1" href="#"><div class="info-multi-lieu">
            Homexpo
            <p class="cp">33300 Bordeaux Lac</p>
        </div></a>
        <a class="clik-map btn2" href="#"><div class="info-multi-lieu">
            BIGANOS
            <p class="cp">134 avenue de la côte d'argent<br/>33380 Biganos</p>
        </div></a>
        <a class="clik-map btn3" href="#"><div class="info-multi-lieu">
            Siège social
            <p class="cp">1, rue Alfred Musset<br/>33160 Saint-Médard-en-Jalles</p>
        </div></a>
    </div>

我希望你能帮助我。

这是网址:http://pier17.fr/beta-sanem/nous-contacter.html

非常感谢你,祝你有个美好的一天。

1 个答案:

答案 0 :(得分:1)

这是你的代码:

var marker, i;

for (i = 0; i < locations.length; i++) { 
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });
}

所以,如果你想制作一些其他的制造商,标记参数将位于for循环代码中。

我建议使用此代码......但我没有测试它!

for (var i = 0; i < locations.length; i++) { 
  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });
}