Клуб API Карт

Выдается ошибка после добавления метки на карту 'Cannot read property 'getShape' of undefined'

Пост в архиве.

Uncaught TypeError: Cannot read property 'getShape' of undefined

Всем привет. Добавляю метку в реальном времени на карту, задавая ей базовые свойства, при этом первая метка добавляется на ура и все хорошо, но после второй выползает данная ошибка и карта молчит. Реагирует она, конечно, на движение мыши. С чем этом может быть связано?

 

Код:

var myMap;
ymaps.ready(init);
function init () {
    myMap = new ymaps.Map('map', {
        center: [55.76, 37.64], // Москва
        zoom: 10
    },
    {
        balloonMaxWidth: 200
    });
    myMap.geoObjects
        .add(new ymaps.Placemark([55.684758, 37.738521], {
          balloonContent: 'цвет <strong>влюбленной жабы</strong>'
        }, {
            preset: 'twirl#blueIcon',
        }))
    myMap.events.add('click', function (e) {
      if (!myMap.balloon.isOpen()) {
    var coords = e.get('coords');
    myMap.balloon.open(coords, {
        contentHeader:'<form class="addplacemark"><p>Добавить метку</p>',
        contentBody:'<p><input name="pm_x" value="'+coords[0].toPrecision(6)+'"></input></p><p><input name="pm_y" value="'+coords[1].toPrecision(6)+'"></input><p>'
                  + '<p><input name="pm_name" placeholder="Название"></input></p>'
                  + '<p><select name="pm_preset"><option value="twirl#blueIcon">Голубой</option><option value="twirl#blackIcon">Черный</option></select></p>'
                  + '<p><input type="text" name="pm_hint" placeholder="hint"></p>'
                  + '<p><textarea name="pm_desc" placeholder="Описание"></textarea></p>',
        contentFooter:'<div class="pm_subm">Отправить</div></form>'
    });
    $('body').on('click','.pm_subm',function(){
      var sers = $('.addplacemark').serialize()
      var pm_x = $('input[name="pm_x"]').val();
      var pm_y = $('input[name="pm_y"]').val();
      var pm_name = $('input[name="pm_name"]').val();
      var pm_preset = $('input[name="pm_preset"]').val();
      var pm_hint = $('input[name="pm_hint"]').val();
      var pm_desc = $('textarea[name="pm_desc"]').val();
      myMap.geoObjects
          .add(new ymaps.Placemark([pm_x, pm_y], {
            balloonContent: pm_name
          }, {
              preset: pm_preset,
          }))
          myMap.balloon.close();
    }) 
}
else {
    myMap.balloon.close();
}
});
}

 

 

9 комментариев

Лучше давать ссылку, пока пара очевидных проблем

1. Координаты должны быть массивом чисел, а не строк здесь

[pm_x, pm_y]

2 на каждый клик по карте при закрытом балуне навешивается новый обработчик на body

ссылки нет, все локально. Справился, исправив первый пункт. А второй изменить невозможно, так как тогда он не сможет обратиться к динамически созданной кнопке, ведь обращаюсь я не к боди, а к кнопке внутри неё.

 

Вот тут и случается проблема. Вся она связана с тем, что добавляется не новый экземпляр метки, все данные передаются в уже созданную (при создании второй). Но я даже не присваиваю ей переменную. Как же быть?

$('body').on('click','.pm_subm',function(){  var sers = $('.addplacemark').serialize();  var name = $('#namepm').val();  var color = $('#color').val();  myMap.geoObjects      .add(new ymaps.Placemark([coords[0],coords[1]], {        balloonContent: pm_name      }, {        preset: "islands#dotCircleIcon",        // Задаем цвет метки (в формате RGB).        iconColor: color      }));      myMap.balloon.close();})

 

https://jsfiddle.net/z7y7gner/

 

и да, вот код для наглядности.

я уже попытался сделать переменные в элемента массива, и это не помогает.

 

Ссылка ведёт на код с ObjectManager, это то что вы хотели показать?

прошу прощения, поправил.

 

В вашем примере вы при каждом клике подписываетесь на события сабмита формы, наверно вы потеряли закрывающую скобку. Чуть видоизменил ваш пример https://jsfiddle.net/j30qg1wx/

что самое примечательное - объяснить неверную работу самого скрипта яндекса конечно же никто не хочет. Класс, надеюсь этот клуб поскорее закроют.

 

Сергей Савинский
12 июля 2016, 13:17
Добрый день. Из замечатель ного и функционально полезного примера по ссылке http://dimik.github.io/ymaps/examples/regions/http://dimik.github.io/ymaps/examples/regions/ не совсем понятно, как скрыть всю карту, кроме карты регионов РФ. 

Какие скрипты используются для этой функциональности и как их задействовать?
Есть ли где-то документация или еще лучше пригодились бы контакты разработчиков.

С уважением, Сергей. 

<script src="./saved_resource(1)" type="text/javascript"></script>
<script src="./region-selector.js" type="text/javascript"></script>
<script src="./region-selector-model.js" type="text/javascript"></script>
<script src="./region-selector-list-view.js" type="text/javascript"></script>
<script src="./region-selector-opts-view.js" type="text/javascript"></script>
<script src="./region-selector-title-view.js" type="text/javascript"></script>
<script src="./region-selector-map-view.js" type="text/javascript"></script>
<script src="./region-selector-map-mask-view.js" type="text/javascript"></script>
<script src="./mask-overlay.js" type="text/javascript"></script>    <script src="./saved_resource(1)" type="text/javascript"></script>
    <script src="./region-selector.js" type="text/javascript"></script>
    <script src="./region-selector-model.js" type="text/javascript"></script>
    <script src="./region-selector-list-view.js" type="text/javascript"></script>
    <script src="./region-selector-opts-view.js" type="text/javascript"></script>
    <script src="./region-selector-title-view.js" type="text/javascript"></script>
    <script src="./region-selector-map-view.js" type="text/javascript"></script>
    <script src="./region-selector-map-mask-view.js" type="text/javascript"></script>
    <script src="./mask-overlay.js" type="text/javascript"></script>