2009-11-17 9 views
5

はRuby on Railsで、その後、店の緯度と経度の地図にマーカーを追加します。しかし、私はかなりので、ここでこれに合うように見えることはできません、それは次のようになります。基本的にGoogleマップは、私が尋ねた前回の質問を見て持っていた

私はRuby on Railsプロジェクトを持っています。私は、ユーザーのピンがマーカーを追加して(1つだけ許可する必要があります)、Googleマップ上で自分の位置を指し示し、Ruby on Rails内に経度と緯度を保存するページを持っていたいと考えています私が取り組んでいるプロジェクト。

私はJavascriptを使って地図を追加するのに何が最善のアプローチだろうと思っていますが、ユーザがレール上のルビー内のボタンにヒットするとどのように緯度と経度を取得できますか?

レール環境でのルビーでの作業はかなり新しいものですが、私は上記のことをどうやってやるのか分かりません。私は詳細を知らないが、私は、ユーザーがマーカーをドロップしたときに呼び出されるコールバック関数のためにGoogle MapsのAPIをチェックアウトするだろう多くの先進

答えて

3

私は最初のステップはマップなしで作業しているビューを得ることだと思います。手動で緯度/経度を入力すると、ビューとコントローラが機能していることがわかります。その点に達すると、Google Maps API documentationをご覧ください。あなたのビューにマップを追加し、markerを追加する方法を見つけてください。マーカーを追加/削除すると、緯度/経度入力をJavaScriptで更新できます(私はjQueryを個人的に使用します)。この時点で、lat/long入力を非表示にすることも、読み取り専用にすることもできます。ユーザーがlat/longを手動で更新する必要がある場合を除きます。

FYI - GoogleはMaps APIのV3を使用することを提案するかもしれませんが、使用しようとしたときに欠けている部分が多すぎます。私はV2に固執します。ここで

+0

あなたの提案が私の問題を解決するのに役立ちました – Erika

0

感謝。私は確信している。そのコールバック関数が呼び出されると、それは緯度と経度と共に渡されます。これにより、フォーム属性を正しい値で更新できます。

正しい方向に進むのを手伝ってください。

4

が短い例です:

your_page.html

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=xxx;hl=en" type='text/javascript'></script> 

<script type='text/javascript'>  
     var draggable_marker = null; 

     $(document).ready(function() { 
      if (GBrowserIsCompatible()) { 
      map = new GMap2(document.getElementById('map_div')); 
      map.addControl(new GSmallMapControl()); 

      draggable_marker = new GMarker(new GLatLng(42.6976489, 23.3221545), {draggable : true,title : "Place this marker to your location"); 

      GEvent.addListener(draggable_marker, 'dragend', function() { 
       RubyGmap.setPosition(draggable_marker); 
      }); 
      GEvent.addListener(map, 'click', function(overlay, latlng, overlaylatlng){ 
       RubyGmap.setMarkerPosition(draggable_marker, latlng); 
      }); 
      } 
     }); 
</script> 



<div id="map_div" style="width:690px;height:340px;" ></div> 

ruby​​_gmap.js

RubyGmap = {  
setPosition: function(marker) { 
    $('#latitude_field').val(marker.getLatLng().lat()); 
    $('#longitude_field').val(marker.getLatLng().lng()); 
}, 
setMarkerPosition: function(marker, latlng) { 
    SELECTED = true; 
    map.addOverlay(marker); 
    marker.setLatLng(latlng); 
    RubyGmap.setPosition(marker); 
} 
} 
0

あなたはGOOGを使用しようとしている場合le Maps APIをあなたのRailsプロジェクトの1つに追加したら、YM4R pluginの使用を強くお勧めします。このプラグインは、Google Maps APIの優れたルビフレンドリーなオブジェクトカプセル化を提供します。 README in the Rdocには、マップの表示を開始して1つ以上のマーカーを表示する方法に関する素晴らしいexMampleコードがあります。

プラグインを使用する大きな利点は、プラグインがRubyオブジェクトの背後にあるGMaps API全体を抽象化し、Rubyコードのみを使用してマップを作成して追加できることです。あなたはJavascriptを書く必要はありません...あなたが希望しない限り、へ;)

0

地図製作者プラグインはRailsの3+は、それは、マーカーおよびクラスタ

の巨大なnumbeのために働くために書き直されました、それはレールでGoogleマップv3のの無痛統合をサポートし、

をサポートしています、http://grati.la/cartorbflw

関連する問題