个人中心
gpt4 book ai didi

html - 使用 HTML5 缓存谷歌地图供 iphone 离线使用错误

转载 作者：行者123 更新时间：2023-11-27 22:49:26 25 4
gpt4 key购买 nike

我正在试验 sancha js 库，并构建一个离线 iphone4 应用程序。

iPhone (iOS 4) 在 iphone safari 中访问它时报告错误:TypeError: 表达式 'google.maps.LatLng' [undefined] 的结果不是构造函数

这是我的 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 测试 list 

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 缓存谷歌地图供 iphone 离线使用错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5001303/

25 4 0
文章推荐： c++ - std::fclose() 的一个非常奇怪的问题
文章推荐： javascript - 发送客户端其他玩家的分数？ Socket.io
文章推荐： javascript - 如何在 contenteditable 元素中保持插入符号的位置
文章推荐： javascript - 为什么多次调用 fillRect() 比一次调用 fillRect() 慢？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com