MongoDB Railsで使えるGem

Rails3.2でHTML5で取得した位置情報をMongoDBに保存してGoogleMapsでみる~mongoid、gmaps4rails

投稿日:

前提

Rails3.2でhtml5で取得した位置情報をAjaxで住所表示する~geocoder

Mongoid

Gemfile

bundle

generate

わたしは別の仮想PCのMongoDBを使うので、そのIPアドレスを指定した

model

とりあえず最低限

include Mongoid::Timestampsでタイムスタンプを記録する

controller

この1行をくわえるだけ

データベースからデータが挿入されるか確認する

スケルトンを作る

home/showに今までの記録一覧と地図を表示する

*ちょっと失敗したかも別コントローラーの方がいいかも

index.html.erb

リンクを作って

config/routes.rb

show.html.erb

home_controller

Gmap4railsのインストール

Gemfile

bundle

generate

 model

gmaps4railsは住所などから自動的に位置情報を取得してデータベースに記録してくれる

今回はhtml5から位置情報を取得するのでこの機能はオフにする

読み出す方はデータベースにlatitudeとlongitudeがあればとりあえずグーグルマップは表示されるようだ

とりあえず地図を表示させる

controller

今回は一覧表と地図を出すので

 

view

 

css

Twitter Bootstrapを使っているので

 確認

詳細を見られるようにする

地図を押すとその場所の地図を拡大するようにしたい

いろいろFireBugでいじった結果、Gmaps4railsでは、Gmaps.map.mapを操作すればよさそうだとわかった

ブラウザ上でコンソールを開いて

とかやると地図のズームが変わったり、移動したりするはず

参照

基本的なところはドットインストール

dotinstall.com/lessons/basic_google_maps

をみた

 

あとはjQueryでテーブルをクリックしたら上の操作を実行するようにすればOK

ついでに、クリックした行の色を変えるようにした

これで記録した箇所の詳細がみられるはずだ

-MongoDB, Railsで使えるGem
-, , ,

執筆者:

関連記事

Rubyでウェブサイトを操作してリストをつくる〜mechanize

    By: JoshSemans   以前からRailscastsというRuby on Railsの動画サイトが好きでよく見ているのだが、380近く動画があって気にな …

ActiveRecord使い方まとめ

By: North Carolina National Guard – CC BY 2.0 ActiveRecord入門|ドットインストールをみて個人的まとめ ActiveRecord4の …

RailsでECサイト構築4 確認メールを送る~spree

  spreeでは注文したときと発送したときにメールを送信できるように設定できるので、やってみた   目次1 設定2 翻訳 設定 管理画面から設定>メールシステムの設定から これで …

backbone-railsのscaffoldで生成されるコードでルーティングとCRUDの処理をどうやってるのか読んでみた

By: asobi tsuchiya   目次1 はじめに2 サンプルの準備3 初期化4 ルーター5 READ6 CREATE7 UPDATE8 DELETE はじめに backbone-r …

Rubyでd3.jsのapiリファレンスの一覧を取得してくる~mechanize

  d3.jsにはlayoutというおおまかに準備されたレイアウトがあって、その中にあるTreeレイアウトを試してみることにした d3.js自身のapiリファレンスが階層構造になっているので …