/ / Gmaps4rails: Définition de la largeur et de la hauteur d'une carte - ruby-on-rails, ruby, ruby-on-rails-3, google-maps, gmaps4rails

Gmaps4rails: Définition de la largeur et de la hauteur d'une carte - ruby-on-rails, ruby, ruby-on-rails-3, google-maps, gmaps4rails

En lisant la documentation sur les pierres précieuses gmaps4rails, je n’ai trouvé aucun moyen de définir la largeur et la hauteur de la carte. Y at-il un moyen de le faire?

Réponses:

11 pour la réponse № 1

J'aurais dû donner plus de détails à ce sujet.

Je vais créer une tâche d’installation pour copier css et javascript dans l’application Rails.

Eh bien, pour l'instant, remplacez simplement cette dans vos css (Je suppose que vous n’avez pas changé l’identifiant de la carte).

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

Si vous voulez que cela fonctionne, méfiez-vous d'inclure votre css après le yield(:head)

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

2 pour la réponse № 2

La réponse de @apenadving n'a pas fonctionné pour moi, en supposant que les classes div de la carte et l'id "s" n'ont pas changé, il fallait que je fasse (en scss) pour que les choses fonctionnent correctement, peut-être me manque-t-il quelque chose ...

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

Aussi avec les rails 3.1 et ci-dessus, vous pouvez simplement faire ce qui suit dans votre application.css.scss fichier

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

0 pour la réponse № 3

si vous voulez le faire facilement, je vous recommande de suivre ces étapes:

Ajoutez une classe de conteneur personnalisée à l'aide de:

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

Ensuite, ajoutez dans votre 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;
}