Question

我刚刚开始使用Google Maps API v3和jQuery。我之前使用v2 API制作了地图，但它没有使用jQuery。这种方式有望帮助我在路上学习更多jQuery。我正在关注Google Maps API Tutorial上的示例，并试图让他们最基本的hello世界与jQuery一起工作。我也在使用Google Maps API3 Visual Studio Intellisense helper。

我的主页如下：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Map Page</title>
<link href="style/main.css" rel="stylesheet" />
<script src="scripts/jquery-1.10.2.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script src="scripts/google-maps-3-vs-1-0.js"></script>
<script src="scripts/mdaMap.js"></script>
<script type="text/javascript">
    $(function () {
        map = new google.maps.Map($("#map-canvas"), startMapOptions);
    });
</script>
</head>
<body>
    <div id="map-canvas" />
</body>
</html>

mdaMap.js包含以下内容：

/// <reference path="jquery-1.10.2.js" />
/// <reference path="google-maps-3-vs-1-0.js" />

var map;
var startMapOptions = new google.maps.MapOptions;
var startCenterLocation = new google.maps.LatLng(32.912229, -88.692627);
var startZoomLevel = 7;
var startMapTypeId = google.maps.MapTypeId.ROADMAP;

我正在尝试使用一些基本的jQuery来将地图加载到特定元素中，而不是使用Google的google.maps.event.addDomListener(window, 'load', initialize);教程代码

我错过了什么？我的jQuery知识是有限的，但我认为我至少知道如何做选择器并在页面准备就绪时运行脚本$(function() {})'

或者我错误地认为可以使用addDomListener以上述方式初始化地图？

Answer 1

您需要一个dom元素而不是jquery对象

  <script type="text/javascript">
      $(function () {
        map = new google.maps.Map($("#map-canvas").get(0), startMapOptions);
      });
  </script>

使用jQuery初始化Google Map

1 个答案: