В данном примере все работает хорошо, но строится новая карта.
Нужно чтобы пункты выводились на одной карте, а не создавалась новая.
Вот пример кода (работает быстрее чем здесь)
Если выношу создание карты за пределы ajax, то карта не создается вовсе.
Как-то так
Может это потому что строится карта динамически и нужно обрабатывать через on(change), но и так не выходит
$(document).ready(function () {
$('#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) {
console.log('LAM', result);
var points = result.getElementsByTagName("Pvz");
// в result находится сам xml
console.log(result);
// в points находится объект со списками пунктов
console.log(points);
// Тут получаем координату выбранного элемента
var point = result.querySelector('[Code=' + pointCode + ']');
var lat = parseFloat(point.getAttribute('coordY'));
var lon = parseFloat(point.getAttribute('coordX'));
var centerPoint = [lat, lon];
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map("YMapsID", {
// Нужно здесь указать координаты выбранного пункта.
// например, как-то сравнить pointCode с полученным результатом и вывести только
// координаты из массива где Code == pointCode
center: centerPoint,
zoom: 16
}, {
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);
}
}
}
});
});
});
html, body, #YMapsID {
height: 100%;
}
body {
margin: 0;
}
#YMapsID {
width: 100%;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<select id="cdek_point_id" >
<option value="0">- выберите пункт -</option>
<option value="LPC1">Россия, Липецкая обл., Липецк, пл. Петра Великого, 5, 05</option>
<option value="LPC2">Россия, Липецкая обл., Липецк, пр-т Победы, 128</option>
</select>
<br><br>
<div id="YMapsID"></div>
Выделю скелет из вашего кода:
$(document).ready(function () {
$('#cdek_point_id').change(function() {
// ..
$.ajax({
// ...
success: function(result) {
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map("YMapsID", {
// ...
myMap.geoObjects.add(myGeoObject);
// ...
Теперь как сделать чтобы работало:
$(document).ready(function () {
ymaps.ready(init);
function init() {
// создаем карту одну на
var myMap = new ymaps.Map("YMapsID", {
// ...
// цепляем обработчик на select
$('#cdek_point_id').change(function() {
// ..
$.ajax({
// ...
success: function(result) {
// ...
myMap.geoObjects.add(myGeoObject);
// ...
Вообще неплохо еще бы сделать "кеширование" адресов или создать объекты заранее, а потом показывать на карте нужный и скрывать ненужные, не обращаясь постоянно за координатами.
Обновлено Более пристально посмотрел на ваш код и понял что вам вообще не нужно делать AJAX-запрос при каждом изменении селекта. Вы ведь каждый раз возвращаете сразу весь список и потом берете нужный элемент. Поэтому нужно вначале вместе с инициализацией карты (или до) запросить список, а потом уже показывать нужные точки при переключении.
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Есть функция, которая выводит дату через определенное кол-во дней:
Друзья, всем привет! как сделать вот такую бегущую строку при скролле? То есть, строка должна полностью прокрутиться до конца сайтаСмотреть...
Сделал сайт (hizhinafloristaru), решил протестировать