2017-03-14 10 views
0

사용자가 피쳐를 생성하고 localStorage()geolocation()을 사용하여 위치를 저장하는 버튼을 클릭 할 때 피쳐를 생성하고 있습니다. 그런 다음 사용자가 페이지를 새로 고치거나 다른 페이지로 이동 한 다음 다시 돌아 오면 해당 기능을 다시 그려야합니다. 어떤 이유로 콘솔이 작동하지 않아 콘솔 오류가 발생하지 않습니다. 소스에 localStorage 버전을 추가 할 때마다 중단되는 것으로 보입니다. 여기이전에 localStorage에 저장된 좌표를 기반으로 한 피쳐 생성 OL3

내가 내 클릭 기능

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에서 기능이 전혀 나타나지 않을 것이다.

localStorage 버전을 자체 소스에 추가하려고 시도했지만 동일한 결과가 나타납니다. 클릭 기능은 localStorage 버전에서 geoLocationSource.addFeature(parkedCar); 행을 없애면 작동합니다. 또한 같은 레이어에 지오 로케이션 추적 기능이 있으며이 localStorage 기능을 구현하려고 시도 할 때 나타나지 않습니다.

답변

2

localStorage에서 좌표를 검색하려고하면 문제가 발생한다고 생각합니다. localStorage에서 좌표를 설정하고 가져 오면 문자열로 변환됩니다. 이 문자열을 Point로 전달하면 Array가 입력으로 간주됩니다. 당신이 localStorage.setItem("parkedCarCoords", [1, 2]);을 수행 할 때 문자열 형식으로

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); 
2

localStorage 객체 저장소 항목은 그래서 당신은 문자열 1,2하지 배열 객체를 저장합니다.

마찬가지로 localStorage.getItem("parkedCarCoords");을 입력하면 1,2 문자열이 표시되므로 [localStorage.getItem("parkedCarCoords")]["1,2"]과 같습니다.

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

당신은 좌표의 배열을 가지고 getItem의 결과를 분할해야