Google 地图和 Rails 3

发布于 2024-10-29 04:41:35 字数 264 浏览 1 评论 0原文

我当时使用 geokit 和 y4mr-gm 在 Rails 2.3x 上构建了一个应用程序。

我现在正在构建一个应用程序和 Rails 3，并且很好奇是否有更好的解决方案。

基本上我有一个有地址的模型企业。当用户搜索或浏览企业时，我希望底部有一个地图，显示每个企业的标记。

我可以通过 geokit 和 y4mr-gm 来做到这一点（尽管我听说 Rails 3 可能存在一些问题），但我希望有一个更优雅的解决方案。最近有什么我可以使用的吗？

谢谢！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

月棠 2024-11-05 04:41:35

我对 Geocoder 非常满意。它的维护非常活跃并且非常简单。在保存模型之前，我要求提供街道地址并让地理编码器填写纬度/经度字段。实施起来真的很轻松。

当涉及到在地图上显示内容时，我仍然自己编写 JS，但使用 jQuery 来完成。如果您正在寻找 JS 与 jQuery 的工作示例，您可以在此处查看我的示例。

回复收藏 0 原文

我一向站在原地 2024-11-05 04:41:35

我想说的是，拧紧插件，直接使用 Google Maps API v3 中的 javascript...它真的没有那么多代码，而且 G 有非常准确的地理编码器。只需在您的视图中创建一个 js 企业数组，然后使用一些 js 加载地图和标记即可。

未经测试的代码，但它应该非常接近：

<script type="text/javascript">
addresses = [];
<% @businessses.each do |biz| %>
  addresses.push('<%=biz.address%>');
<% end %>

function renderYoMap(addresses){
  var gmapOptions = {
    zoom: 12,
    center: new google.maps.LatLng(38,-97),  //near the middle of the US
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  // initialize the map with your options
  gmap = new google.maps.Map(document.getElementById("map_canvas"),gmapOptions);

  // probably want to recenter on the first marker, so lets use a flag
  recentered = false;

  //iterate through your addresses
  for (i in addresses) {
    address = addresses[i];
    geocoder = new google.maps.Geocoder();
    //geocode it to get marker position
    geocoder.geocode( { 'address': address }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      lat = results[0].geometry.location.lat();
      lng = results[0].geometry.location.lng();
      position = new google.maps.LatLng(lat,lng);
      markerOptions = {
        map: gmap,
        position: position
      };
      //create your marker on the map
      new google.maps.Marker(markerOptions);

      //recenter that thang if it hasnt been already
      if (!recentered){
        gmap.setCenter(position);
        recentered = true;
      }
    }
  }
}

renderYoMap(businesses);
</script>

当然，您可以变得更奇特，但这应该为您提供您正在寻找的基本功能。谷歌地理编码器限制是每天 1000 个，但那是客户端，所以这应该不是问题。

I would say screw the plugins and just use straight up javascript from Google Maps API v3... its really not that much code and G has very accurate geocoder. Just create a js array of businesses in your view and use the some js to load the map and markers.

UNTESTED code, but it should be pretty close:

<script type="text/javascript">
addresses = [];
<% @businessses.each do |biz| %>
  addresses.push('<%=biz.address%>');
<% end %>

function renderYoMap(addresses){
  var gmapOptions = {
    zoom: 12,
    center: new google.maps.LatLng(38,-97),  //near the middle of the US
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  // initialize the map with your options
  gmap = new google.maps.Map(document.getElementById("map_canvas"),gmapOptions);

  // probably want to recenter on the first marker, so lets use a flag
  recentered = false;

  //iterate through your addresses
  for (i in addresses) {
    address = addresses[i];
    geocoder = new google.maps.Geocoder();
    //geocode it to get marker position
    geocoder.geocode( { 'address': address }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      lat = results[0].geometry.location.lat();
      lng = results[0].geometry.location.lng();
      position = new google.maps.LatLng(lat,lng);
      markerOptions = {
        map: gmap,
        position: position
      };
      //create your marker on the map
      new google.maps.Marker(markerOptions);

      //recenter that thang if it hasnt been already
      if (!recentered){
        gmap.setCenter(position);
        recentered = true;
      }
    }
  }
}

renderYoMap(businesses);
</script>

Of course you can get alot fancier, but this should give you the basic functionality you are looking for. The google geocoder limit is 1000 a day, but that is client-side, so that should not be a problem.

回复收藏 0 原文