Проблеме с открытием балуна в objectmanager, поможете?

Question

[Владимир Сергеевич]

Всем мир и хорошего дня! Вопрос на засыпку: https://goo.gl/4Czxvu (обсуждение в Клубе яндекс карт)
Суть проблемы повторно писать не буду, с ней можете ознакомиться по ссылочке сверху.

Заранее большое спасибо за подсказку

function get_show_balloon(marker_id, current_marker) {
    //var new_center = current_marker.geometry.coordinates;
    //yMap_ob.setCenter(new_center, 16);
    console.log(current_marker);
    //TODO На данный момент данный аякс запрос полностью дублирует запрос для вывода списка в правой колонке, но в будущем сможет пригодиться + надо бы проверить рентабельность большого числа запросов или все делать в одном или как-то разделять. Если маркеры пришли по отрисованному полигону, то можно и сразу прописывать в них балуны? Экономия на колличестве запросов к серверу.
    //Получение контента балуна
    var marker_id_injson = {
        id: marker_id
    }
    //Проверяем, есть ли у маркера балун, если нет, то грузим, ели есть то открываем
    if (hasBalloonData(current_marker)) {
        markerManager.objects.balloon.open(marker_id);
    } else {
        $.ajax({
            type: "POST",
            url: "get_baloon.php",
            dataType: "json",
            data: marker_id_injson,
            async: false,
            success: function (data) {
                //шаблон информации в балуне
                //TODO change link
                var balloon_content = "<a target='_blank' href='http://198.199.124.81/s_rent/catalog_full' class='balloon_content'><img src='img/list_img/1.jpg' alt=''><div class='balloon_desc'><span class='balloon_address'>Ул. " + data["street"] + " д. " + data["home_num"] + "</span><span class='balloon_info'>Площадь: " + data["squre_ciunt"] + "м² Комнат:" + data["room_count"] + "  Этаж: " + data["floor"] + "/" + data["flor_of"] + "</span></div></a>";
                //Прописываем в объект маркера контент балуна
                current_marker.properties.balloonContent = balloon_content;
                //Открываем балун у маркера
                markerManager.objects.balloon.open(marker_id);
            }
        });
    }
    //положение маркера
    var new_center = current_marker.geometry.coordinates;
    //преобразование строчки в число
    new_center[0] = parseFloat(new_center[0]);
    new_center[1] = parseFloat(new_center[1]);
    console.log(new_center);
    yMap_ob.setCenter(new_center, 15);
}

Answer 1

[forgotten]

Вы хоть напишите, в какой фрагмент кода смотреть.

Comments

[Владимир Сергеевич]

Вот ссылочка на JS: 198.199.124.81/map/map_app.js

