Question

HERE 是我从openlayers3示例页面中提取的一个小型演示，您可以在下面看到一段示例代码：

var map = new ol.Map({
    layers: [
        new ol.layer.Tile({
            source: new ol.source.OSM()
        })
    ],
    target: 'map',
    controls: ol.control.defaults({
        attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
            collapsible: false
        })
    }),
    view: view
});

现在我想使用localStorage，因此我修改了代码如下：

if(!localStorage.layer) {
    localStorage.layer = new ol.layer.Tile({ source: new ol.source.OSM()  })
}

// creating the map
var map = new ol.Map({
    layers: localStorage.layer ? [ localStorage.layer ] : [
        new ol.layer.Tile({
            source: new ol.source.OSM()
        })
    ],
    target: 'map',
    controls: ol.control.defaults({
        attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
            collapsible: false
        })
    }),
    view: view
});

现在由于某些原因，这不起作用，现在如果我做一些调试，我得到以下

现在，如果我在控制台中输入以下内容：

new ol.layer.Tile({ source: new ol.source.OSM() })

我得到了

G {ca: false, ka: undefined, fb: Kc, pd: G, Ma: null…}

但如果我这样做

localStorage.layer = new ol.layer.Tile({ source: new ol.source.OSM()  })

然后输入：

localStorage.layer

我得到了

"[object Object]"

那为什么呢 localStorage.layer不等于新ol.layer.Tile({ source: new ol.source.OSM() })？我相信这是导致地图无法加载的原因。当然，如果我删除localStorage代码，地理定位地图就可以正常工作。那么为什么localStorage.layer不等于新ol.layer.Tile({ source: new ol.source.OSM() })？

Answer 1

Tile返回某种Object，而localStorage.getItem(layerStr)的值是String。要从字符串中提取存储的对象，您可以执行JSON.parse(localStorage.getItem(layerStr))，其中layerStr = JSON.stringify(layer)。这是一个非常人为的例子，用于存储和检索localStorage中的对象：

var person = {first: 'Tenali', last: 'Raman'};

localStorage.setItem('person', JSON.stringify(person));

JSON.parse(localStorage.getItem('person'));  // => {first: 'Tenali', ...}

但即便如此，不幸的是，你无法得到你想要的答案，因为这表明：

var storedTile = JSON.parse(localStorage.getItem(layer));
var storedTile2 = JSON.parse(localStorage.getItem(layer));

storedTile == storedTile2;  // => false
storedTile === storedTile2;  // => false; follows from the line above

通常，对象按身份进行比较，而不是按值进行比较。检查this answer两个javascript对象之间的相等关系，了解详细信息。

Answer 2

localStorage对象只能存储字符串，请参阅doc。

实际上localStorage.layer = new ol.layer.Tile({ source: new ol.source.OSM() }) (new ol.layer.Tile({ source: new ol.source.OSM() })).toString()存储localStorage.layer = "[object Object]"所以$table = "<table id='availabilitytableData'>\n\n"; $f = fopen("assets/temp/test.csv", "r"); while (($line = fgetcsv($f)) !== false) { $table .= "<tr>"; foreach ($line as $cell) { $table .= "<td style='font-size:9pt;'>" . htmlspecialchars($cell) . "</td>"; } $table .= "</tr>\n"; } fclose($f); $table .= "\n</table>"; return $table;显然不能与您的图层对象相等。

您根本无法将对象存储在本地存储中，只能存储字符串。

Localstorage无法在openlayers geolocation

2 个答案: