July 23, 2014
Hot Topics:
RSS RSS feed Download our iPhone app

Adding Google Maps To Your Rails Applications

  • July 8, 2008
  • By Jason Gilmore
  • Send Email »
  • More Articles »

Changing the Map Type Selector Language

Setting the control_init() method's :map_type parameter to true will give the user the ability to switch among Google's three different map types (map, satellite, hybrid). Google makes it trivial to change the language in which these type prompts are displayed by passing the :hl option to the static header() method call. Nine languages are supported (Basque - eu, Catalan - ca, French - fr, Galician - gl, German - de, Italian - it, Japanese - jp, and Spanish - es), including the English default. For instance, setting :hl to it will produce the map displayed in Figure 2.

Figure 2: Displaying map controls in the Italian language

In case you're wondering exactly what the header() call would look like, I'll reproduce it here:

<%= GMap.header(:hl=>'it') %>

Adding Markers and Information Windows

The maps displayed in Figures 1 and 2 put you in close proximity of a specific location, but without some context the practical nature of the map really ends there. For instance, in this example you'd never actually know I've centered the map over one of Youngstown, Ohio's famous pizzerias, namely Ianazone's. To pinpoint the location, you need the ability to create a marker that identifies the location. This is easily done by creating a GMarker object, and then passing that marker to the overlay_init() method. To add the Ianazone's marker, add the following two lines to the end of the index action:

ianazones = GMarker.new([41.023849,-80.682053])
@map.overlay_init(ianazones)

Executing the action anew produces the map displayed in Figure 3.

Figure 3: Adding a marker to the map

Adding Multiple Markers

Adding multiple markers doesn't require knowledge of any additional methods; just create multiple markers and add each to the map using overlay_init(). For instance, the following code will add both Ianazone's and Belleria Pizza to the map, producing the map displayed in Figure 4:

ianazones = GMarker.new([41.023849,-80.682053])
@map.overlay_init(ianazones)

belleria = GMarker.new([41.111141,-80.641281])
@map.overlay_init(belleria)

Figure 4: Adding multiple markers to the map

If you're planning on working with large numbers of markers, look into YM4R/GM's Clusterer class. Clusterer helps manage the display of large numbers of markers by displaying only those that are explicitly visible from a specific zoom level, rather than those that are otherwise piled atop one another due to close proximity. A later article in this series will address this matter in some detail, so stay tuned.





Page 2 of 3



Comment and Contribute

 


(Maximum characters: 1200). You have characters left.

 

 


Sitemap | Contact Us

Rocket Fuel