Яндекс карты — возможности, народная карта, использование API-конструктора и вставка Yandex Maps на


Содержание материала:

Начинаем изучать API Яндекс.Карт 2.1.

29 апреля 2014 года было объявлено, что новая версия API Яндекс.Карт 2.1 выходит из статуса беты и теперь Вы можете на неё безопасно переходить.

В нескольких ближайших заметках я планирую познакомить Вас с данной версией API.

Основные отличительные особенности JavaScript API Яндекс.Карт версии 2.1:

— новый адаптивный дизайн интерфейсов карты;

— мультимаршрутизатор — возможность построения всех возможных маршрутов вместо одного;

— модульная система API. Список всех модулей API приведен в справочнике.

— новый способ отображения объектов на карте, который позволяет создавать больше меток, чем в версии 2.0.

Подробную документацию по новой версии API Яндекс.Карт 2.1 можно прочитать здесь.

Давайте рассмотрим простейший пример создания карты с использованием API Яндекс.Карт 2.1.

Простейший пример создания карты с использованием API Яндекс.Карт 2.1.

Подробная инструкция по добавлению Яндекс.Карты на свой сайт

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

Сервисов, бесплатно предоставляющих карты, множество, но я бы хотел остановиться сегодня на Яндекс.Картах. Не буду рассматривать вариант создания карт через простой конструктор, а поскольку мы с вами в какой то степени веб-мастера, расскажу, как внедрить карту от Яндекс.Карт с помощью API.

Добавление Яндекс.Карты на свой сайт

1. Итак, первое, что вам необходимо сделать – это перед закрывающим тегом вашего сайта подключить сам API Яндекс.Карт:

Обратите внимание, что API_KEY в ссылке нужно заменить на свой, иначе карта будет серая (новые правила Яндекса). Получить его можете здесь. На момент написания статьи — получение бесплатное.

2. В нужное место на вашем сайте вставьте код, где будет отображаться карта:

3. В файл стилей (в самый конец) вставьте:

.ya_map – это стиль текста, который будет отображаться у подписи на карте, а
#map – размер карты.

4. И под конец одним из самых важных шагов будет добавление перед закрывающим тегом

Как добавить Яндекс Карты на сайт

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

Кому это надо?

Вопрос, зачем это надо, подробнее рассматривать не буду. Это элементарно — установка яндекс карты на сайт, нужна просто для того, чтобы ваши оффлайн клиенты, вас нашли. Всегда удобнее найти магазин или офис по карте. Возможно, есть и другие применения для этого сервиса, в этом случае, свои мысли вы можете высказать в комментариях, где я с удовольствием с вами пообщаюсь!

Ну а теперь идем дальше. На очень многих сайтах визитках, можно увидеть контакты, адрес, а также, другие сведения, например, часы работы. Все эти данные, ориентированы для привлечения клиентов в свой офис. К сожалению, далеко не всегда, имеется карта, как доехать. А жаль. Карту на сайт можно поставить легко и быстро. А клиентам компании, это поможет сэкономить кучу времени. И нужна карта для очень многих сайтов: крупным компаниям, мелким магазинам, различным мастерским. Список можно продолжать до бесконечности.

Как вставить Яндекс Карту на сайт.

Одним из крупнейших картографических сервисов в рунете, является – Яндекс Карты. Есть еще и другой, от компании Гугл. Но сегодня, будет разговор именно про Яндекс Карты.

Для установки Яндекс Карты, нужно получить код, а затем, полученный код, вставить в нужное место на сайте. И не важно, на какой платформе ваш сайт. Данная инструкция подойдет и для сайтов на html, и для wordpress и для любых других движков. Достаточно того, чтобы он поддерживал вставку скриптов, что на сегодняшний день, предоставляет практически любой платный хостинг (да и большинство бесплатных).

Для установки, вначале нужно перейти по ссылке — yandex.ru/map-constructor/

Кликните на Создать карту, затем, выберите имя карты, сохранить и продолжить.

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

Конструктор карт выдаст код карты, который останется просто добавить на свой сайт.

Полученный код карты, нужно вставить на ваш сайт. Если это просто сайт на HTML, то просто вставьте его в нужное место.

Или же, если к примеру, у вас сайт на популярной CMS WordPress, то вы можете установить его в код либо самой статьи и для этого, вам совсем не нужен какой либо плагин, но вставку нужно делать, в режиме «Текст»

либо, можно вставить в виджет.

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

Как вставить карту Яндекс, Google или карту метро на сайт?

Привет, друзьям блога nazyrov.ru!

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

Я расскажу, как вставить обычную графическую карту, или карту проезда, можно назвать как угодно. Такую карту можно позаимствовать с Яндекс карты или Google maps. Зачем же ее нужно ставить на сайт, спросите вы. Это интересное дополнение сайта и улучшение удобства пользования. На тревел блогах, благодаря таким картам, можно указывать маршрут и отмечать какие-то интересные места. Для сайтов визиток, это указание как до них добраться. Идей применения такой карты предостаточно, стоит только включить фантазию.

Вставить Яндекс карты на сайт

Вставить Яндекс карту на свой сайт можно несколькими способами:

  • Использование возможностей конструктора;
  • При помощи плагинов и модулей;
  • API от Яндекс;

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

Если ваш сайт создан при помощи какого-то конструктора, вроде uCoz или WIX. Проверьте, поддерживает ли конструктор эту возможность. На многих конструкторах эта идея продумана и порой достаточно вставить виджет в необходимое место, и можно любоваться картой от Яндекс на сайте.

Карта при помощи плагинов и модулей.

Для большинства CMS разработаны различные плагины и модули. Если у вас сайт на WordPress и вы не умеете или не любите возиться с кодами, вставить Яндекс карту на сайт можно при помощи плагина Oi Yandex.Maps for WordPress .

