CODEWITHSUNDEEP
ruby-on-railsrubyruby-on-rails-3google-mapsgmaps4rails
manu_v
manu_v

Reputation: 1258

Gmaps4rails : Setting map width and height

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 ?

Upvotes: 12

Views: 4144

Answers (3)

Abram
Abram

Reputation: 41914

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;
}

Upvotes: 0

user160917
user160917

Reputation: 9350

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";

Upvotes: 2

apneadiving
apneadiving

Reputation: 115541

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" %>

Upvotes: 11

Related Questions