我正在尝试使用 sancha js lib，并构建一个离线 iphone4 应用程序。
iPhone (iOS 4) 在 iphone safari 中访问它时报告错误: 类型错误:表达式“google.maps.LatLng”的结果[未定义]不是构造函数
这是我的index.html 文件:
<!DOCTYPE html>
<html manifest="maptest.manifest">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Map</title>
<link rel="stylesheet" href="sencha-touch.css" type="text/css">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="sencha-touch-debug.js"></script>
<script type="text/javascript" src="plugins/GmapTracker.js"></script>
<script type="text/javascript" src="plugins/GmapTraffic.js"></script>
<script type="text/javascript" src="index.js"></script>
</head>
<body>
</body>
</html>
list :
map 测试.manifest
CACHE MANIFEST
# VERSION 1.2
NETWORK:
*
CACHE:
index.html
sencha-touch.css
http://maps.google.com/maps/api/js?sensor=true
plugins/GmapTracker.js
plugins/GmapTraffic.js
sencha-touch-debug.js
index.js
index.js:
Ext.setup({
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
icon: 'icon.png',
glossOnIcon: false,
onReady: function() {
// The following is accomplished with the Google Map API
var position = new google.maps.LatLng(37.44885,-122.158592), //Sencha HQ
infowindow = new google.maps.InfoWindow({
content: 'Sencha Touch HQ'
}),
//Tracking Marker Image
image = new google.maps.MarkerImage(
'point.png',
new google.maps.Size(32, 31),
new google.maps.Point(0,0),
new google.maps.Point(16, 31)
),
shadow = new google.maps.MarkerImage(
'shadow.png',
new google.maps.Size(64, 52),
new google.maps.Point(0,0),
new google.maps.Point(-5, 42)
),
trackingButton = Ext.create({
xtype : 'button',
iconMask: true,
iconCls : 'locate'
} ),
toolbar = new Ext.Toolbar({
dock: 'top',
xtype: 'toolbar',
ui : 'light',
defaults: {
iconMask: true
},
items : [
{
position : position,
iconCls : 'home',
handler : function(){
//disable tracking
trackingButton.ownerCt.setActive(trackingButton, false);
mapdemo.map.panTo(this.position);
}
},{
xtype : 'segmentedbutton',
allowMultiple : true,
listeners : {
toggle : function(buttons, button, active){
if(button.iconCls == 'maps' ){
mapdemo.traffic[active ? 'show' : 'hide']();
}else if(button.iconCls == 'locate'){
mapdemo.geo[active ? 'resumeUpdates' : 'suspendUpdates']();
}
}
},
items : [
trackingButton,
{
iconMask: true,
iconCls: 'maps'
}
]
}]
});
mapdemo = new Ext.Map({
mapOptions : {
center : new google.maps.LatLng(37.381592, -122.135672), //nearby San Fran
zoom : 12,
mapTypeId : google.maps.MapTypeId.ROADMAP,
navigationControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.DEFAULT
}
},
plugins : [
new Ext.plugin.GMap.Tracker({
trackSuspended : true, //suspend tracking initially
highAccuracy : false,
marker : new google.maps.Marker({
position: position,
title : 'My Current Location',
shadow: shadow,
icon : image
})
}),
new Ext.plugin.GMap.Traffic({ hidden : true })
],
listeners : {
maprender : function(comp, map){
var marker = new google.maps.Marker({
position: position,
title : 'Sencha HQ',
map: map
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, marker);
});
setTimeout( function(){ map.panTo (position); } , 1000);
}
}
});
new Ext.Panel({
fullscreen: true,
dockedItems: [toolbar],
items: [mapdemo]
});
}
});
最佳答案
查看http://maps.google.com/maps/api/js?sensor=true您将看到它将脚本动态加载到您的页面中。理论上，您还必须缓存所有这些脚本 URL。
但是，无法使交互式 map 离线可用。它将在用户交互期间动态加载资源。如果您的应用程序处于离线状态，这将不起作用。
关于html - 使用 HTML5 缓存 google map iPhone 离线使用错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5001303/