Установка и настройка плагина стандартная. После того, как вы активируете плагин, в визуальном редакторе появится кнопка «Яндекс карта», нажав на которую вы сможете вписать населенный путь, и плагин при помощи шорткода выведет карту. Эта карта ничем не будет отличаться от той, к которой вы привыкли, просматривая пробки в Яндекс. Карту можно передвигать, менять масштаб, переключаться на вид со спутника и прочие фишки, которые есть в стандартных Яндекс картах.

Выглядит такая карта вот так:

Благодаря плагину, на карте можно сделать отметку любого адреса, вставить всплывающий текст (описание местоположения – «кабак у дяди Васи»).

Плагин Oi Yandex.Maps for WordPress очень легок и прост, но не без минусов. Если вам необходимо указать какой-то мелкий, никому не известный населенный пункт, придется сначала узнать его координаты, иначе Он может быть просто не найден, или найден «тезка» вашего городишки. Но в целом оценка 5 баллов!

Нашел еще несколько аналогичных плагинов, принцип работы схож, поэтому смысла не вижу их описывать.

API от Яндекс.

Третий способ вставить Яндекс карту на сайт, это использование API (Интерфейс Программирования приложений) от Яндекс. Не пугайтесь умных словечек, вам не нужно быть программистом, чтобы добавить Яндекс карту на сайт при помощи API. Делается это в два счета.

Просто переходим по ссылке — [aspan] https://tech.yandex.ru/maps/tools/constructor [/aspan] . На этой странице можно сконструировать карту Яндекса любого размера, при этом проложив маршрут и сделав пометку об объекте. Затем нужно скопировать предоставленный код и вставить на свой сайт.

Процесс конструирования Яндекс карты опишу чуть ниже. Да и на странице конструктора карт тоже имеются все необходимые подсказки.

Результат будет примерно такой:

Как вставить карту гугл на сайт

Не знаю, пользуетесь ли вы картами от гугл. Лично я ими перестал пользоваться после одного не совсем приятного случая, который произошел со мной около полугода назад.

Поехали мы с ребятами в Москву по делам на своей машине, и чтобы не заблудиться, скачали навигатор (уже не помню какой) на планшет. Навигатор использовал технологии Google Maps, предупреждал о камерах на дороге и прочие навороты. Как оказалось, Москва строится семимильными шагами, и в гугл картах это не учитывалось. Карты просто устарели, в одном месте построили новую развязку, в другом идет стройка новой высотки и переулок перекрыли, отправляя машины в объезд.

Результат работы навигатора нас не порадовал. Дали мы километров 12 круга по утренней Москве, а могли просто свернуть в небольшой переулок, который появился недавно. Бывало едешь в каком-нибудь тоннеле, навигатор говорит: «Поверните направо», а поворачивать некуда, справа стена ��

Но у гугл карт есть и большие плюсы. В отличие от Яндекса, который ориентирован в основном на Россию и ближнее зарубежье, Google Maps может показать самые отдаленные уголки нашей планеты.

Вставить карту от гугл (Google Maps) на сайт можно так же как в предыдущем способе.

  • С использованием виджета конструктора, если таковой поддерживает ваш конструктор сайта;
  • При помощи плагина;
  • С использованием API;

Использование виджета конструктора для вставки гугл карты (Google Maps) на сайт.

Я не любитель конструкторов. Поддерживает ли ваш конструктор эту технологию, можно узнать у тех поддержки. На uCoz такой виджет присутствует, это знаю точно.

Вставка карты Гугл на сайт WordPress при помощи плагина.

Вывести карту от гугл (Google Maps) на сайт WordPress можно при помощи плагина MapPress Easy Google Maps. После установки и активации плагина, на экране добавления новой статьи, появиться раздел «MapPress».

Для создания новой карты, нужно кликнуть по кнопке «New Map».

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

Вот пример, как будет выглядеть карта от гугл, выводимая плагином MapPress Easy Google Maps:

Добавление карты Гугл на сайт при помощи Google Maps.

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

Выглядеть такая карта будет вот так:

Как установить карту проезда на сайт?

Для реализации этой цели, больше всего мне понравился конструктор Яндекс Карты. Как я уже упомянул выше, на странице конструктора есть инструкция по созданию и добавлению карты проезда на сайт. Но все же давайте вкратце опишу сам процесс.

Топ-пост этого месяца:  Как сделать покупку в 1 клик для вариативных товаров

Страница конструктора карт от Яндекс доступна по ссылке — https://tech.yandex.ru/maps/tools/constructor .

Для создания карты проезда, введите в поисковую строку название населенного пункта. Конструктор сам найдет нужное место. Наша задача только немного отредактировать карту и задать схему проезда.

При необходимости сразу измените масштаб карты.

Теперь воспользуемся панелью инструментов. Можно отметить несколько точек (маркеров), изменить их цвет и задать описание.

При помощи инструмента «рисование линий», нужно нарисовать маршрут проезда к объекту.

Инструмент «Рисование многоугольников» позволит отметить какую-то область на карте.

При помощи инструмента «Изменение размеров карты» можно подогнать ее под размер вашей web страницы.

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

Как видите все очень просто.

Карта метро на сайт

Вставить карту метро на сайт можно двумя способами.

Первый способ вставить статичную карту метро на сайт — просто сделать скриншот, затем в фотошопе сделать необходимые пометки, если таковые имеются и вставить картинку на сайт.

Второй способ вставить интерактивную карту метро на сайт – вывести ее во фрейме с сервиса Яндекс Метро.

Буду признателен, если кто-то подскажет другой способ!

Яндекс карта для сайта: создаем и вставляем с помощью конструктора карт и API библиотек

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

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

  • Раздел контакты с полными данными компании;
  • Форма обратной связи на сайт в виде чата ;
  • Четкая структура сайта (особенно если это интернет магазин или каталог);
  • Красивый и удобный дизайн;
  • Адаптивная мобильная версия сайта ;
  • Простота и легкость кода.

