export default {
data (){
return {
shipments: [],
markerIcon: [],
yaMap: Function
}
},
methods: {
yandexMap(){
let data = this.shipments;
let myMap = new ymaps.Map("map", {
center: [55.751574, 37.573856],
zoom: 9,
behaviors: ["default", "scrollZoom"],
},
{
searchControlProvider: "yandex#search"
}
);
let clusterer = new ymaps.Clusterer();
let geoObjects = [];
for (var i = 0, len = data.length; i < len; i++) {
geoObjects[i] = new ymaps.Placemark(data[i].location, {
iconCaption: data[i].ml + ', ' + data[i].orderId + ', ' + data[i].height + ', ' + data[i].weight,
id: i
});
}
clusterer.add(geoObjects);
myMap.geoObjects.add(clusterer);
this.yaMap = myMap;
clusterer.events.add('click', function (e) {
let id = e.get('target').properties._data.id;
if(id !== undefined) {
e.originalEvent.currentTarget.remove(geoObjects[id])
}
});
},
something(){
ymaps.ready(() => {
this.yandexMap()
}, this.yandexMap)
},
},
watch: {
shipments: function (newVal, oldVal) {
if (newVal !== oldVal) {
this.something
}
},
},
computed: {
updateData(){
this.something()
return this.shipments = this.$store.state.shipmentData;
},
},
mounted() {
this.shipments = this.$store.state.shipmentData;
}
}
</script>
пробовал много вариантов но как то никак не получается
всегда с низу рендерится новая карта с новыми метками
тут выходов несколько как я понимаю
как то vue их хранит geoObjects и myMap
один раз рендерит карту а в при изменение просто удалить старые и добавить новые метки
так вопрос как можно их как то разделить что то вроде oldYaMap и oldGeoObject
или есть возможность как то проверить если былы создано до этого карта и выбрать его?
