2

Динамически строю карту и вывожу на ней пункты.
1) Отправляю ajax'ом запрос
2) В ответ получаю xml со списком пунктов
3) Парсю этот xml и перебираю список пунктов, чтобы вывести каждый на карте.

Сам код здесь

Но как при этом центрировать карту на выбранном пункте?
При выборе пункта я могу получить его value (pointCode, скажем LPC1).
API куда отправляю не дает инфу только по одному пункту.

P.S. у меня данные по точкам внутри итератора. А нужно, грубо говоря, получить нужный пункт (PVZ) из всего ответа xml по value выбранного пункта из селекта :)
т.е. у меня есть выбранный пункт из селекта - LPC1 и в ответе есть пункт в котором Code="LPC1", вот мне нужно получить координаты как раз этого пункта

$('#cdek_point_id').change(function() {
var pointCode = $(this).val();
$.ajax({
    type: "GET",
    url: 'https://integration.cdek.ru/pvzlist.php',
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    data : { cityid : 320},
    dataType: "xml",
    success: function(result) {
      var points = result.getElementsByTagName("Pvz");
      // в result находится сам xml
      console.log(result);
      // в points находится объект со списками пунктов 
      console.log(points);

      ymaps.ready(init);

      function init() {

        var myMap = new ymaps.Map("YMapsID", {
              // Нужно здесь указать координаты выбранного пункта.
              // например, как-то сравнить pointCode с полученным результатом и вывести только 
              // координаты из массива где Code == pointCode
              // (Code - это атрибут в ответе xml)
              center: [52.608782, 39.599346], 
              zoom: 10
          }, {
              searchControlProvider: 'yandex#search'
          });


        for (i=0;i<points.length;i+=1) {
          // Здесь я уже перебираю пункты и вывожу на карту
          var address = result.getElementsByTagName("Pvz")[i].getAttribute('FullAddress');
          var phone = result.getElementsByTagName("Pvz")[i].getAttribute('Phone');
          var workTime = result.getElementsByTagName("Pvz")[i].getAttribute('WorkTime');
          var info = address + '<br><b>Тел.:</b> ' + phone + '<br><b>Время.:</b> ' + workTime;

          var site = result.getElementsByTagName("Pvz")[i].getAttribute('Site');

          var lat = parseFloat(result.getElementsByTagName("Pvz")[i].getAttribute('coordY'));
          var lon = parseFloat(result.getElementsByTagName("Pvz")[i].getAttribute('coordX'));

          // Создаем геообъект с типом геометрии "Точка".
          var myGeoObject = new ymaps.GeoObject({
            // Описание геометрии.
            geometry: {
                type: "Point",
                coordinates: [lat, lon]
            },
            // Свойства.
            properties: {
                balloonContent: info,
                hintContent: info
            }
          }, {
            // Опции.
            preset: 'islands#blueIcon'
          });

          myMap.geoObjects.add(myGeoObject);
        }
      }
    }
  });
});
2
  • 1
    А при чём тут тег JAVA ? > Java (не путать с JavaScript) — строго типизированный объектно-ориентированный язык программирования.
    – Arsen
    15 дек 2017 в 9:31
  • 1
    прошу прощения, не дописал) тэг ошибочно поставил. Видимо на ввел java и на автомате Enter нажал
    – evans
    15 дек 2017 в 9:36

2 ответа 2

5

У Карты есть метод setCenter(), который позволяет изменить центр карты на нужную точку.

В песочнице есть пример, изменения центра карты при выборе пункта из выпадающего списка.

2
  • Я понимаю, просто у меня данные по точкам внутри итератора. А нужно, грубо говоря, получить нужный пункт (PVZ) из всего ответа xml по value выбранного пункта из селекта :) как-то так
    – evans
    15 дек 2017 в 9:44
  • т.е. у меня есть выбранный пункт из селекта - LPC1 и в ответе есть пункт в котором Code="LPC1", вот мне нужно получить координаты как раз этого пункта.
    – evans
    15 дек 2017 в 9:48
3

Ваш источник данных возвращает элементы в которых есть идентификатор элемента в атрибуте Code и координаты в атрибутах coordX и coordY. Таким образом можно получить координаты для выбранного элемента списка:

      // Тут получаем координату выбранного элемента
      var point = result.querySelector('[Code=' + pointCode + ']');
      var lat = parseFloat(point.getAttribute('coordY'));
      var lon = parseFloat(point.getAttribute('coordX'));
      var centerPoint = [lat, lon];

Далее используя метод setCenter у карты можно указать центр используя эти координаты.

Вот пример рабочего кода: https://jsfiddle.net/zw5Lsjtq/1/

1
  • Понял, спасибо. Только строится новая карта, не подскажите, как формировать точку на одной карте
    – evans
    18 дек 2017 в 13:59

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.