Про это я уже не раз писал, включая про поведенческие факторы. Но сегодня нужно использовать уже готовые решения, которые предлагают поисковые системы, вроде поиска по сайту, конструкторов, виджетов погоды и т.д. Реализуется это с помощью API, которые имеют подробные инструкции по настройке и получения ключей доступа к библиотекам.

В нашем случае я покажу, как вставлять Яндекс карту для сайта с местом расположения компании клиента на свой сайт. Что привлекает в сервисе Яндекса, так это наличие широкого спектра инструментов, от создания простой точки до маршрута схемы проезда к офису или зданию.

Яндекс карта для сайта с помощью API

Помимо получения просто кода для вставки интерактивной схемы на страницы своего сайта вы также можете использовать для различных целей API сервисы. Давайте расскажу, что нам предлагает Yandex.

Что такое API?

API – это программный интерфейс предоставляющий библиотеки классов и функций которые мы можем использовать в виде стороннего приложения. Одним словом нам дают инструменты, которые мы уже немного подгоняем и настраиваем под себя.

Если мы перейдем в раздел Яндекса по адресу: https://tech.yandex.ru/maps/?from=bno, то нам предложат воспользоваться рядом продуктов для своих проектов, о которых поговорим далее.

  • Геокодер – это API элемент карт, который позволяет при нажатии на любой адрес и место на карте России с последующим получением gps данных этого места. Тем самым мы можем переводить географические координаты в точные адреса нужных нам мест.
  • Statiс API – это раздел позволяющий получить статическую схему, которая будет загружаться очень быстро даже если связь с интернетом будет очень низкая. Тут очень интересным является то, что вы берете просто кусок карты с нужным масштабом и указываете на ней автомобильные пробки или различные элементы, которые при каждом новом отображении на сайте будет автоматически обновлять актуальную информацию без дополнительных вмешательств в код. Имеется бесплатная и платная версия продукта.
  • JavaScript API – это библиотека позволяющая работа и создавать схемы на местности в браузерах, а также использовать в приложениях на Адройде при создании окон. Один самых интересных элементов является возможности вставки своих панорам на сайт, а также устроить поиск по организациям. В качестве панорамы можно вставлять любое изображение или использовать координаты карты для указания местности.
  • API бизнес – это программное расширение, которое помогает настроить возможность отслеживания по геолокации транспорта, а также вести диспетчеризацию транспорта компании и прочие виды. Есть платная и бесплатная версии. Также можно использовать запросы по местоположению координат нужного объекта.
  • Поиск по организациям – этот раздел подойдет для размещения как раз на своем проекте. Очень интересен если у вас каталог организаций и подобного рода проекты. Для поиска используется Яндекс.Справочник и для реализации поиска на сайте необходимо будет пополнять и обновлять базу организаций своими руками.
  • YMapsML – это раздел API Яндекса в котором мы можем любую планировку передавать посредством текстового документа. Не знаю, зачем это, но это предусмотрено в сервисе поисковика. Работает все на Javascript.

Это основные разделы, которые можно использовать при создании своих сайтов. Теперь давайте покажу самый последний инструмент, которым я всегда пользую на клиентских проектах. Недавно делал мебельный сайт и мне как раз нужно было вставить в раздел контакты блок с обратной связью и схемой проезда.

Конструктор карт яндекс для сайта

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

Лично я предпочитаю просто получить код и вставить его на сайт. Итак, давайте покажу, как это сделать очень быстро.

Первым шагом нам необходимо в том же разделе зайти в категорию «конструктор карт». Вы можете увидеть 2 раздела с похожим названием, но это одно и тоже. Выбираем тот, что справа внизу экрана.

После загрузки сервиса, нам необходимо придумать название схемы, которую мы будем создавать и нажимаем «создать новую».

Далее нам предстоит просто выбрать интересующий нас адрес. Я выберу офисное здание в г.Казани по адресу: г.Казань, ул. Татарстан, д.20. Вводим в строку поиска адрес, как показано на скриншоте.

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

Выбираем тип из списка:

  • Печатная схема – этот тип файл больше подойдет для последующей распечатки на рабочем компьютера и имеет более компактный вид. Я его не использую если честно.
  • Статическая – данный тип карты выходит в виде картинки формата .png. Разместить сможем ограниченное число объектов на местности.
  • Интерактивная карта – это самый оптимальный вариант вставки кода на свой сайт. На сайте в разделе «контакты» пользователь сможет просто работать со схемой на местности и менять масштаб на местности как ему удобно для разъяснения маршрута.

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

Прямоугольники – данный инструмент помогает выделить необходимую нам область. К примеру, вы хотите указать свой земельный участок или выделить границы проведения соревнований. Данный элемент очень помогает решить данную проблему с выделением и заливкой площадей карты.

Линии – данный раздел помогает нам нарисовать подробный маршрут движения и заезда на территорию или также использовать для выделения границ, но без заливки как в предыдущем инструменте.

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

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

После внесения всех изменений нам останется сохранить и выбрать ее тип. Выбираем интерактивную, чтобы изменения вносились Яндексом и без вашего участия. Настроили, поставили код и забыли.

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

Полученный код для сайта и вставляем в статью или модуль, но при отключенных редакторах, если используете CMS. Это обычный html код.

Вот так она будет выглядеть в качестве примера урока:

Ну, вот и все. Теперь вы научились создавать Яндекс карты для сайта и вставлять их на свой сайт. Если остались вопросы, то пишите их в комментариях. Не забываем подписаться на рассылку блога и сделать репост статьи. Всех благ -))).

Всякое разное про front-end

В данной статье я хочу начать цикл статей по работе с API Яндекс.Карт. Документация Яндекс.Карт достаточно полна, но степень разрозненности информации в ней высокая, при первом заходе в документацию без пол-литры не разобраться, и для решения какой-то проблемы можно потратить много времени на поиск по документации и в поисковике. Этот цикл статей будет рассказывать о практических решениях наиболее частых случаев использования API Яндекс.Карт последней, на момент написания статьи, версии 2.1.

