本地存储谷歌地图标记 [英] local storage for google map markers

问题描述

我如何将localStorage合并到我的代码中？我在我的谷歌地图上有一个隐藏和显示标记数组的显示和隐藏按钮。我点击按钮时需要将值存储在localStorage中。

How do I incorporate localStorage in my code? I have a show and hide button on my google map that will Hide and Show a marker array. I need to store the values in localStorage when the button is clicked.

到目前为止：

What I have so far:

var testbtn = document.getElementById('test1');
var testbtn2 = document.getElementById('test2');
google.maps.event.addDomListener(testbtn, 'click', hide);
google.maps.event.addDomListener(testbtn2, 'click', show); 

function hide() {
    set_speed_camera(null);
    localStorage.setItem("hide_speed_camera", "true");       
}

function show() {
    set_speed_camera(map);
    localStorage.setItem("show_speed_camera", "true");
}

$(document).ready(function(e) {
    if(JSON.parse(localStorage.getItem("show_speed_camera"))) {
       set_speed_camera(map);
       alert('testing..Show')    
    }
}); 

$(document).ready(function(e) {
    if(JSON.parse(localStorage.getItem("hide_speed_camera"))) {
        set_speed_camera(null);
        alert('testing..Hide')
        localStorage.removeItem('hide_speed_camera');
    } 
});

推荐答案

您有一个明显的问题，那就是您使用 localStorage.getItem 来获取字符串化的布尔值。相反，将 JSON.parse 转换为您的 getItem ：

You have one obvious issue, which is that you are using localStorage.getItem to get the stringified boolean. Instead, cast a JSON.parse to your getItem:

var testbtn = document.getElementById('test1');
var testbtn2 = document.getElementById('test2');
google.maps.event.addDomListener(testbtn, 'click', hide);
google.maps.event.addDomListener(testbtn2, 'click', show); 


function hide() {    
    set_speed_camera(null);
    localStorage.setItem("hide_speed_camera", "true");
}

function show() {
    set_speed_camera(map);
    localStorage.setItem("show_speed_camera", "true");
}
if(JSON.parse(localStorage.getItem("show_speed_camera"))) {    
    set_speed_camera(map);
}
if(JSON.parse(localStorage.getItem("hide_speed_camera"))) {
    set_speed_camera(null);
} 

---

---

> Boolean("true")
true
> Boolean("false")
true

因此，除非您使用 JSON.parse ， getItem 的结果将始终为 true 。

Thus, unless you use a JSON.parse, the result of the getItem will always be true.

这篇关于本地存储谷歌地图标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！