Google Maps在jQuery中无法加载地图
我用js写了一段导航的代码但是地图却无法载入，在浏览器上试的时候没有问题，但是添加进jQuery的模板的时候就出现地图无法载入的问题了。求指教~$(document).ready(function () {
directionsRenderer = new google.maps.DirectionsRenderer();
if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(function(position){
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var coords = new google.maps.LatLng(latitude, longitude);
var mapOptions = {
zoom: 15,
center: coords,
mapTypeControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(
document.getElementById("map"), mapOptions
);
var markerStart = new google.maps.Marker({
position: coords,
map: map,
title: "Start"
});
directionsRenderer.setMap(map);
});}
// Set up map starting point for Google Maps.
OnError = function(Err)
{
alert("Error!");
}
在ff作为一个单独的网页跑出来过，但是放进jQuery的整个App里面地图却加载不出来，求指教~是速度太慢还是代码有需要修改的地方。
ff跑出来是这样的：
但是放在jQuery里面整合就加载不出地图了~
我在整合时把js单独拉出来写了一个文件然后再html写了：
<script src="http://maps.google.com/maps/api/js?sensor=true&language=en"></script>--------------------编程问答-------------------- 直接放到你的.html里
<script src="https://maps.googleapis.com/maps/api/geocode/output?parameters"></script>
<script src="https://maps.googleapis.com/maps/api/directions/output?parameters"></script>
<script src="http://j.maxmind.com/app/geoip.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script src="maps/directionRenderer.js"></script>
1.<!DOCTYPE HTML>
2.<html lang="en-US">
3.<head>
4. <meta charset="UTF-8">
5. <title>Main Page</title>
6. <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />
7. <script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
8. <script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>
9.</head>
10.<body>
11. <div data-role="page">
12. <div data-role="header"><h1>Main Page</h1></div>
13. <div data-role="content"><p><a href="map.html">Map</a></p></div>
14. </div>
15. <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
16. <script type="text/javascript">
17. // When map page opens get location and display map
18. $('.page-map').live("pagecreate", function() {
19. if(navigator.geolocation) {
20. navigator.geolocation.getCurrentPosition(function(position){
21. initialize(position.coords.latitude,position.coords.longitude);
22. });
23. }
24. });
25.
26. function initialize(lat,lng) {
27. var latlng = new google.maps.LatLng(lat, lng);
28. var myOptions = {
29. zoom: 8,
30. center: latlng,
31. mapTypeId: google.maps.MapTypeId.ROADMAP
32. };
33. var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
34. }
35. </script>
36.</body>
37.</html>
map.html
1.<div data-role="page" data-theme="b" class="page-map" style="width:100%; height:100%;">
2. <div data-role="header"><h1>Map Page</h1></div>
3. <div data-role="content" style="width:100%; height:100%; padding:0;">
4. <div id="map_canvas" style="width:100%; height:100%;"></div>
5. </div>
6.</div>
--------------------编程问答-------------------- 同样加载不出……求指教~ --------------------编程问答-------------------- 还是不行吗？问题在于jquery必须要求map在另外一个html里。否则无法显示。 --------------------编程问答-------------------- 貌似不是这个问题……没听说过jquery有这种问题…… --------------------编程问答-------------------- 好像是这个问题，我的地图也是在一个Html里，两个page,显示不了地图，但在浏览器里面可以，晚上回来再整
补充：移动开发 , BlackBerry
