3

私のアプリケーション (html+JavaScript) は、Google マップをベース レイヤーとして使用します。また、インターネット接続がない場合に使用するオフライン ベース レイヤーとして OSM をセットアップします。

現在、インターネット接続をアプリでチェックする方法をロックしています。存在する場合は、Google マップをベース レイヤーとして使用します。そうでない場合は、OSM を使用してください。

4

2 に答える 2

3

Google マップ タイルの読み込みが失敗したときにスローされる「loaderror」イベントをリッスンできます。通常の WMS レイヤーの例を次に示します (完全な例はhttp://jsfiddle.net/D3Eha/2/にあります) 。

var wmsLayer, workingOffline = false;

wmsLayer = new OpenLayers.Layer.WMS("OpenLayers WMS",
    "http://vmap0.tiles.osgeo.org/wms/vmap0?",
    {layers: 'basic'},
    {
        attribution: 'Provided by OSGeo',
        tileOptions: {
            eventListeners: {
                'loaderror': function(evt) {
                    if (workingOffline == false) {
                        console.log('Tile load error, switching to offline map');
                        workingOffline = true;
                    }
                }
            }
        }        
    }
);

コンピュータが再びオンラインになると、検出するのが難しくなります。たとえば、オフラインになると、定期的なタイマーを開始して、インターネットから画像を読み込みます。成功すると、オンラインに戻ります。

于 2013-03-25T10:02:36.693 に答える
0

私はその解決策を考案しました。あなたのケースに合わせて調整する必要があります。

    var backupLayerUrl = {
        url: "http://b.tile.opencyclemap.org/cycle/",
        type: "png"
    }

tileOptions = {
            eventListeners: {
                'loaderror': function(e) {
                    console.dir(e);
                    var newUrl = backupLayerUrl.url;
                    var oldUrl = e.object.url;
                    var oUS = oldUrl.split("/");//oldUrlSplitted

                    var type = backupLayerUrl.type;

                    var z = oUS[oUS.length-3];
                    var x = oUS[oUS.length-2];
                    var y = oUS[oUS.length-1].split(".")[0];

                    var layerType = e.object.layer.CLASS_NAME.split(".")[e.object.layer.CLASS_NAME.split(".").length-1];

                    if (layerType != "OSM"){
                        var ymax = 1 << z;
                        y = ymax - y - 1;
                    }

                    newUrl += z + "/" + x + "/" + y + "." + type;
                    e.object.imgDiv.src = newUrl;
                }
            }
        };

    var mylayer = new OpenLayers.Layer.TMS("Layer Name", "/layer_url/",
              {     tileOptions: tileOptions,
                    projection: epsg900913,
                    alpha: true,
                    type: 'png',
                    visibility: false,
                    isBaseLayer: true,
                    getURL: getTileURL
              });
于 2015-03-25T16:35:28.767 に答える