Gmaps4rails : Setting map width and height

Question

Reading the gmaps4rails gem documentation, I didn\'t find any way to set the map width and height. Is there any way to do this ?

Answer 1

if you want to do this easily I would recommend you follow this set of steps:

Add a custom container class using:

<%= gmaps( :map_options => { :container_class => "map_container_renamed" }, "markers" => {"data" => @json, "options" => {"auto_zoom" => false} }) %>

Then add in your css:

div.map_container_renamed #map {
  width: 420px;
  height: 260px;
}

div.map_container_renamed {
  padding: 6px;
  border-width: 1px;
  border-style: solid;
  border-color: #ccc #ccc #999 #ccc;
  -webkit-box-shadow: rgba(64, 64, 64, 0.5) 0 2px 5px;
  -moz-box-shadow: rgba(64, 64, 64, 0.5) 0 2px 5px;
  box-shadow: rgba(64, 64, 64, 0.1) 0 2px 5px;
  width: 420px;
}

Answer 2

I should have given further details about this.

I'll make an installation rake task to copy css and javascript in the Rails app.

Well, for now, simply override this in your css (I assume you didn't change the map id).

#gmaps4rails_map {
  width: 800px;
  height: 400px;
}

If you want it to work, beware to include your css after the yield(:head)

<%= yield :head %>
<%= stylesheet_link_tag "your css" %>

Answer 3

The answer by @apenadving didn't work for me, assuming that the map div classes and id's didn't change, I needed to do the following (in scss) in order to get things working correctly, maybe I'm missing something...

.map_container{
   $width:675px;
   width:$width;
   .gmaps4rails_map{
     width: $width;
     height: 400px;
   }
}

Also with rails 3.1 and above you can simply do the following in your application.css.scss file

@import "gmaps4rails";
@import "myCoolStyle";