Клуб API Карт

Не могу создать несколько карт на разных страницах сайта

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

  Карты добавляю на страницы таким кодом: 

<script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
<script type="text/javascript">

    var moscow_map,
    piter_map;

    ymaps.ready(function(){
         moscow_map = new ymaps.Map("map101", {
              center: [55.76, 37.64],
              zoom: 10
          });
          piter_map = new ymaps.Map("map0", {
               center: [59.938806, 30.314278],
               zoom: 9
           });
    });  
 
</script>

 

Извините за такой тупой вопрос, но я уже два дня бьюсь лбом о монитор.

Прочитал уже все руководства и вопросы, но так и не понял, в чем ошибка.

Всегда добавляется только первая карта, а вторая не грузится.

Сайт пока на localhost. На CMS JOOMLA.

Проблема как я думаю в ready.
Получается, что пока не загрузится первая карта, вторую тоже не видно.
Добавил на одну страницу две карты - то обе загрузились!
Как только первую удалю, то вторая не грузится.
Подскажите, пожалуйста, как правильно прописать независимую загрузку карт.

 

21 комментарий

дайте ссылку

Евгений Б.
28 января 2016, 02:03

Сайт пока на localhost. Работает на CMS JOOMLA.

Создал одну карту с 30 метками, с управлением - проблем не было.

Теперь два дня не могу просто добавить вторую карту

можете выложить ваш js-код, например, на jsfiddle.net

Евгений Б.
28 января 2016, 02:03

Проблема как я думаю в ready.

Получается, что пока не загрузится первая карта, вторую тоже не видно.

Добавил на одну страницу две карты - то обе загрузились!

Как только первую удалю, то вторая не грузится.

Подскажите, пожалуйста, как правильно прописать независимую загрузку карт.

у Вас видимо на странице нет одного из идентификаторов

map101 или map0

из-за этого происходит ошибка и карта не загружается.


В консоль броузера пробовали смотреть?

Евгений Б.
28 января 2016, 02:03

 

 Если я на страницу добавляю:

то карта загружается.

 

Если добавлю две карты:

то две загружаются.

 

 

Если пишу:

то просто пустой блок.

Идентификаторы все вроде на месте.

Я просто не знаю как в js правильно прописать ready() для каждой

карты в отдельности

на странице должно быть оба идентификатора

либо проверяйте их наличие перед созданием карты

Евгений Б.
28 января 2016, 02:03

Так мне нужно, чтобы на одной странице грузилась Карта map0

а на другой странице map101.

Получается, что вторая поочереди карта в  ymaps.ready(function(){

не грузится без первой. ( а первая грузится отдельно )

вставьте проверку

или выводите на каждой странице только ту карту, которая нужна,

не понимаю зачем нужно пытаться вывести 2, если нужна одна

Евгений Б.
28 января 2016, 02:03

Проблема в том, что вторая карта не загружается.:-(

ну у Вас же отсутствует ее контейнер

Евгений Б.
28 января 2016, 02:03

На одной странице сайта контейнер:

в нем карта нормально загружается.

На второй странице:

 

ПУСТОЙ контейнер - без карты

Еще раз говорю,

чтобы с тем кодом что Вы используете карта отрисовывалась нужно присутствие обоих контейнеров,

Если вы хотите только одну карту нарисовать, тогда нужно обернуть код создания обеих карт в проверки (if) присутствия соотв. контейнеров

 

можно простенький пример с проверкой if для двух карт?  т.к изобразить так и не получилось.

if($('#YMapsID1').get(0)) {

_создаем_карту_1_

}

if($('#YMapsID2').get(0)) {

_создаем_карту_2_

}

Бабуль - бэтмент помоги:-(.... че не так? уже в песочнице песок закончился....

Вот смотри, ты вываливаешь 2 экрана неотформатированного кода и спрашиваешь:

- "чё не так"

)))

Да кто ж его знает.

 

Не так тут то, как ты подошел к разработке.

Возьми мой пример использования сервиса регионы.

Я использовал ООП и паттерн MVC

В результате у меня получилось 5 View-классов отображающих  объекты на карте. 1 конроллер и одна модель.

и 5 строчек написано внутри ymaps.ready

А теперь представь я бы написал это все внутри одной функции, используя кучу глобальных переменных и замыканий.

Кто бы в этом разобрался и кто бы смог это поддерживать?

 

Так что мой тебе совет - структурируй логически свой код

Не надо мешать в кучу получение данных getJSON и их обработку.

Перенеси получение данных в класс модели, создание геообъектов в класс Отображения.

Используй отдельный класс-конроллер для того чтобы слушать модель и передавать данные в отображение.

Если ты потратишь 1 день на это, то съекономишь 3 дня а то и больше на то чтобы разобираться в такой путанице.

спасибо за совет, попробую. убрал я свой говнокод,  а то действительно экрана не хватает :-)

все вас прекрасно поняли, не нужно выделять жирным и капсить.
Происходит это потому, что сначала идет инициализация карты в 1-ом контейнере и она проходит нормально, а на другой странице карта не может найти этот самый 1-й контейнер и выбрасывает ошибку, из-за которой прекращается дальшее исполнение кода, не доходя до инициализации «второй» карты. 

Теперь понятно зачем нужна проверка?

или выводите на каждой странице только ту карту, которая нужна,
не понимаю зачем нужно пытаться вывести 2, если нужна одна

+1
Евгений Б.
28 января 2016, 02:03

Спасибо большое за помощь!

Все заработало, просто подключил на каждой странице свой файл js и всё ОК.

Раньше файл js подключался в index.php на все страницы сразу.

Извините за жирные капсы - долго тупил из-за этого.

Всем удачи в создании карт! Яндекс рулит!

 

 

 

 

 

 

 

 

Александр Л
24 октября 2023, 09:38
Я просто переключила в самом конструкторе с javaScript на iframe, скопировала именно код <iframe> и всё, на странице сайта Вордпресс встали три разных интерактивных карты со своими адресами офисов. До этого тоже вставали три одинаковых адреса.