Javascript 基于先前保存在localStorage OL3中的坐标创建要素

当用户单击一个按钮时，我正在创建一个功能，该按钮将创建一个功能并使用

geolocation（）

将其位置保存到

localStorage（）

中。如果用户随后刷新页面，或导航到另一个页面并返回，我希望它重新绘制该功能。由于某些原因，这不起作用，我没有收到任何控制台错误。每当我将

localStorage

版本添加到源代码时，它似乎都会中断

这里是我第一次在单击函数上绘制它的地方

var coords = geolocation.getPosition();
swal("Your location has been pinned! " + coords)
var parkedCar = new ol.Feature({
    geometry: new ol.geom.Point(coords)
})
localStorage.setItem("parkedCarCoords", coords);
parkedCar.setId("parkedCar");
parkedCar.setStyle(styleNS.styleFunction(styleConfig.parkedCarStyle));
geoLocationSource.addFeature(parkedCar);

这里是我在页面加载中检查它并尝试绘制该特性的地方

if (localStorage.getItem("parkedCarCoords")) {
        var parkedCar = new ol.Feature({
            geometry: new ol.geom.Point([localStorage.getItem("parkedCarCoords")])
        })
        parkedCar.setId("parkedCar");
        parkedCar.setStyle(styleNS.styleFunction(styleConfig.parkedCarStyle));
        geoLocationSource.addFeature(parkedCar);
    }

当我尝试这样做时，无论是单击功能还是本地存储，该功能都不会显示出来

---

我尝试将localStorage版本添加到它自己的源代码中，但结果相同。如果我去掉了

geoLocationSource.addFeature（parkedCar），点击功能就会起作用本地存储版本中的行。可能还值得注意的是，我在同一层上有一个地理位置跟踪功能，当我尝试实现此localStorage功能时，它也不会出现。
我认为当您尝试从localStorage检索坐标时，它会出错。在localStorage中设置和获取坐标时，坐标将转换为字符串。您正在将此字符串传递给点，点需要一个数组作为输入

localStorage.setItem('coords', [1,1]);

localStorage.getItem('coords');
// Returns: "1,1" instead of [1,1]

// To pass these coordinates to a Point, use the split function
var coords = localStorage.getItem('coords').split(',');
new ol.geom.Point(coords);

我认为当您尝试从本地存储中检索坐标时会出错。在localStorage中设置和获取坐标时，坐标将转换为字符串。您正在将此字符串传递给点，点需要一个数组作为输入

localStorage.setItem('coords', [1,1]);

localStorage.getItem('coords');
// Returns: "1,1" instead of [1,1]

// To pass these coordinates to a Point, use the split function
var coords = localStorage.getItem('coords').split(',');
new ol.geom.Point(coords);

localStorage
对象以字符串格式存储项，因此当您执行
localStorage.setItem（“parkedCarCoords”，[1，2]）
存储字符串
1,2
而不是数组对象

与执行
localStorage.getItem（“parkedCarCoords”）时的方式相同
您收到字符串
1,2
因此
[localStorage.getItem（“parkedCarCoords”）]
等于
[“1,2”]

您需要拆分
getItem
的结果以获得坐标数组：

var parkedCar = new ol.Feature({
        geometry: new ol.geom.Point(localStorage.getItem("parkedCarCoords").split(','))
 })

localStorage
对象以字符串格式存储项，因此当您执行
localStorage.setItem（“parkedCarCoords”，[1，2]）
存储字符串
1,2
而不是数组对象

与执行
localStorage.getItem（“parkedCarCoords”）时的方式相同
您收到字符串
1,2
因此
[localStorage.getItem（“parkedCarCoords”）]
等于
[“1,2”]

您需要拆分
getItem
的结果以获得坐标数组：

var parkedCar = new ol.Feature({
        geometry: new ol.geom.Point(localStorage.getItem("parkedCarCoords").split(','))
 })