Узнаем как поставить метку на карте Яндекс: инструкция для пользователей

С помощью сервиса Мои карты (Google Maps Engine) можно создавать пользовательские карты с метками, слоями, маршрутами, а также наносить линии и фигуры на карту. Сервис имеет большое количество настроек меток, а также есть возможность вставить созданную карту на свой сайт или поделиться ссылкой.

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

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

Еще по теме: Инфографика, карты, визуализация: 24 интерактивных проекта

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

image
Фрагмент сервиса Мои карты от Google. Возможность изменения отображения меток.

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

image
Фрагмент карты, созданной с помощью Мои карты от Google.

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

Фрагмент карты, созданной с помощью Мои карты от Google.

Более подробно о возможностях сервиса можно узнать из видеозаписи нашего вебинара:

Сайт: Google Maps Engine (Мои карты).

Информация устарела. Пользуйтесь официальным мастером создания карт.

Процесс создания своей карты с меткой и описанием:

  1. Логинимся в Google.

  2. Открываем Google Maps.

  3. Переходим по ссылке Мои карты:

  4. Кликаем на ссылку Создать новую карту:

  5. Заполняем название карты и выбираем тип доступа:

  6. Жмём на иконке Добавить метку:

  7. Ставим метку в нужную точку на карте и заполняем название, описание:

  8. Жмём кнопку Ок, затем Готово:

  9. Слева, кликаем по названию созданной метки:

  10. Справа кликаем по ссылке Ссылка и копируем код из поля HTML-код для добавления на веб-сайт:

  11. Вставляем код на нужную страницу.

Рекомендую проделывать всё в браузере Google Chrome. У меня в Opera были проблемы с генерацией кода карты.

Похожие записи

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

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

Яндекс карта «Слои»

Объект найден и метка установлена. Какие ещё есть возможности? На скриншоте мы видим пункт меню «Слои» с выпадающим списком. Нажимая на каждый из них, вы увидите как будет меняться внешний вид карты. Привычному для глаз схематичный вариант, поменяется на спутниковый и гибридный (смесь между спутником и схемой).

Яндекс карты «Многоугольники»

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

Яндекс карты «Линии»

Яндекс карты «Линии» позволяет прокладывать на карте маршруты. Давайте нарисуем маршрут, как нам попасть от автобусной остановки в аквапарк Серена. Нажимаете на кнопку «Линии», ставите точку на карте в начале маршрута и ведете пунктирную линию до конечной цели, чтобы закончить, нажимаете клавишу «ESC».

Метки на Яндекс карте

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

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

Добавляем название и описание карты, затем сохраняем.

Настройки редактора карта

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

Получить код карты

Здесь у вас снова возникает ситуация выбора, вставить карту через iframe или JavaScript. Рекомендую выбрать JavaScript код, таким образом вы можете слегка изменив код, запретить прокручиваться колесику мышки на самой карте. Особенно эта проблема актуальна на мобильных устройствах. Если карта занимает всю высоту экрана устройства, то ваш палец цепляется за карту и вы не можете скролить не вниз, не вверх. В полученном коде, нужно заменить всего одно слово, вместо scroll=true, написать scroll=false.

Вставить Яндекс карту на WordPress

На странице «Контакты» выбираете блок Custom HTML и вставляете туда скопированный код. Все очень просто.

Карта успешно вставилась, на всю ширину родительского блока, как мы и хотели.

  • Создано 02.10.2020 10:31:12
  • Михаил Русаков

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

Особенности сервиса

Яндекс Карты — расширение с разными полезными возможностями. К ним относят:

  • возможность поиска местонахождения объекта;
  • геолокация «Где я сейчас»;
  • Движение «Мой транспорт»;
  • построение маршрута с описанием времени и расстояния;
  • измерение маршрута;
  • создание собственной карты;
  • переключение между гибридным, схематическим и спутниковым атласом;
  • поиск точки с адресом и контактами;
  • другие особенности (подробнее по ссылке)

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

Обзор популярных функций с объяснением

В данном разделе рассмотрим несколько возможностей, которые пригодятся в процессе использования системы.

Поиск мест и адресов

Поиск мест находится в левой части экрана сверху. Здесь пользователь может ввести нужный адрес или название объекта (магазин, больница, АЗС). В результатах поиска будет показаны номера телефонов, адрес и график работы (если есть).

Здесь можно найти отзывы об организации, а также построить маршрут на Яндекс Картах.

Панорамы улиц и фотографии

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

Чтобы запустить панораму, сделайте следующее:

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

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

Движущийся транспорт

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

Слои и типы карт

Слои позволяют переключаться между типами карт на Яндекс.

Рассмотрим нюансы каждого типа карт.

  • Схема. Удобная карта. На такой можно создать свою интерактивную с помощью конструктора. Имеет видимые условные обозначения дорог, названий улиц, архитектурных объектов.
  • Спутник. Показывается карта со съемкой со спутника. Здесь указываются не только названия улиц, но и номера домов. При увеличении серьезно страдает качество. отображаются все объекты строительства, стоящие автомобили, прохожие.
  • Гибрид. На этом варианте Яндекс Карт обозначаются все необходимые элементы. Показываются дороги, растительность, обозначения улиц, населенных пунктов, памятников архитектуры и других. На гибридной карте дороги показываются сквозь постройки для удобства просмотра и возможного передвижения.

Линейка

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

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

Как поделиться картами

Сервис Яндекс Карты имеет возможность сделать репост выбранного фрагмента атласа. Чтобы поделиться определенным вариантом, нужно следовать пошаговой инструкции:

  • Зайдите в меню сервиса (три горизонтальные черты в правом верхнем углу).
  • В списке пунктов нажмите на «Поделиться».
  • В открытом окне нажмите на одну из кнопок социальной сети. Выбирайте ту, в которой планируете поделиться ссылкой. Ссылка, которая выделена красным на скриншоте скопируется и отобразится в виде поста на стене социальной сети.

Интересно! Рекомендуем воспользоваться опцией «Следите за транспортом, когда вам удобно». Нажмите на кнопку слева «Попробовать». Обращаем ваше внимание, что эта кнопка будет работать только в том случае, если запущен инструмент «Движущийся транспорт».

Уважаемые читатели, мы рассмотрели подробную информацию о том, как пользоваться сервисом Яндекс Карты, и какие у них есть возможности. Если у вас остаются вопросы, обязательно задавайте их в комментариях под статьей.

Похожие статьи

Почтовые настройки Яндекс Почты — вы могли это упустить Как мой ребенок подружился с “Алисой”: обзор самых любимых навыков Видеовстречи в новом формате или как пользоваться сервисом Яндекс Телемост Яндекс Учебник заботится о школьниках, что это за сервис, обзор

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

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

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

  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 месяцев назад). Если у вас есть желание поиграть в плагины, то их найдете в репозитории Вордпресс поиском, а как устанавливать плагины смотрите тут.

Статьи из этой же рубрики:

Оцените статью
Рейтинг автора
5
Материал подготовил
Илья Коршунов
Наш эксперт
Написано статей
134
А как считаете Вы?
Напишите в комментариях, что вы думаете – согласны
ли со статьей или есть что добавить?
Добавить комментарий