2015-10-26 2 views
0

HERE небольшой демо, что я вытащил Сформируйте страницу примеры openlayers3, вы можете увидеть часть образца кода ниже:LocalStorage не работает в OpenLayers геолокации

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() })?

+0

Возможно, вы захотите проанализировать 'localStorage.layer', выполнив что-то вроде' JSON.parse (localStorage.layer) '. Это даст вам объект. Но я не очень оптимистичен в сравнении, так как ни один из двух объектов не идентичен. –

+0

@HunanRostomyan naa не работает! –

ответ

1

Tile возвращает какой-либо объект, а значение localStorage.getItem(layerStr) - это строка. Чтобы извлечь сохраненный объект из строки, вы можете сделать 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 для деталей.

+0

'JSON.parse (localStorage.layer)' генерирует ошибку! –

+0

@TenaliRaman Что-то про «неожиданный токен u»? –

+0

Да, это ошибка, которую я получаю! –

0

Объект 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]" и, очевидно, не может быть равно вашему слою.

Вы просто не можете сохранить объект в локальном хранилище, только строку.

Смежные вопросы