При вёрстке сайта в контактной информации часто бывает необходимость вставки карты, на которой будет отмечено местоположение организации, для которой разрабатывается сайт. В самых простых случаях это может быть просто скриншот c онлайн-карт (или не онлайн):

Для вставки интерактивной карты может использоваться конструктор карт
https://tech.yandex.ru/maps/tools/constructor/:

В случае, если нам нужно более продвинутое использование карт (свои метки, программное перемещение карт и т.п.), то для этого надо использовать API Яндекс.Карт: https://tech.yandex.ru/maps/jsapi/. В качестве примера использования карт в статье будет рассмотрено создание карты с простым добавлением пользовательских метки и балуна.

Для начала подключим компоненты API:

Если разрабатывается какое-то большое приложение с использованием карт, то лучше подключать компоненты API определённой версии, чтобы при обновлении API на стороне Яндекса у нас ничего не сломалось на продакшине:

Карту необходимо будет расположить в каком-нибудь блоке, например в div#map. Далее карту необходимо создать в данном блоке (после срабатывания события готовности карты и DOM):

Здесь мы указываем:

  1. идентификатор блока «map», где у нас будет создана карта;
  2. center — центр карты с указанием ширины и долготы;
  3. zoom — коэффициент масштаба карты.

По умолчанию Яндекс.Карты создают много лишних элементов, которые в большинстве случаев не нужны на сайтах. В основном к элементам управления и к поведению карты достаточно применить 2 условия:

  1. из элементов карты присутствует только ползунок изменения масштаба;
  2. карта не должна менять масштаб скроллом мыши.

Для выполнения этих требований дополняем код:

Здесь мы отключили «scrollZoom» и добавили «zoomControl» с позиционированием от левого верхнего угла.

Теперь нужно добавить на карту метку, для статьи скачаём её картинку с http://medialoot.com/item/free-vector-map-location-pins/ и расположим в коде следующим образом:

Здесь мы объявляем переменную myPlacemark, в которой запишем маркер, в первом параметре ymaps.Placemark указываем координаты метки, а в третьем параметре:

  1. указываем в iconLayout, что будет использоваться пользовательское изображение метки;
  2. iconImageHref — путь к изображению;
  3. iconImageSize — указываем размеры изображения;
  4. iconImageOffset — указываем сдвиг от левого верхнего угла картинке к точке изображения, которая показываем на нужный нам объет. Нужно это чтобы при масштабировании карты положение метки не сбивалось. Почему смещение указывается в отрицательных значениях — одному Богу создателю API известно.

И через myMap.geoObjects.add() добавляем метку на карту.

А теперь сделаем баллун, который у нас будет показываться при клике на метку карты, макет баллуна и его содержимое возьмём с http://designdeck.co.uk/a/1241

Здесь мы:

  1. в balloonContent указываем контент, который будет отображаться при открытии балуна;
  2. balloonLayout — указываем, что в качестве макета баллуна будет использоваться пользовательское изображение;
  3. balloonContentSize и balloonImageSize — размеры контента и изображения соответственно;
  4. balloonImageHref — путь к изображению;
  5. balloonImageOffset — смещение относительно левого верхнего угла;
  6. balloonShadow — отключение тени у балуна (с пользовательскими изображениями ни на что не влияет).

Вставляем интерактивную Яндекс карту на свой сайт

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

Особое внимание уделю объяснению об установке карт не только на html-сайты, а и на сервисы, реализованные на таких движках, как WordPress и Joomla 3. Вперед…

Yandex maps – это действительно хороший сервис, который выручает своих пользователей при поиске в населенном пункте определенных мест: парков, офисов, учебных заведений, достопримечательностей и т.д.


API, представляемый самой компанией

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

Топ-пост этого месяца:  Статус онлайн в Инстаграме - где посмотреть и как скрыть сетевой статус

Если вы всерьез решили дополнить свой сайт картографической информацией (что является правильным решением), то для начала ознакомьтесь с разделом «Помощь» по ссылке https://yandex.ru/support/maps/ . В нем подробно расписаны все возможности Yandex.Maps.

Перейдя по этой ссылке , вы сможете ознакомится с полным пакетом программного интерфейса, благодаря которому появляется возможность установить весь необходимый инструментарий для вставки Яндекс.Карты на ваш веб-сервис.

  • JavaScript API;
  • Static API;
  • Платный API;
  • API Поиска по организациям;
  • Геокодер;
  • Конструктор карт;
  • API Конструктора;
  • YMapsML.

От теории к практике

Для начала поговорим о вставке картографической информации на сайты, написанные на выше перечисленных CMS. Проверьте, поддерживает ли ваша версия движка такую возможность. Так как на большинстве CMS такая технология продумана и позволяет разработчикам разместить нужную информацию, вставив только виджет.

Также для реализации обсуждаемого действия существует множество плагинов и дополнительных подключаемых модулей, которые не требуют особых знаний кода. К примеру, для WordPress можно использовать плагин Oi Yandex.Maps for WordPress, а для Joomla – модуль BT Google Maps.

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

  1. Для вставки карты на веб-страницу ее сначала нужно создать. Поэтому переходите в конструктор Яндекса по адресу: https://tech.yandex.ru/maps/tools/constructor/ . Перед вами откроется модульное окно с предложением создать или открыть карту, если вы не зашли на свой аккаунт или не зарегистрировались, или откроется сама местность.

Данный программный код можно внедрить в любую программу: как в сайт, написанный вами, так и на перечисленных движках. Однако есть одна особенность. Вставку стоит производить не в визуальном, а в html-редакторе.

На этой ноте я прощаюсь с вами. Очень надеюсь, что моя публикация помогла вам. Буду ждать вас в группе подписчиков моего блога. Не забывайте делиться ссылками на статьи с друзьями. Пока-пока!

