GMaps4Rails
-
Upload
amit-chakradeo -
Category
Documents
-
view
1.002 -
download
1
Transcript of GMaps4Rails
![Page 1: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/1.jpg)
Google Maps& Rails
![Page 2: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/2.jpg)
Why Google Maps?
![Page 3: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/3.jpg)
Why Google Maps?
• Rich User Interface
![Page 4: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/4.jpg)
Why Google Maps?
• Rich User Interface
• Well documented Javascript API
![Page 5: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/5.jpg)
Why Google Maps?
• Rich User Interface
• Well documented Javascript API
• Free
![Page 6: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/6.jpg)
But...
![Page 7: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/7.jpg)
But...
• I want it to be a bit simpler and faster to work with
![Page 8: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/8.jpg)
Plugins To The Rescue
![Page 9: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/9.jpg)
Plugins To The Rescue
• YM4R - The easy way to use google maps with Rails
![Page 10: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/10.jpg)
YM4R
![Page 11: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/11.jpg)
YM4R
• Simple Methods for creating a map all from within the controller
![Page 12: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/12.jpg)
YM4R
• Define a new map instance
![Page 13: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/13.jpg)
YM4R
• Define a new map instance• @map = GMap.new(“map_div”)
![Page 14: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/14.jpg)
YM4R
• Tell it what controls you want
![Page 15: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/15.jpg)
YM4R
• Tell it what controls you want• @map.control_init(:large_map => true,:map_type => true)
This adds the large zoom slider and pan cross + map type selector, ie hybrid, satillite etc.
![Page 16: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/16.jpg)
YM4R
• Tell Gmaps where you want to center it
![Page 17: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/17.jpg)
YM4R
• Tell Gmaps where you want to center it• @map.center_zoom_init([-28.99425, 132.03845], 4)
• # => Australia
![Page 18: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/18.jpg)
YM4R
• Inject Markers
![Page 19: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/19.jpg)
YM4R
• Inject Markers @map.overlay_init(GMarker.new([-28.99425, 132.03845],
:title => “Australia”, :info_window => “Yay!”))
![Page 20: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/20.jpg)
YM4R def index @map = GMap.new(“map_div”) @map.control_init(:large_map => true,:map_type => true) @map.center_zoom_init([75.5,-42.56],4) @map.overlay_init(GMarker.new([75.6,-42.467],:title => “Hello”, :info_window => “Info! Info!”)) end
![Page 21: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/21.jpg)
YM4Rdef find_a_dealer @dealers = Dealer.find(:all, :order => “name ASC”) @map = GMap.new(“map_div”) @map.control_init(:large_map => true, :map_type => true) @map.center_zoom_init([-28.99425, 132.03845], 4) markers = Array.new @dealers.each do |dealer| markers << GMarker.new([dealer.lat, dealer.lng],
:info_window => “<strong>#{dealer.name}</strong><br /> #{dealer.street_number}, #{dealer.street_name.capitalize},<br /> #{dealer.suburb.capitalize}, #{dealer.state.upcase}, #{dealer.postcode}<br /> PH: #{dealer.phone_number}, #{dealer.suburb.upcase}, #{dealer.state.upcase}“, :title => dealer.name) end clusterer = Clusterer.new(markers, :max_visible_markers => 15) @map.overlay_init clustererend
You can also add multiple markers and have YM4R set how the max number to be shown before it “clumps” them together as 1 marker, and all sorts of stuff. This is the controller code from the orbea site I created.
So I find all my dealers in the DB.Create a new GMap instanceSet controls and the center, then I create a new array and assign it to the variable markers. From there I “push” into the array each of the db recordsThen we use YM4R’s clusterer class, where we tell it the array of markers and the max-Number of visible markers.
![Page 22: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/22.jpg)
YM4R
• script/plugin install svn://rubyforge.org/var/svn/ym4r/Plugins/GM/trunk/ym4r_gm
• http://thepochisuperstarmegashow.com/projects
![Page 23: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/23.jpg)
WaitI want more than just that!
![Page 24: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/24.jpg)
WaitI want more than just that!
I want geolocation, distance finders and other cool stuff!
![Page 25: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/25.jpg)
GeoKitProvides key functionality for location-oriented Rails applications
![Page 26: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/26.jpg)
GeoKit
• find_within(distance, options={})
• find_beyond(distance, options={})
• find_closest(options={})
• find_farthest(options={})
![Page 27: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/27.jpg)
GeoKit
• IpGeocoder.geocode('12.215.42.19')
• # => @success=true, @street_address=nil, @country_code="US", @zip=nil, @lng=-88.4588, @state="IL", @city="Sugar Grove", @provider="hostip", @lat=41.7696
• GoogleGeocoder.geocode('281 Clarence St, Sydney, AU’)
• # => @success=true, @street_address="281 Clarence St", @country_code="AU", @full_address="281 Clarence St, Sydney, New South Wales 2000, Australia", @zip="2000", @lng=151.205542, @state="New South Wales", @city="Sydney", @provider="google", @lat=-33.872399
![Page 28: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/28.jpg)
GeoKitAdd lat,lng co-ordinates to a record using before_save:
class Dealer < ActiveRecord::Base include GeoKit::Geocoders acts_as_mappable :default_units => :kms before_save :find_in_google_maps protected def find_in_google_maps location = GoogleGeocoder.geocode(“#{self.street_number} #{self.street_name}, #{self.suburb}, #{self.state}, #{self.postcode}, Australia”) if location.success self.lat = location.lat self.lng = location.lng else self.lat = nil self.lng = nil end end
end
![Page 29: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/29.jpg)
GeoKitYou can now find dealers in your controller and add them to the map:
def find_a_dealer @dealers = Dealer.find(:all, :order => “name ASC”) @map = GMap.new(“map_div”) @map.control_init(:large_map => true, :map_type => true) @map.center_zoom_init([-28.99425, 132.03845], 4) markers = Array.new @dealers.each do |dealer| markers << GMarker.new([dealer.lat, dealer.lng],
:info_window => “<strong>#{dealer.name}</strong><br /> #{dealer.street_number}, #{dealer.street_name.capitalize},<br /> #{dealer.suburb.capitalize}, #{dealer.state.upcase}, #{dealer.postcode}<br /> PH: #{dealer.phone_number}, #{dealer.suburb.upcase}, #{dealer.state.upcase}“, :title => dealer.name) end
clusterer = Clusterer.new(markers, :max_visible_markers => 15) @map.overlay_init clustererend
![Page 30: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/30.jpg)
GeoKitUpdate with rjs:
CONTROLLER:def update_dealer_map unless params[:search].blank? home = GoogleGeocoder.geocode(params[:search] + “, Australia”) unless home.success==false @dealer = Dealer.find_closest(:origin => home) @map = Variable.new(“map”) @location = [@dealer.lat, @dealer.lng] @search = params[:search] end endend
update_dealer_map.rjs:unless @location.blank? page << @map.set_center(GLatLng.new(@location), 12)end
![Page 31: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/31.jpg)
GeoKitscript/plugin install svn://rubyforge.org/var/svn/geokit/trunk
http://geokit.rubyforge.org/
![Page 32: GMaps4Rails](https://reader034.fdocuments.us/reader034/viewer/2022042613/54647ba3b4af9f493f8b4a2e/html5/thumbnails/32.jpg)
GeoKitscript/plugin install svn://rubyforge.org/var/svn/geokit/trunk
http://geokit.rubyforge.org/
YM4Rscript/plugin install svn://rubyforge.org/var/svn/ym4r/Plugins/GM/trunk/ym4r_gm
http://thepochisuperstarmegashow.com/projects