В функции show_balloon_marker(283стр), в ее конце я перемещаю область видимости карты к балуну и зумирую карту. Если точки находятся рядом, то работает все адекватно, т.к объекты присутствуют на карте, но если я перемещаюсь к отдаленной точке, то открытие балуна не происходит(пробовал ставить таймаут, но это не помогает)
насколько я понимаю, это из-за того, что маркеры отрисовываются постепенно objectManager`ом

В обсуждении, в клубе я добавил видео с проблемой.
Повторная ссылка на видео: https://www.youtube.com/watch?v=aDlVKz6FTXc

Заранее огромное спасибо, так же сейчас добавлю код функции в описание вопроса

[Владимир Сергеевич]

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

[forgotten]

Владимир Жданов: Вам нужно (а) спросить у objectManager.overlays с помощью метода getById отрисован ли в данный момент объект с указанным id на карте, (б) если да — открыть на нём балун, (в) если нет — подписаться на событие add добавления нового оверлея и, после того, как оверлей с нужным id на карте появится, открывать балун
https://tech.yandex.ru/maps/doc/jsapi/2.1/ref/refe...

[Владимир Сергеевич]

Окей! Большое спасибо! Честно говоря, немного сложно разбираться у Вас в документации, многое дублируется и немного не понимаю всю структуру, иногда по несколько часов ищу что-то нужное(допустим markerManager.objects.setObjectOptions)
*** не в обиду, как я уже написал в JS совершенно не силен.
Зато отличная поддержка! Еще раз спасибо

[forgotten]

Владимир Жданов: Писать документацию на проекты таких размеров, мягко говоря, нетривиально. Если есть конкретные предложения — мы с удовольствием подумаем над этим.

[Владимир Сергеевич]

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

function get_show_balloon(marker_id, current_marker) {
    //TODO На данный момент данный аякс запрос полностью дублирует запрос для вывода списка в правой колонке, но в будущем сможет пригодиться + надо бы проверить рентабельность большого числа запросов или все делать в одном или как-то разделять. Если маркеры пришли по отрисованному полигону, то можно и сразу прописывать в них балуны? Экономия на колличестве запросов к серверу.
    //Получение контента балуна
    var marker_id_injson = {
        id: marker_id
    }
    //положение маркера
    var new_center = current_marker.geometry.coordinates;
    //преобразование строчки в число
    new_center[0] = parseFloat(new_center[0]);
    new_center[1] = parseFloat(new_center[1]);
    yMap_ob.setCenter(new_center, 15);
    //проверяем оверлай выбранного маркера
    var marker_overlay = markerManager.objects.overlays.getById(marker_id);
    //если есть оверлай, то добавляем балун
    if (marker_overlay) {
        add_balloon(false);
        console.log("has overlay");
    } else {
        //если оверлэя нет, то добавляем подписку на событие добавления оверлея
        var detector_overlays = markerManager.objects.overlays.events.group()
            .add("add", function (e) {
                //если добавленный оверлей соответствует кликнутому маркеру то запускаем показ балуна
                if (e.get("objectId") == marker_id) {
                    add_balloon(true);
                }
            });
        console.log("not has overlay")
    }
    //функция добавления балуна
    function add_balloon(del_event) {
        //если передается команда удаления подписки на событие, подписка удаляется
        if (del_event === true) {
            //удалить подписку
            detector_overlays.removeAll();
        }
        //Проверяем, есть ли у маркера балун, если нет, то грузим, ели есть то открываем
        if (hasBalloonData(current_marker)) {
            markerManager.objects.balloon.open(marker_id);
        } else {
            $.ajax({
                type: "POST",
                url: "get_baloon.php",
                dataType: "json",
                data: marker_id_injson,
                async: false,
                success: function (data) {
                    //шаблон информации в балуне
                    //TODO change link
                    var balloon_content = "<a target='_blank' href='http://198.199.124.81/s_rent/catalog_full' class='balloon_content'><img src='img/list_img/1.jpg' alt=''><div class='balloon_desc'><span class='balloon_address'>Ул. " + data["street"] + " д. " + data["home_num"] + "</span><span class='balloon_info'>Площадь: " + data["squre_ciunt"] + "м² Комнат:" + data["room_count"] + "  Этаж: " + data["floor"] + "/" + data["flor_of"] + "</span></div></a>";
                    //Прописываем в объект маркера контент балуна
                    current_marker.properties.balloonContent = balloon_content;
                    //Открываем балун у маркера
                    markerManager.objects.balloon.open(marker_id);
                }
            });
        }
    }
}

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

[Владимир Сергеевич]

forgotten: Основная сложность в документации это понять структуру, что и откуда приходит. Информации достаточно, примеров тоже но ориентироваться сложно. Есть множество менеджеров, вложеностей и.т.п вот именно обобщенной информациии, как по мне, не хватает.
Может какой-то внутренний "толковый словарь" было бы неплохо, с простонародными терминами и объяснениями "для тупых"

[forgotten]

Владимир Жданов: Во-первых, current_marker.properties.balloonContent = balloon_content; нужно заменить на current_marker.properties.set('balloonContent', balloon_content);
Во-вторых, подключите, пожалуйста, API в mode=debug

[Владимир Сергеевич]

forgotten: Через set не хочет меня слушать, вообще не вставляет, говорит что не является функцией
Мод поменял

[forgotten]

Владимир Жданов: Да, прошу прощенья. В ObjectManager-е объекты принципиально неизменяемы. Кажется, правильное решение примерно такое: класть в balloonContent изначально плейсхолдер типа «Идёт загрузка», и, при готовности данных, вызывать balloon.setData с актуальными данными.
https://tech.yandex.ru/maps/doc/jsapi/2.1/ref/refe...

[Владимир Сергеевич]

forgotten: Спасибо!) Кстати, многое стало понятно после того как все-таки повторно изучил Руководство. И посмотрел пару видео из Яндекс.События, на хабре в комментах тоже много полезного нашлось.

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

Еще раз отправляю код:

//Функция получения и показа балуна
function get_show_balloon(marker_id, current_marker) {
    //TODO На данный момент данный аякс запрос полностью дублирует запрос для вывода списка в правой колонке, но в будущем сможет пригодиться + надо бы проверить рентабельность большого числа запросов или все делать в одном или как-то разделять. Если маркеры пришли по отрисованному полигону, то можно и сразу прописывать в них балуны? Экономия на колличестве запросов к серверу.
    //Получение контента балуна
    var marker_id_injson = {
        id: marker_id
    }
    //положение маркера
    var new_center = current_marker.geometry.coordinates;
    //преобразование строчки в число
    new_center[0] = parseFloat(new_center[0]);
    new_center[1] = parseFloat(new_center[1]);
    yMap_ob.setCenter(new_center, 15);
    //проверяем оверлай выбранного маркера
    var marker_overlay = markerManager.objects.overlays.getById(marker_id);
    //если есть оверлай, то добавляем балун
    if (marker_overlay) {
        add_balloon(false);
        console.log("has overlay");
    } else {
        //если оверлэя нет, то добавляем подписку на событие добавления оверлея
        var detector_overlays = markerManager.objects.overlays.events.group()
            .add("add", function (e) {
                //если добавленный оверлей соответствует кликнутому маркеру то запускаем показ балуна
                if (e.get("objectId") == marker_id) {
                    add_balloon(true);
                }
            });
        console.log("not has overlay")
    }
    //функция добавления балуна
    function add_balloon(del_event) {
        //если передается команда удаления подписки на событие, подписка удаляется
        if (del_event === true) {
            //удалить подписку
            detector_overlays.removeAll();
        }
        //Проверяем, есть ли у маркера балун, если нет, то грузим, ели есть то открываем
        if (hasBalloonData(current_marker)) {
            markerManager.objects.balloon.open(marker_id);
        } else {
            $.ajax({
                type: "POST",
                url: "get_baloon.php",
                dataType: "json",
                data: marker_id_injson,
                async: false,
                success: function (data) {
                    //шаблон информации в балуне
                    //TODO change link
                    var balloon_content = "<a target='_blank' href='http://198.199.124.81/s_rent/catalog_full' class='balloon_content'><img src='img/list_img/1.jpg' alt=''><div class='balloon_desc'><span class='balloon_address'>Ул. " + data["street"] + " д. " + data["home_num"] + "</span><span class='balloon_info'>Площадь: " + data["squre_ciunt"] + "м² Комнат:" + data["room_count"] + "  Этаж: " + data["floor"] + "/" + data["flor_of"] + "</span></div></a>";
                    //Прописываем в объект маркера контент балуна
                    //current_marker.properties.balloonContent = balloon_content;
                    //Открываем балун у маркера
                    markerManager.objects.balloon.open(marker_id);
                }
            });
        }
    }
}

И ссылочка на страницу: 198.199.124.81/map

И еще, может я как-то могу настроить autoPan так, чтобы балун попадал в центр видимой области? И тогда мне только разобраться с зумом?

[Владимир Сергеевич]

точнее: balloonAutoPan

[forgotten]

В общем, всё оказалось гораздо проще. Если вы пропишете каждому объекту плейсхолдер контента балуна, то балун на нём можно открывать просто по objectManager.objects.balloon.open(objectId), не заботясь о том, находится объект в области видимости или нет.
jsfiddle.net/vdsgbdm9/2