Конструктор карт от Яндекс – как вставить интерактивную карту на сайт?

Приветствую вас, друзья и коллеги. Недавно я рассказывал про банковские карты Яндекс Денег (хорошая штука), сегодня речь снова пойдет о сервисе от Яндекса и снова про карты, только не про пластиковые и не про игральные, а про карты местности.

Возможность помочь клиентам добраться в нужное место – это весомый вклад в развитие бизнеса, чем больше людей дойдет куда надо, тем выше будут доходы и прибыль. Так что, если ваш бизнес как-то привязан к объектам на местности, то вставить хорошую карту на сайт надо обязательно.

Зачем нужна интерактивная карта

  1. Удобно для клиента – легко планируется маршрут с учетом всех актуальных изменений, так как Яндекс оперативно вносит данные о ремонтах и новых застройках на свои карты.
  2. Удобно владельцу сайта – все корректировки вносятся на карту автоматически, достаточно один раз вставить карту на сайт, потом обновления подгружаются из базы Яндекса сами.
  3. Поднимает авторитет и уровень доверия к организации. Хотя такую примочку может сделать любая шараж-монтаж контора, на подсознательном уровне сайт с интерактивной картой воспринимается лучше.

В былые времена адреса офисов, маршруты прохода и проезда, различные интересные объекты и т.д. отмечали на картинках, изображающих карту, и выкладывали на сайт обычным jpg или png файлом. Проблема была в том, что они не могли учесть временные ремонты, пробки или другие изменения местности, не имели возможности подсказать индивидуальных маршрут с разных направлений.

С развитием интернет сервисов, таких как Яндекс Карты и Google Maps, появилась возможность сделать карты живыми – интерактивными. Такие можно вертеть в разные стороны, менять масштаб, маршруты с разных точек задавать, планировать свое перемещение с учетом пробок и многое другое.

Наличие удобной схемы проезда на странице контактов в наше время является правилом хорошего тона для любой компании.

И для того, чтобы помочь вам сделать свой веб ресурс более приветливым к людям я расскажу, как добавить Яндекс карту на сайт, делается это очень легко с помощью специального конструктора (не сложнее чем вставка видео с Youtube).

Конструктор карт Яндекс

Если у вас нет аккаунта в Яндексе, то надо будет его завести, так как без этого сконструировать ничего не получится, сервис попросит вас залогиниться или пройти регистрацию. Пугаться не нужно, регистрация – это создание почтового ящика на Yandex. Даже если он вам не нужен для работы с электронной почтой, пригодится для других сервисов поисковика, например, для Яндекс Метрики или Яндекс Вебмастер.

Начинается процедура с этой странички – tech.yandex.ru/maps/tools/constructor/

Так как вы читаете эту статью, значит, вы входите первый раз и сохраненных ранее карт у вас нет, остается выбрать левую желтую кнопку “Создать новую карту”. С этого момента начинается формирование индивидуальных настроек карты на нужной местности.

Фишка в том, что вы сможете вставить не просто Яндекс карту с точным адресом, а карту с любым количеством объектов выделенных разными маркерами и цветами – объектами, точками, маршрутами.

Все настройки производятся в визуальном конструкторе, никакие коды править не придется, работа по адаптации мало отличается от обычного использования Яндекс карт пользователем. Начнем с добавления объектов.

Добавление объектов

Первым инструментом послужит форма поиска, которая находится в верхней части карты. С ее помощью мы можем отыскать нужную точку по адресу, координатам или названию. Вводим в поле данные запроса, пример с адресом «Москва, Красная площадь»:

После нажатия на кнопку найти на местности появится точка, соответствующая расположению заданного объекта. Вставить можно много объектов. Пример с Кремлем:

Каждую точку можно настроить так, чтобы она отличалась от других объектов и была на карте легко различима – меняется цвет и форма, а также, внутри можно добавить уникальный значок, если ткнуть в выпадающее меню «Контент». Это удобно, если объектов на создаваемой карте много и их можно классифицировать по разным группам.

Слева наполняется список всех отмеченных на карте адресов.

Изменение масштаба и положения

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

Для перемещения карты в разные стороны нужно захватить ее нажатием левой кнопки мыши и двигать куда нужно.

Контуры объектов (многоугольники) и линии

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

Точек может быть сколько угодно, поэтому, фигура, закрашенная на карте, допускает любую степень сложности. Завершить построение контура можно кликом мыши по последней установленной точке или переключением на любую другую кнопку конструктора (например, на линии). Я выделил контуры Московского Кремля по его стене:

Начертание линий осуществляется кнопкой «Линии». Все действия аналогичны предыдущему инструменту, только пространство между точками не закрашивается. С помощью линий на Яндекс карте можно рисовать маршруты движения (прохода, проезда).

Таким способом можно показать оптимальный маршрут осмотра достопримечательностей.

Конечную точку подтверждаем повторным ее нажатием мышью, там будет меню «Удалить»/«Завершить». После выбора завершения открывается поле для подписи к конечной точке и настройки параметров линии (толщина, цвет, прозрачность).

Завершаем маршрут нажатием на «Готово».

Вид карты и наложение пробок

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

А вот переключение режимов между схемой, спутником и гибридом может пригодиться.

Вид со спутника придает окружающим объектам их реальный облик и узнать их на такой карте проще, чем схематичные прямоугольники схемы.

Название и описание

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

Код карты для вставки на сайт

Наша карта уже готова и теперь надо получить ее код для вставки на сайт, Яндекс дает возможность сделать:

  • интерактивную карту (о которой я говорил с самого начала);
  • статическую – обычная картинка, только с мудреным кодом, ничего двигать в ней нельзя, в добавок еще и максимальное число объектов ограничено;
  • печатную – файл-изображение высокого качества, поддерживаются не все страны, в основном СНГ и Турция, не поддерживаются спутниковая и гибридная версия.

