需要帮助编写jQuery循环表并将标记注入谷歌地图?

时间:2010-04-26 17:25:49

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

我是jQuery的新手。我用它做了一些简单的事情,但我现在正在尝试的是我的头脑,我需要一些帮助。

我正在为美国所有枪支经销商建立一个定位器供客户使用。我在Drupal工作。我通过邮政编码进行邻近搜索,效果很好。如果你通过zip搜索,一个分页结果列表会显示在一个html表中,可以通过ajax分页。

我希望地图位于此列表上方,其中包含与列出的名称和地址相对应的标记。我已经在表结果中包含了所有lat和long值。我希望脚本更新标记,并在用户通过结果更改表格或页面的排序顺序时自动缩放以适合视图中的标记。

另外,我希望在表格的行上有一个悬停高亮效果,同时突出显示相应的标记,然后点击表格行等于点击标记,弹出标记信息窗口使用jQuery填充以读取表的名称和地址字段。希望这一切都有意义。

我知道我在那里投入很多,我不是要求有人写整个剧本,只是想尽可能多地提供详细信息。谢谢你的帮助。在循环和移动数据方面,我只是迷失了。

如果您想查看我目前在项目中的内容,请访问:www.axtsweapons.com并使用用户名:“test”和密码:“1234”登录,然后访问此直接链接:{{ 3}}

对于一个易于操作和播放的简单页面,请转到:www.axtsweapons.com/ffllocator谢谢!

1 个答案:

答案 0 :(得分:1)

想出如何在表格中循环并将引脚推入地图。现在我无法弄清楚如何将Google Maps API V3的边界功能与我的脚本集成。如果有任何指示,请告诉我。这是我正在使用的测试代码:

$(function() {
   var latlng = new google.maps.LatLng(45.522015,-122.683811);

   var settings = {
      zoom: 15,
      center: latlng,
      disableDefaultUI: false,
      mapTypeId: google.maps.MapTypeId.ROADMAP
   };

   var map = new google.maps.Map(document.getElementById("map_canvas"), settings);

      $('tr').each(function(i) {

         var the_marker = new google.maps.Marker({
            title: $(this).find('.views-field-title').text(),
            map: map,
            clickable: true,
            position: new google.maps.LatLng(
               parseFloat($(this).find('.views-field-latitude').text()),
               parseFloat($(this).find('.views-field-longitude').text())
            )
         });

         var infowindow = new google.maps.InfoWindow({
            content:  $(this).find('.views-field-title').text() +
                      $(this).find('.adr').text()
         });

         new google.maps.event.addListener(the_marker, 'click', function() {
            infowindow.open(map, the_marker);
         });
      });
});

另外,我想知道如何在信息窗口数据中插入换行符。感谢