0

我尝试了许多不同的示例来使用 jquery-ui-map jquery 插件,但并不幸运。

这是简单的代码

<!DOCTYPE HTML>
<html>

<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript" src="js/jquery.ui.map.js"></script>
    <script type="text/javascript" src="js/jquery.ui.map.services.js"></script>
    <script type="text/javascript" charset="utf-8" src="jquery-1.7.1.min.js"></script>
    <script>
        function init() {
          $('#map_canvas').gmap({ 'center': '42.345573,-71.098326' });
        };
    </script>
</head>

<body onload="init();">
  <div id="map_canvas" style="width:100%; height:100%"></div>
</body>

</html>

它启动的脚本每次都在萤火虫控制台中向我显示:

网址:获取“https://maps.googleapis.com/maps/gen_204?ev=api_ads&cad=src:apiv3,ads:0”状态:204 无内容

我的第一印象是我不使用 API KEY,但在 Google 文档中说“不强制使用 KEY”。

任何想法 ?

提前致谢。

4

1 回答 1

0

这是一个工作示例。您应该只更改 jquery 和 jquery-ui-map 的路径:

<!DOCTYPE HTML>
<html>
    <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>
        <script type="text/javascript" src="js/jquery/jquery.min.js"></script>
        <script type="text/javascript" src="js/jquery/jquery.ui.map.full.min.js"></script>
        <script>
            function init() {
              $('#map_canvas').gmap({ 'center': '42.345573,-71.098326' });
            };
        </script>
    </head>

    <body onload="init();">
        <div id="map_canvas" style="width:100%;height:350px;"></div>
    </body>    
</html>

您的错误似乎如下:

  1. 您必须在 ui-map-plugin 之前包含 jQuery
  2. map_canvas的样式高度应以 px 为单位。
  3. 您应该通过 apihttp而不是https
于 2012-09-26T08:55:46.440 回答