Клуб API Карт

Почему не отображается созданная кнопка на карте?

sega-zav
11 апреля 2012, 00:07

Хотел добавить кнопку на карту (удаление метки), но она не отображается.

 

 

 <script type="text/javascript">
        window.onload = function () {
            var map = new YMaps.Map(document.getElementById("YMapsID")
            
            // Получение информации о местоположении пользователя по IP адресу
if (YMaps.location)
{
    var center = new YMaps.GeoPoint(YMaps.location.longitude, YMaps.location.latitude);
    map.setCenter(center, 10); // Задаем центр отображения карты и масштаб
    map.openBalloon(center, "Если желаете указать на карте своё местоположение<br> или местоположение вашего объекта:<br> а) с помощью 'Поиска на карте' найдите необходимую местность;<br> б) кликом левой клавиши мышки установите метку на карте.");
}
else
{
    map.setCenter(new YMaps.GeoPoint(101.578648,58.768352), 2); // если адрес не определился задаем центр отображения карты (Россия) и масштаб
    map.openBalloon(new YMaps.GeoPoint(101.578648,58.768352), "Если желаете указать на карте своё местоположение<br> или местоположение вашего объекта:<br> а) с помощью 'Поиска на карте' найдите необходимую местность;<br> б) кликом левой клавиши мышки установите метку на карте.");
}
            
            map.enableScrollZoom(Object); // Подключаем зум колесиком мыши
            map.addControl(new YMaps.TypeControl() // Подключаем отображения типов карты (схема, спутник, гибрид)
            map.addControl(new YMaps.Zoom() // Подключаем вертикальную линейку зума
            map.addControl(new YMaps.SearchControl({noPlacemark: true}) // Подключаем поиск по карте
            
            var button = new YMaps.ToolBarButton({ // Создаем кнопку для удаления метки
            caption: "Удалить метку",
            hint: "Удалить все данные о местоположении на карте"}
            YMaps.Events.observe(button, button.Events.Click, function () {
            map.removeOverlay(geoPlacemark);}
            
            var geoPlacemark;
            map.removeOverlay(geoPlacemark);
            YMaps.Events.observe(map, map.Events.Click, function (map, mEvent) {
            var geocoder = new YMaps.Geocoder(mEvent.getGeoPoint() // Преобразовываем координаты в адрес
            YMaps.Events.observe(geocoder, geocoder.Events.Load, function (geocoder) {
            var adres = geocoder.get(0).text;
            map.openBalloon(mEvent.getGeoPoint(), "Эта метка с адресом будет указана на карте, при просмотре вашего объявления.<br>Чтобы переместить метку - кликните мышкой в новом месте на карте.");
            geoPlacemark && map.removeOverlay(geoPlacemark);
            geoPlacemark = new YMaps.Placemark(mEvent.getGeoPoint(), {style: "default#bluePoint"} // Задаем координаты и стиль метки
            geoPlacemark.setIconContent(adres); // содержимое метки
            geoPlacemark.description = "Это ваша метка на карте";
            map.addOverlay(geoPlacemark);
            }
            }
        }
    </script>

 

26 комментариев
Подписаться на комментарии к посту

 

Хотел добавить кнопку на карту (удаление метки), но она не отображается.

вижу код создания кнопки

не вижу код добавления кнопки на карту

А какой код добавления?

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

это не пример, а кусочки кода про конкретный документируемый функционал.

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

все примеры так и называются "Открыть пример в новом окне"

 

Рекомендую все же смотреть не только на код, но и читать описание,

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

то ее надо сначала добавить в тулбар. А сам тулбар добавить на карту.

 

 

А что нельзя поставить только одну кнопку, обязательно нужно устанавливать весь тулбар?

map.addControl(new YMaps.ToolBar());

тулбар - контейнер для кнопок.

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

Ага понял.

Вот так вроде работает:

map.addControl(new YMaps.ToolBar([new YMaps.ToolBarButton({caption: "Удалить метку", hint: "Удалить все данные о местоположении на карте"})]));

 

Только почему, то не срабатывает функция этой кнопки:

YMaps.Events.observe(button, button.Events.Click, function () {
            map.removeOverlay(geoPlacemark);});

 

а на что у вас указывает button?

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

Функцию кнопки взял из примера и отредактировал, видимо не успешно. Может поможете мне правильно сделать эту функцию.

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

 

Может поможете мне правильно сделать эту функцию.

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

АПИ Яндекс.Карт это все-таки инструмент для javascript-разработчика. И хотя особо глубоких знания языка не требуется, но знать базовые вещи необходимо.

Если нет желания/времени его изучать, напишите объявление в клубе, что ищите разработчика для реализации вот такого функционала. Обсуждать размеры оплаты лучше в приватной email-переписке

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

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

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

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

пробуйте сделать сами, используйте инструменты для отладки (Firefox + Firebug) для локализации ошибок.

Если не получается разобраться в причинах ошибки, пишите пост.

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

Еще рекомендую прочесть это

Прошу прощения, может я не совсем правильно изложил свои мысли.

Но серьёзно, мне осталось только сделать удаление меток с карты.

 

Что не правильно или чего не хватает в этой функции:

YMaps.Events.observe(button, button.Events.Click, function () {
            map.removeOverlay(geoPlacemark);});

 

 

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

 

У меня ещё нет страницы с картой, я провожу испытания и настройку карты на локальном сервере.

а что говорит вам вкладка console firebug-а на странице с этим кодом?

Вообще ничего не говорит.

Давайте попорядку.

Я создал кнопку на карте:

map.addControl(new YMaps.ToolBar([new YMaps.ToolBarButton({caption: "Удалить метку", hint: "Удалить все данные о местоположении на карте"})]));

 

Как мне привязать к этой кнопке это действие: map.removeOverlay(geoPlacemark);

через обработчик соответсвующего события

Ну я же задал обработчик события и в функцию занес действие этого обработчика:

YMaps.Events.observe(button, button.Events.Click, function () {
            map.removeOverlay(geoPlacemark);});

 

Почему он тогда не срабатывает?

ну я вас об этом и спрашивал 10 постов назад

вы передаете в него button

где в вашем коде создается эта перменная?

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

var button = new YMaps.ToolBarButton({caption: "Удалить метку", hint: "Удалить все данные о местоположении на карте"});
            map.addControl(new YMaps.ToolBar([button]));

А можно ли в эту функцию:

YMaps.Events.observe(button, button.Events.Click, function (button) {
            map.removeOverlay(geoPlacemark);});

добавить закрытие балуна:

map.openBalloon(mEvent.getGeoPoint(), "Эта метка с адресом будет указана на карте, при просмотре вашего объявления.
Чтобы переместить метку - кликните мышкой в новом месте на карте.");

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

 

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

http://api.yandex.ru/maps/jsapi/doc/ref/reference/map.xml#removeAllOverlays

Да, то что нужно, СПАСИБО!

А как выполнить перезагрузку карты в коде:

// Задаем действие при нажатии кнопки button "Удалить метку"
            YMaps.Events.observe(button, button.Events.Click, function (button) {
            map.removeAllOverlays();});

что такое перезагрузка карты?