Выбор между ними будет выведен сразу после сохранения.

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

На этом этапе есть возможность вернуться к редактированию карты, в левой верхней части окна есть соответствующая надпись со стрелкой.

Итоговый код появляется после нажатия на кнопку «Получить код карты», мой выглядит вот так:

При выборе печатной карты добавится выбор формата файла – png или jpg, и кода, соответственно, не будет – кнопка скачивания вместо него появится. Такой файл тоже можно вставить на сайт, только надо будет закачивать его на хостинг и, при отсутствии визуального редактора у вашего сайта, надо будет выписать изображение в HTML теги (src)

Как вставить карту Яндекс на сайт

Код мы получили, теперь необходимо перенести его на наш веб ресурс. Для размещения подойдет любое место, главное, чтобы размеры вписывались. Если вы пользуетесь конструкторами или визуальными редакторами, то не забудьте при вставке кода переключить их в текстовых (HTML) режим. Вот так:

Карта, которую я сделал

Вот что получилось у меня после всех проведенных настроек:

Удобен сей элемент всем – и объекты нужные подсвечены и масштаб подобран как положено. Кроме того, сервис Яндекса позволяет пользователю определить свое местоположение (стрелочка в верхнем левом углу) и проложить индивидуальный маршрут в нужную точку.

Раскрыть карту на весь экран позволяет кнопка в правом верхнем углу в виде двух расходящихся в разные стороны стрелок. Теперь про плагины.

Плагины для WordPress и других CMS

Раньше делать карты было сложнее и многие пользовались для этих целей специальными плагинами, например, для WordPress был такой – Yandex Maps for WordPress. Сейчас не нужны никакие API и любой пользователь с минимальными знаниями разберется как все настроить, поэтому смысла в плагинах я не вижу. Названный выше плагин тому подтверждение – не обновляется более 2-х лет, видимо спроса нет.

Из относительно актуальных я нашел Yandex Maps API (обновлен 4 месяца назад) и Oi Yandex.Maps for WordPress (5 месяцев назад). Если у вас есть желание поиграть в плагины, то их найдете в репозитории Вордпресс поиском, а как устанавливать плагины смотрите тут.

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

Создание карты со своим изображением метки через API Яндекса

Рассмотрим, как добавить метку на картах яндекса, при этом в качестве метки мы будем выводить своё изображение. Данный скрипт построен на API 2.1 Яндекс Карт.

Создаём свою метку

Подключаем скрипт API Яндекс Карт 2.1 и выводим наш скрипт.

Добавление нескольких меток

Тут все почти аналогично, рассмотрите на примере:

Тут всё просто, пример работает на ура. Если есть вопросы, задавайте.

Широту и долготу можно посмотреть на официальном сайте Яндекса, перейти .

Яндекс карты — возможности, народная карта, использование API-конструктора и вставка Yandex Maps на свой сайт

Каждый владелец сайта сегодня может вставить на свой ресурс карту Яндекса с помощью программного интерфейса API Яндекс.Карты. Но иногда этого оказывается недостаточно, чтобы быстро и легко реализовать интересные задумки (без переработки кода) вебмастера прибегают к специальным модулям и расширениям. Рассмотрим особенности каждого из способов.

Конструктор карт Яндекса

На страничке https://yandex.ru/map-constructor предлагается с помощью специального сервиса компании создать собственную карту с метками на нужных объектах, со схемами проезда и выделенными областями. После создания карту можно вставить на сайт с помощью сгенерированного сервисом кода. Подробная инструкция по использованию сервиса представлена в разделе «Помощь» ( https://yandex.ru/support/maps-builder/concept ). Официальная документация и условия использования данного веб-ресурса опубликованы в разделе «Технологии Яндекса» (https://tech.yandex.ru/maps/constructor).

Топ-пост этого месяца:  PHP-МАСТЕР. От теории до собственной CMS интернет-магазина

Главные особенности

  • сервис доступен всем зарегистрированным пользователям, завести аккаунт в Яндексе для всех сервисов компании можно на странице https://passport.yandex.ru;
  • работает во всех версиях джумла (вставляется на сайт с помощью модуля «HTTP-код» или в материал путём добавления кода на страницу в соответствующем текстовом редакторе);
  • не адаптивный (размеры задаются при создании и прописываются в кодировке).

Возможности

Создаваемой карте можно дать название (сервис позволяет создать несколько карт) и описание. Объекты наносятся с помощью мыши, после нажатия на соответствующую кнопку: метки, линии, многоугольники. Линиям и многоугольникам может быть присвоено описание, задан цвет и толщина линий. А меткам — название, описание, а также может быть задан цвет метки, добавлена иконка внутрь метки. Карта может иметь привычный схематичный вид, либо отображать картинку со спутника. Возможен и третий вариант — гибрид (на спутниковое изображение нанесены названия улиц, дорог, номера домов).

При сохранении можно выбрать тип карты:

  • интерактивный, с которым можно взаимодействовать (например, перетаскивать объекты),
  • статичный или печатный для сохранения в виде рисунка.

Созданные объекты можно сохранить в файл спецформата для импорта в программы-навигаторы, для просмотра в других программах, таких, как, например, Google Earth.

Для вставки карты на сайт используется сгенерированный сервисом код (вставляется в любую из позиций с помощью модуля «HTML-код»).

Описание модулей для joomla

В последнее время популярность набирают разработки сторонних авторов. Рассмотрим функционал наиболее распространенных из них: конструктора кода, двух компонентов и модулей. Эти modules и components позволяют не только показать пользователю местонахождение компании, а поисковику определить региональную принадлежность, но и проложить маршрут, можно отобразить местонахождение пользователей и контактную информацию о них и даже развернуть целую баталию прямо на карте (за счет неё можно организовать взаимодействие участников рынка недвижимости, а точнее обеспечить отношения «Арендодатель-арендатор»).

