相关疑难解决方法(0)

如何使用jqueryplugin全屏googlemaps

如下图所示,地图仅显示在左上角,可以在整个屏幕上拖动它,但它会跳回到那个方块并且只显示在那里.

所以我想知道如何解决这个问题？

在图片下方你会找到我的html,插件列表和js代码.

地图仅显示左上角

HTML/JSP :(应该提到这是我的应用程序中的第二个.jsp,所以它应该有希望在pageinit方法中初始化)

<!DOCTYPE html> 
<html>
    <head> 
        <title>Map</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <link rel="stylesheet" href="js/jquery.mobile-1.1.0.css" />
    </head> 
    <body> 
        <!-- Start of first page -->
        <div data-role="page" id="mapmode" name="mapmode">

            <div data-role="header" id="header" name="header">
                <p>Header</p>
            </div><!-- /header -->
            <div data-role="content" id="content" name="content">   
                <div id="map_canvas" style="width:300px;height:350px"></div>

            </div><!-- /content -->
        </div><!-- /page -->
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

插件:

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
        <script type="text/javascript" src="js/jquery.mobile-1.1.0.js"></script>
        <script type="text/javascript"
                src="http://maps.googleapis.com/maps/api/js?key=_MY_KEY__INSERT_HERE_&sensor=true">
        </script>
        <script type="text/javascript" src="js/jquery.ui.map.js"></script>
        <script type="text/javascript" src="js/cordova-1.9.0.js"></script>
        <script type="text/javascript" src="js/FileManager.js"></script>
        <script …

Run Code Online (Sandbox Code Playgroud)

jquery jquery-plugins google-maps-api-3 jquery-mobile

And*_*nik

2012 07-30

9
推荐指数

1
解决办法

2328
查看次数

谷歌地图+ jQuery:渲染bug

在jquery-ui选项卡中放置谷歌地图时,地图无法在某些情况下正确显示.重现:

去这里
点击"列表"链接
调整浏览器窗口的大小
点击"地图"链接

观察一些地名叠加正确绘制,但其他地方没有.我实际上已经删除了所有jquery-ui的东西以限制问题的范围,它似乎只是display:hide/display:block的应用程序导致问题.

UPDATE

偶尔也会出现错误,只是在display:none/block之间切换时 - 例如没有调整大小.这似乎是IE中最常见的(8).

css jquery google-maps jquery-ui

Bob*_*ack

2009 07-20

7
推荐指数

1
解决办法

1万
查看次数

Google地图和jQuery标签

我在简单的jQuery选项卡中包含的Google地图存在轻微问题.

下面我贴了代码:

jQuery的:

$(document).ready(function() {

    //Default Action
    $(".tab_content").hide();
    $("ul.tabs li:first").addClass("active").show(); 
    $(".tab_content:first").show(); 

    //On Click Event
    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active");
        $(this).addClass("active"); 
        $(".tab_content").hide(); 
        var activeTab = $(this).find("a").attr("href"); 
        $(activeTab).fadeIn();
        return false;
    });

});

Run Code Online (Sandbox Code Playgroud)

以下是标签的HTML:

<div class="bluecontainer">
    <ul class="tabs">
        <li><a href="#tab1">Tab1</a></li>
        <li><a href="#tab2">Tab2</a></li>
        <li><a href="#tab3">Tab3</a></li>
        <li><a href="#tab4">Tab4</a></li>
    </ul>
    <div class="tab_container">
        <div id="tab1" class="tab_content">
            <h2>Tab1</h2>
        </div>
        <div id="tab2" class="tab_content">
            <h2>Tab2</h2>
        </div>
        <div id="tab3" class="tab_content">
            <div>
                google Map
            </div>
        </div>
        <div id="tab4" class="tab_content">
            <h2>Tab4</h2>
        </div>
    </div>
</div>

Run Code Online (Sandbox Code Playgroud)

我真的不知道该怎么做.这是谷歌地图的一般问题,还是我的标签有什么问题？但是他们对其他一切都很好.

提前谢谢你的帮助

jquery google-maps jquery-tabs

Dom*_*Dom

2013 11-30

6
推荐指数

2
解决办法

2万
查看次数

jQuery UI + Gmaps =问题(至少对我来说)帮助!

我一发现就开始使用jQuery,它非常强大,但当我尝试将Gmaps api加载到jQuery UI带来的选项卡时,我开始苦苦挣扎.在IE 6,7,8中,它运行得很好,但是在Firefox中,Safari(我使用的是Mac但在Windows中测试它们并且它们都提供相同的问题)地图不会完全加载.当我单击加载地图的选项卡时,只有部分地图完全可操作,其余部分为灰色且无法点击.请查看下面的链接,然后单击firefox/safari和IE中的第三个选项卡,您将看到问题所在.

http://movewithusoverseas.com/index-new.php?z=product-info.html&pid=1

我不知道它是jQuery UI代码中的错误还是我做错了什么.如果我从选项卡中加载地图,则会显示地图.

我正在与这个问题作斗争一个半星期......任何帮助将不胜感激.

提前致谢.路易斯

firefox google-maps jquery-ui

Lui*_*uis

lucky-day

2
推荐指数

1
解决办法

5737
查看次数

Google地图加载奇怪

我在我的网站上使用Google Maps API(v3)来显示以某个位置为中心的地图.

这是我的代码:

<script type="text/javascript">
$(document).ready(function() {
    var latlng = new google.maps.LatLng(-22.924484, -43.208001);
    var map = new google.maps.Map(document.getElementById("map-property2"), {
        zoom: 13,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
});
</script>

Run Code Online (Sandbox Code Playgroud)

在我结束时我<head>有:

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

Run Code Online (Sandbox Code Playgroud)

这是结果:

替代文字

你可以看到它就像那里有两张地图..但如果我调整窗口大小,地图就固定了!

还有一个问题:看看地图的左上角？这是变量的位置latlng.这应该是地图的中心,但它加载为左上角.:/

Ps.:我的Firebug JS控制台上没有错误或警告.

我在这里找到了一个解决方案:使用API V3的主要谷歌地图故障

并且测试它我发现了另一件事:我正在尝试将地图加载到隐藏的div(不是地图画布,但是包含它的容器)上,当我单击选项卡菜单时会显示该地图.

如果在setTimeout选项卡处于活动状态且容器可见时加载(使用)地图,则地图加载正常.

我疯了......真的.

google-maps position google-maps-api-3

Thi*_*lem

2017 05-23

1
推荐指数

1
解决办法

4360
查看次数

Ui-Tabs中的Google Maps Api v3地图已被剪切

我知道这是一个常见的问题,我已经在这里查看了解决方案的所有主题,但是,当我更改标签时,我继续这个问题:

在此输入图像描述

请看看我的js代码:

  function initialize() {

//replace 0's on next line with latitude and longitude numbers from earlier on in tutorial.
var myLatlng = new google.maps.LatLng(40.654372, -7.914174);
var myLatlng1 = new google.maps.LatLng(43.654372, -7.914174);
    var myOptions = {
      zoom: 16,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    var myOptions1 = {
      zoom: 16,
      center: myLatlng1,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

//here's where we call the marker.
//getElementById must be the same as the id you gave for the container of the map
var map = new …

Run Code Online (Sandbox Code Playgroud)

javascript jquery tabs google-maps google-maps-api-3

use*_*579

lucky-day

1
推荐指数

1
解决办法

5435
查看次数