Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/apneadiving/Google-Maps-for-Rails

Enables easy Google map + overlays creation in Ruby apps
https://github.com/apneadiving/Google-Maps-for-Rails

Last synced: about 2 months ago
JSON representation

Enables easy Google map + overlays creation in Ruby apps

Lists

README 

        
== Google Maps for Rails  {Endorse}[https://pledgie.com/campaigns/23367] {codementor-button}[https://www.codementor.io/apneadiving?utm_campaign=profile&utm_source=button-apneadiving&utm_medium=dark]



{Build Status}[http://travis-ci.org/apneadiving/Google-Maps-for-Rails]

{}[https://codeclimate.com/github/apneadiving/Google-Maps-for-Rails]

{Gem Version}[http://badge.fury.io/rb/gmaps4rails]

{Endorse}[http://coderwall.com/apneadiving]



Gmaps4rails is developed to simply create a Google Map with overlays (markers, infowindows...).

Yet it's backed on a very flexible codebase which could be prone to accept other map providers.



Use it with any Ruby app (I guess you could simply take the js anywhere if you like).



Here is a {quick tutorial on youtube}[http://www.youtube.com/watch?v=R0l-7en3dUw&feature=youtu.be], 

and my {presentation on speaker deck}[https://speakerdeck.com/apneadiving/gmaps4rails].



For live examples, {see here}[http://apneadiving.github.io/].



== A note for < 2.x users



Google-Maps-for-Rails-2.0 is an important rewrite to keep the minimum code and features. If

you're migrating from previous versions, you may want to read the {rationale about it}[https://github.com/apneadiving/Google-Maps-for-Rails/wiki/Why-but-why%3F].



== Requirements



1) Gemfile



    gem 'gmaps4rails'



2) HTML



Add a div to bear your map, example:



    


      


    



3) Javascript Dependencies:



Insert google scripts in your dom:



    

    

     



You'll require underscore.js too, see here: {http://underscorejs.org/}[http://underscorejs.org/] (`lo-dash` is compatible too, your choice!).



4) Javascript source code



If you have the asset pipeline, add this:



    //= require underscore

    //= require gmaps/google



If you don't have asset pipeline, you'll need to import the js OR coffee files:



    rails g gmaps4rails:copy_js



    rails g gmaps4rails:copy_coffee



5) Javascript code:



Create your map:



    handler = Gmaps.build('Google');

    handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){

      markers = handler.addMarkers([

        {

          "lat": 0,

          "lng": 0,

          "picture": {

            "url": "http://people.mozilla.com/~faaborg/files/shiretoko/firefoxIcon/firefox-32.png",

            "width":  32,

            "height": 32

          },

          "infowindow": "hello!"

        }

      ]);

      handler.bounds.extendWith(markers);

      handler.fitMapToBounds();

    });



6) Add options:



You're likely going to want to customize your maps by passing an options object. Using the example above,

let's say you'd like to disable the map controls. This and any other options you can find in the {Google

Maps API reference}[https://developers.google.com/maps/documentation/javascript/reference]

can be passed into the `provider` options hash like so:



    handler = Gmaps.build('Google');

    handler.buildMap({

        provider: {

          disableDefaultUI: true

          // pass in other Google Maps API options here

        },

        internal: {

          id: 'map'

        }

      },

      function(){

        markers = handler.addMarkers([

          {

            "lat": 0,

            "lng": 0,

            "picture": {

              "url": "http://people.mozilla.com/~faaborg/files/shiretoko/firefoxIcon/firefox-32.png",

              "width":  32,

              "height": 32

            },

            "infowindow": "hello!"

          }

        ]);

        handler.bounds.extendWith(markers);

        handler.fitMapToBounds();

      }

    );



You can see other examples of adding `provider` options in the {live examples}[http://apneadiving.github.io/]. Also,

check the {wiki}[https://github.com/apneadiving/Google-Maps-for-Rails/wiki/Js-Methods] for further documentation on

the possible JavaScript methods.



== Generating JSON



In your controller:



    @users = User.all

    @hash = Gmaps4rails.build_markers(@users) do |user, marker|

      marker.lat user.latitude

      marker.lng user.longitude

    end



In your view:

    

    

        markers = handler.addMarkers(<%=raw @hash.to_json %>);

    



== Easily customizable



You can change almost everything with a few lines of code. {See details here}[https://github.com/apneadiving/Google-Maps-for-Rails/wiki/Change-handler-behavior].



== Options



* Markers with Info window, Custom Picture, RichMarkers (make your own markers with custom html)



* Circles, Polylines, Polygons, Kml



* Refresh your map on the fly with Javascript (and Ajax)



* {More details in the Wiki}[https://github.com/apneadiving/Google-Maps-for-Rails/wiki]



== Todo?



Feel free to contact us, you have your say.



== Copyright

MIT license.



Author: Benjamin Roth



{Contributors}[https://github.com/apneadiving/Google-Maps-for-Rails/graphs/contributors]