选项卡时，gmaps4rails只显示地图的一半。任何想法为什么？ [英] gmaps4rails shows just half of the map when iside tab. Any idea why?

问题描述

Gmaps4rails非常适合我！

插入JQuery选项卡时会遇到麻烦。它加载地图的一半。它实际上看起来像是缺少图片。我可以照常移动/调整大小。但只显示地图的一部分。
缺失的部分通常是左/下部分。但空洞部分的大小始终在变化。

与此同时，当悬停时，显示鼠标光标的手在悬停时变成箭头部分（但这部分仍然在Google容器中）。

如果将gmaps容器放在JQuery选项卡之外，它可以很好地工作。有没有人见过这个？

view

 ＃tabs-4 
 #gmap 
 = gmaps（map_options=> {detect_location=> true，auto_zoom=> false，center_on_user=> true，zoom=> 17}，markers=> {data=> @json}）
  

很多！

解决方案

看到这个链接 http://jqueryui.com/demos/tabs/#...my_slider.2C_Google_Map.2C_sIFR_etc._not_work_when_placed_in_a_hidden_​​.28inactive.29_tab。 3F

但在V3中调整大小的方式不同

尝试调用 google.maps.event.trigger（map，'resize'）

编辑

我找到的每种方法都是指JavaScript中的更改。
另一种方式是找到 http://snipplr.com/view/57003/ （
show：function（event，ui）{
）

$ $ $ $ google.maps.event.trigger（map，'resize'）;
}
}）;

I have been looking around but I have not found a problem like this.

Gmaps4rails works great for me!

The trouble is when inserted into a JQuery tab. It loads half of the map. It actually looks like is missing pictures. I can move/resize as usual. But only shows a part of the map. And the part missing is usually the left/bottom part. But the size of the empty part varies all the time.

At the same time, the hand that shows the mouse cursor when hovering the map turns into arrow when hovering this empty part(but this part is still inside the Google container).

If I place the gmaps container out of the JQuery tabs, it works perfectly. Has anyone seen this before?

view

   #tabs-4
     #gmap
       =gmaps("map_options" => { "detect_location" => true, "auto_zoom" => false, "center_on_user" => true, "zoom" => 17},"markers" => { "data" => @json })

Thanks a lot!

解决方案

See this link http://jqueryui.com/demos/tabs/#...my_slider.2C_Google_Map.2C_sIFR_etc._not_work_when_placed_in_a_hidden_.28inactive.29_tab.3F

But resize is called differently in V3

Try calling google.maps.event.trigger(map, 'resize')

EDIT

Every method I found refers to a change in JavaScript. Another way I found http://snipplr.com/view/57003/

$('#tabs').tabs({
    show: function (event, ui) {
        google.maps.event.trigger(map, 'resize');
    }
});

这篇关于选项卡时，gmaps4rails只显示地图的一半。任何想法为什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！