Помогите пожалуйста понять как нужно сохранять коллекцию геообъектов(маркеров) в localStorage.
Я написал скрипт, который ставит на яндекс-карту маркер после клика по карте. Но я хотел бы сохранить набор поставленных маркеров таким образом чтобы после перезагрузки страницы они снова были отрисованы на карте.
Местом хранения коллекции этих маркеров я выбрал localStorage. Но проблема в том, что js не хочет записывать в localStorage объект коллекции. Консоль выводит следующее сообщение об ошибке:
Uncaught TypeError: Converting circular structure to JSON
ymaps.ready(init);
var myMap,
myCollection,
myPlacemark;
function init(){
myMap = new ymaps.Map("map", {
center: [55.76, 37.64],
zoom: 7
});
myCollection = new ymaps.GeoObjectCollection ({},
{ geoObjectDraggable: true }
);
myMap.events.add('click', function (e) {
var coords = e.get('coords');
console.log('lat:', coords[0], 'lng:', coords[1]);
var placemark = new ymaps.Placemark([coords[0], coords[1]]);
this.myCollection.add(placemark);
myMap.geoObjects.add(this.myCollection);
console.log(this.myCollection);
addPoint();
});
};
function getPoints() {
return localStorage.points ? JSON.parse(localStorage.points) : [];
};
function addPoint() {
console.log(myCollection);
var points = getPoints();
localStorage.points = JSON.stringify(myCollection);
};
Если нужно, то вот JSFIDDLE. Но в нём консоль показывает совсем другую ошибку, поэтому лучше его не смотреть.
Мне важно именно использовать коллекцию. Вариант, который не использует коллекцию и записывает координаты маркеров в локалсторадж в виде обычного объекта я уже реализовал.