API Яндекс.Карт используется для реализации множества различных сервисов: от простых схем проезда до почти полноценных ГИС. В зависимости от сложности решаемой задачи и «динамичности» данных, отображаемых на карте, используется свой подход и инструменты.
Схемы проезда обычно не меняются, а создаются один раз на продолжительный промежуток времени (например, до переезда офиса). Поэтому для их создания удобно воспользоваться визуальным инструментом «Конструктор схем проездов", который позволяет разметить необходимые объекты на карте и получить готовый код для вставки на страницу.
Недостатком «Конструктора схем проезда» является отсутствие возможности продолжить редактирование созданных карт. Поэтому для изменения объектов или их местоположение приходится создавать либо новую карту в конструкторе, либо редактировать JavaScript вручную. Такой проблемы не возникнет при использовании сервиса «Мои карты".
Сервис «Мои карты» позволяет отмечать на карте метки, изменять их внешний вид и описание, после чего можно поделиться ссылкой на созданную карту с друзьями. Карту, созданную в вышеописанном сервисе, можно разместить и у себя на сайте. Для этого необходимо воспользоваться возможностью экспорта объектов, размеченных на карте, в виде YMapsML. Более подробно про экспорт YMapsML можно прочитать в этом топике.
Чтобы добавить YMapsML-документ на карту, необходимо после ее инициализации вставить следующую строку (необходимо подставить свой URL):
map.addOverlay(new YMaps.YMapsML("http://maps.yandex.ru/export/usermaps/DwSVPt66C9uo uT5tN_0YgE-D23KX7rM0/")); Посмотреть пример на отдельной странице
Объекты, размещенные на карте таким образом, можно редактировать через интерфейс «Моих карт». Другими словами все изменения, внесенные в карту на Яндекс.Картах, автоматически отразятся в соответствующем YMapsML.
При добавлении YMapsML-документа из "Моих карт" центр и масштаб карты подбирается таким образом, чтобы все добавленные метки были видны на карте. Такое поведение можно изменить, если при создании YMapsML в конструктор передать параметр viewAutoApply со значением false.
map.addOverlay(
new YMaps.YMapsML("http://maps.yandex.ru/exp
ort/usermaps/DwSVPt66C9uo uT5tN_0YgE-D23KX7rM0/", { viewAutoApply : false
})
);
Посмотреть пример на отдельной странице
После окончания загрузки YMapsML-документа можно поменять внешний вид значков. Для этого необходимо создать обработчика события Load и в нем вызвать метод setStyle() для группы, в которой размещены метки:
var ml = new YMaps.YMapsML("http://maps.yandex.ru/exp
ort/usermaps/DwSVPt66C9uo uT5tN_0YgE-D23KX7rM0/"); map.addOverlay(ml);
YMaps.Events.observe(ml, ml.Events.Load, function (ml) {
ml.get(0).setStyle("default#mushroomIcon");
});
Посмотреть пример на отдельной странице
С помощью перечисленных инструментов можно решать достаточно обширный круг задач. В одной из следующих статей мы рассмотрим создания небольшого редактора, который можно будет разместить у себя на странице.
-----
Эта статья относится к API Яндекс.Карт 1.x. Рекомендуем почитать аналогичную инструкцию для новой версии API — 2.0.
-----
API Яндекс.Карт используется для реализации множества различных сервисов: от простых схем проезда до почти полноценных ГИС. В зависимости от сложности решаемой задачи и «динамичности» данных, отображаемых на карте, используется свой подход и инструменты.
Схемы проезда обычно не меняются, а создаются один раз на продолжительный промежуток времени (например, до переезда офиса). Поэтому для их создания удобно воспользоваться визуальным инструментом «Конструктор схем проездов", который позволяет разметить необходимые объекты на карте и получить готовый код для вставки на страницу.
Недостатком «Конструктора схем проезда» является отсутствие возможности продолжить редактирование созданных карт. Поэтому для изменения объектов или их местоположение приходится создавать либо новую карту в конструкторе, либо редактировать JavaScript вручную. Такой проблемы не возникнет при использовании сервиса «Мои карты".
Сервис «Мои карты» позволяет отмечать на карте метки, изменять их внешний вид и описание, после чего можно поделиться ссылкой на созданную карту с друзьями. Карту, созданную в вышеописанном сервисе, можно разместить и у себя на сайте. Для этого необходимо воспользоваться возможностью экспорта объектов, размеченных на карте, в виде YMapsML. Более подробно про экспорт YMapsML можно прочитать в этом топике.
Чтобы добавить YMapsML-документ на карту, необходимо после ее инициализации вставить следующую строку (необходимо подставить свой URL):
map.addOverlay(new YMaps.YMapsML("http://maps.yandex.ru/export/usermaps/DwSVPt66C9uo ")uT5tN_0YgE-D23KX7rM0/ Посмотреть пример на отдельной странице
Объекты, размещенные на карте таким образом, можно редактировать через интерфейс «Моих карт». Другими словами все изменения, внесенные в карту на Яндекс.Картах, автоматически отразятся в соответствующем YMapsML.
При добавлении YMapsML-документа из "Моих карт" центр и масштаб карты подбирается таким образом, чтобы все добавленные метки были видны на карте. Такое поведение можно изменить, если при создании YMapsML в конструктор передать параметр viewAutoApply со значением false.
map.addOverlay(
new YMaps.YMapsML("http://maps.yandex.ru/exp
ort/usermaps/DwSVPt66C9uo ", {uT5tN_0YgE-D23KX7rM0/ viewAutoApply : false
})
Посмотреть пример на отдельной странице
После окончания загрузки YMapsML-документа можно поменять внешний вид значков. Для этого необходимо создать обработчика события Load и в нем вызвать метод setStyle() для группы, в которой размещены метки:
var ml = new YMaps.YMapsML("http://maps.yandex.ru/exp
ort/usermaps/DwSVPt66C9uo ");uT5tN_0YgE-D23KX7rM0/ map.addOverlay(ml);
YMaps.Events.observe(ml, ml.Events.Load, function (ml) {
ml.get(0).setStyle("default#mushroomIcon");
}
Посмотреть пример на отдельной странице
С помощью перечисленных инструментов можно решать достаточно обширный круг задач. В одной из следующих статей мы рассмотрим создания небольшого редактора, который можно будет разместить у себя на странице.