Search code examples
jqueryruby-on-railsgoogle-mapsgeocomplete

Unable to show maps in jquery.geocomplete


I am using jquery.geocomplete.js for getting autocomplete search when searching for an address. The app is a ruby on rails app and here is what I have done:

  1. Added <script src="http://maps.googleapis.com/maps/api/js?libraries=places"> to the layouts before the addition of application.js
  2. Geocomplete javascript to the app
  3. Added

    ready = ->
      $('#geocomplete').geocomplete(map: "#map_canvas")
    
    $(document).ready ready
    $(document).on "page:load", ready
    
  4. SLIM:

    h1 Welcome
    
    form
      input#geocomplete type="text" placeholder="Type in an address" size="90"
      input#find type="button" value="find"
    
    #map_canvas
    

Autocomplete options works without any problem but map is not showing up. How do I get the map to show here?


Solution

  • Please add height attribute to div "map_canvas" to view map. eg.

     #map_canvas{:style => "height:250px;"}