Конструктор Яндекс карт XDSOFT

До сих пор на слуху и в приоритете был рекомендованный самой компанией Yandex «Конструктор Яндекс карт» (mod_xdsoft_ymaps): он позволяет отображать карту на сайте в её обычном виде, настраивать размер, масштаб, добавлять множество объектов в виде меток, полигонов. При этом количество создаваемых объектов не ограничено. С его помощью можно создать несколько карт на одной странице. Функционал конструктора впечатляет. Но главное его преимущество — он избавляет от необходимости подготовки кода в сервисе Яндекса (только для зарегистрированных) и последующей вставки кода на сайт joomla. Появившись в 2013 году плагин стал для вебмастеров первым и основным инструментом для вставки карт на веб-ресурсы.

Главные особенности

  • совместим с joomla 2.5-3.x;
  • распространяется бесплатно;
  • адаптивен (ширина может быть задана параметром auto)

Возможности и настройка

После установки с официального сайта разработчика xdan.ru (страница загрузки: https://xdan.ru/joomla/modul-konstruktor-yandeks-kart-dlya-joomla/skachat-modul-konstruktor-yanleks-kart-dlya-joomla/joomla-1-2-0-8), переходим в менеджер модулей и находим неопубликованный под названием «Конструктор Яндекс Карт от XDSoft».

Основные действия по настройке совершаем в первой же вкладке: задаем позицию для модуля, вводим адрес в поле под картой, задаем размеры, потянув за нижний правый край, масштаб с помощью привычного бегунка слева, ставим метку, рисуем объекты. Нет необходимости нажимать кнопку сохранить после каждого добавленного объекта, модуль автоматически сохраняет все изменения с помощью AJAX.

Проверяем настройки в других вкладках и сохраняем модуль.

Модуль от joomly

Из-за удобства использования (настраивается всего за 4 минуты) наиболее популярным является модуль «Яндекс.Карты» от joomly.ru.

Главные особенности

Настройка модуля производится быстро, благодаря тому, что модуль создан на русском языке, имеется русскоязычная инструкция (в том числе видео), на официальном сайте работает поддержка.

Кроме этого, модуль Яндекс карта для joomla:

  • работает на joomla 2.5-3.x;
  • базовый вариант распространяется бесплатно, есть и полная версия за 190 р. (разово, без абонентской платы);
  • является адаптивным («резиновая» верстка).

Возможности

Удобство использования и быстрота настройки – это ещё не всё. Для вебмастера не менее важны и возможности модуля. «Яндекс.Карты» от joomly можно скачать со страницы http://joomly.ru/yandex-karta и настроить следующим образом:

  • менять размер (установить ширину и высоту);
  • выбрать из нескольких типов карт наиболее понравившийся (спутник, гибрид, обычный вид карты);
  • выбрать иконку из предложенных типов (иконка, точка, круг);
  • в платной версии можно добавить информационные окна и метки на карту, определив их вид (задав кодировкой цвет).

Установка осуществляется обычным способом. После её завершения в менеджере модулей окажется неопубликованный элемент — Yandex maps. Активируем модуль, зададим масштаб (при настройке ширины auto карта «растянется» на весь экран). Выберем тип карты, тип метки, а в следующей вкладке определим точки координат (достаточно ввести адрес объекта) и опубликуем (можно в любой из позиций шаблона, можно внутри материала). С помощью сервиса на рекомендованном сайте (www.webpagefx.com) можно поменять цвет метки. Для вставки в материал, воспользуйтесь стандартной функцией CMS Joomla, в редакторе статьи.

Компонент от xdan.ru

Гораздо больше возможностей предоставляет компонент другого разработчика, который можно скачать с официального сайта xdan.ru. Идеально подходит для установки на информационные порталы на joomla (карта с многочисленными метками, например, карта памятников, сайты туристических фирм, каталоги магазинов и других предприятий).

Главные особенности:

  • реализуется в 3-х платных версиях с автообновлением – Lite (раньше распространялась бесплатно, теперь имеет чуть больше настроек и стоит 1 000 р., её можно использовать на одном сайте), Medium (также на одном сайте, но с техподдержкой, с дополнительным плагином определения местонахождения пользователей, стоимость – 2 000 р.), PRO (без ограничений по доменам, плюс поддержка К2, ZOO, плагин «Арендодатель-Арендатор», стоимость – 4 000 р.);
  • адаптивный (карта выводится на весь экран);
  • подходит для джумла последних версий, начиная с 2.5 (соответствует версия компонента 2.1.9, для поздних – вплоть до 4.0.13).

Возможности

Чтобы познакомиться с возможностями разработки нужно скачать любую из платных версий со страницы: https://xdan.ru/komponent-yandeks-karty-dlya-joomla.html#download. Расширение включает компонент, модуль, плагин, в платных версиях – дополнительные плагины и возможности. Возможен импорт и экспорт элементов. Расширение регулярно обновляется. На официальном сайте имеются подробные инструкции по применению (документация, видео уроки и скриншоты).

Назначение расширения (для информационных порталов и каталогов с картами) определили его большие возможности: добавление поиска, фильтров, списков объектов, объектов с метками (более 20 тысяч на карте без зависаний), обозначений в виде многоугольников, линий, окружностей, добавление собственных объектов. Добавлять точки на карту могут и сами пользователи (возможно с премодерацией).

Настройка

После установки пакета Lite находим «Яндекс карты» в компонентах.

  1. карту (неограниченное количество);
  2. категорию (для объединения карт по признаку);
  3. объект (в менеджере объектов создаются метки, изображения, геометрические фигуры и линии для определенной карты или целой категории карт).

В первую очередь в графическом редакторе находим ту местность, которую вы желаете отобразить на сайте, отметить метками. Например, вводим в строку поиска Петербург. И с помощью быстрых подсказок находим город. Далее заполняем поля: «Название», «Псевдоним» (введёте на русском, а система сама подготовит для публикации url латинские буквы). При желании можно заполнить и поле «Описание» (если собираетесь отображать его на сайте).

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

На вкладке «Метаданные» можно отобразить ключевые слова, описание для поисковиков. Во вкладке «Общие настройки» можно задать множество нюансов. Например, пользователю дать возможность кликом открывать всплывающее окно. Отключить или включить фильтр, отобразить его вверху или в любой из предложенных позиций.

Спустившись вниз с помощью бегунка, мы увидим «Список объектов». Если вы планируете создать несколько меток на карте, то стоит здесь в поле «Показать список объектов» выбрать позицию, например, сверху. Если объект будет только один, как в нашем случае — ЖК Элит плюс — то ставим здесь значение «Нет». Можно разрешить пользователям добавлять свои объекты, но раз мы создаём карты для сайта новостроек, то ставим здесь запрещающее «Нет».

Переходим к последней вкладке – «Настройки карты». Помимо окна карт и максимального масштаба можно выбрать тип карты. Вместо стандартной выберем «Гибрид». И не забудет сохранить все настройки — кнопка «Сохранить и закрыть» вверху. Одну карту мы создали, теперь можем перейти к созданию категории. Например, «Новостройки Петербурга». Для этого переходим в менеджер категорий (Компоненты-Яндекс карты в joomla), нажимаем «Создать». Вводим название и выбираем в соответствующем поле нашу карту «Новостройки Петербурга». Сохраняем и закрываем категории.

Теперь можно перейти к объектам.

Объекты мы находим также через компоненты joomla 3. Создаём и начинаем настраивать. Во второй вкладке «Вид объекта» можно выбрать его тип, например, установить как «метку». Во вкладке «Публикация» вводим ключевые слова. После всех настроек сохраняем и закрываем объект.

Чтобы отобразить карту на странице, её нужно создать. Например, в верхнем горизонтальном меню. Для этого переходим в «Менеджер меню». Находим горизонтальное и нажимаем, чтобы добавить новый пункт. Нажимаем «Создать».

Любую из созданных карт можно вставить на страницы сайта через модуль или в материал джумла. Например, отобразив карту со списком объектов на главной. Можно создать отдельный пункт меню для её отображения или для отображения нескольких карт, категорий.

Поработав с картами, категориями и объектами, можем зайти в настройки. Здесь вебмастеру открываются дополнительные возможности компонента Яндекс карт: можно редактировать описания, настраивать всплывающие окна, отображать списки категорий, карт, объектов. Можно отобразить на странице поле поиска сразу над списком объектов, установить ссылку «подробнее».

В расширенных версиях компонента доступны и другие настройки: карты местонахождения пользователей, карты материалов (в которых источник карты – материал джумла с «географической привязкой», т.е. адресом). В версию PRO встроены плагины вывода материалов ZOO и К2, плагин «Арендатор-Арендодатель» — для взаимодействия участников рынка недвижимости через удобную карту (владельцы добавляют предложения на карту, арендаторы бронируют через всплывающее окно).

Модуль от студии spb-webmaster.ru

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

Главные особенности:

  • распространяется бесплатно;
  • адаптивен (ширина может быть задана в процентах – карта растянется по ширине экрана);
  • подходит для всех версий начиная с joomla 2.5 и выше.

Настройки

После установки с официального сайта (страница для загрузки module: http://spb-webmaster.ru/mod/yandexmap), переходим в модуль и на первой же вкладке определим все настройки.

Что можно изменить:

  • установить координаты для центра карты;
  • изменить масштаб, чтобы изначально карта в joomla открывалась в удобном виде (объекты были достаточно приближены);
  • для пользователей можно по умолчанию оставить на карте показ пробок, кнопку выбора списка типов карты (кнопка «слои»), прокрутку масштаба с помощью мыши, оставить на карте или убрать поле поиска адреса;
  • прописать в пикселях ширину и высоту карты;
  • установить для показа объекта собственную иконку (выбрав изображение в медиа-менеджере), для остальных объектов можно выбрать флажки из списка стандартных;
  • добавить точку, введя координаты и описания (для оформления описания на карте можно использовать HTML-код).

Разработчик в скором времени обещает установить в админпанель модуля возможность загрузки карты любого типа (в виде схемы, спутника или гибрида).

Zh YandexMap

Расширение для установки Яндекс карт на сайт Zh Yandex Map от разработчика Dmitry Zhuk позволяет настроить оформление карты, назначить расположение объектов (добавив метки) и даже отобразить список меток. Среди дополнительных параметров – предоставление пользователям возможности ставить на карту свои метки.

Главные особенности:

  • распространяется бесплатно;
  • не адаптивен (ширина и высота задается в пикселях);
  • последняя версия работает на joomla 3.x.

Возможности

Расширение Яндекс карты для joomla включает компонент, модуль и плагин. Его можно скачать с официальной базы расширений для joomla, со страницы: https://extensions.joomla.org/extension/zh-yandexmap. С бесплатным модулем вы получаете техподдержку, последние обновления и официальную документацию. Админпанель удобная, русскоязычная. Однако инструкции по применению на официальном сайте написаны на английском (перевод не всегда дает четкое представление о том, как использовать ту или иную функцию).

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

С помощью расширения вы сможете:

  • создавать неограниченное количество карт, с неограниченным количеством меток на них;
  • менять такие параметры как масштаб, тип карты, поиск, реакция на движения мышкой, устанавливать изображения вместо стандартных меток;
  • задавать маршруты, добавлять ссылки и картинки на маркеры, создавать группы маркеров, показывать список групп, добавлять контакты на метки;
  • создавать собственные типы карт с пользовательскими слоями.

Настройка

Настройка производится в зависимости от ваших целей. Можно создать обычную карту или воспользоваться всеми возможностями расширения.

Добавить комментарий