Как зафиксировать окно маркера на Google map при наведении мышью, что бы была возможность нажать кнопку в этом окне?

Question

[pyigor]

Помогите пожалуйста, создал карту на которой отмечается места появления кошачьих пород, нужно что бы при наведении на маркер всплывало окно с инфой и кнопкой, а после перемещении мыши окно закрывалось. Сделал с помощью mouseover и mouseout, и да, окно появляется и скрывается но нет возможности войти мышью в это окно и использовать кнопку... Что можно сделать? Спасибо Всем Откликнувшимся!

if(breed){
        var info = new google.maps.InfoWindow({
            content: contentString,
            maxWidth: 200,
        });

        marker.addListener("mouseover", function(){
            info.open(map, marker);
        });
        marker.addListener('mouseout', function() {
            info.close();
        });
    }

Answer 1

[Сергей Сергей]

Может быть, есть флаг в инициализации инфо-окна, указывающий на желаемый результат.

Можно было бы как-то структурно инфо-окно поместить внутрь маркера, чтобы браузер считал положение курсора для "разросшегося" маркера.

Можно дополнительно повесить обработку событий для инфо-окна, но для обработчиков потребуется выделить debounce-функцию с аргументом "открыть/закрыть".

//lodash debounce, или короткий копипаст
const showhide = debounce( s => s ? info.open() : info.close() );

marker.addListener("mouseover", function() {
    showhide(true)
});
marker.addListener('mouseout', function() {
    showhide(false)
});
// как достать элемент DOM из info я не знаю, но это должно быть возможно.
info.node.addListener("mouseover", function() {
    showhide(true)
});
info.node.addListener('mouseout', function() {
    showhide(false)
});

так за счёт debounce окно не будет успевать закрываться при переводе курсора от маркера в инфо-окно.