Вызов пользовательских функций в Google Maps?

Question

Итак, у меня есть простая всплывающая подсказка, написанная на jQuery, для этого требуется, чтобы элемент имел class = "tooltips" и сразу после элемента (и курс css)

Но как мне реализоватьэто на полилинии в Картах Google?

function tooltipDisplay() {
    return function() { $(this).contents("span:last-child").css({ display: "block" }); }
}
function tooltipHide() {
    return function() { $(this).contents("span:last-child").css({ display: "none" }); }
}
function tooltipMove() {
    return function(e) {
        var mousex = e.pageX + 10;
        var mousey = e.pageY + 5;
        $(this).contents("span:last-child").css({  top: mousey, left: mousex });
    }
}
$(".tooltips").hover(tooltipDisplay(),tooltipHide());

    $(".tooltips").mousemove(tooltipMove());

Я пытался использовать

    google.maps.event.addListener(flightPath, 'mouseover', tooltipDisplay());

    google.maps.event.addListener(flightPath, 'mouseout', tooltipHide());

    google.maps.event.addListener(flightPath, 'mousemove', tooltipMove());

безрезультатно.(очевидно, потому что я не могу сделать промежуток на полилинии для начинающих)

Answer 1

Не имеет прямого отношения к вопросу (так что и к этой вики), но нет необходимости во всех этих оболочках функций, просто используйте tooltipDisplay вместо tooltipDisplay() при вызове ... используйте функцию напрямую, а не результат его вызова, вот так:

function tooltipDisplay() {
    $(this).contents("span:last-child").css({ display: "block" });
}
function tooltipHide() {
    $(this).contents("span:last-child").css({ display: "none" });
}
function tooltipMove(e) {
    var mousex = e.pageX + 10;
    var mousey = e.pageY + 5;
    $(this).contents("span:last-child").css({  top: mousey, left: mousex });
}
$(".tooltips").hover(tooltipDisplay,tooltipHide).mousemove(tooltipMove);

Answer 2

правый. Решаемые.

После небольшого прыжка через обручи и еще много чего оказалось легче, чем казалось.

Проще говоря: «это» бесполезно с Полилиниями Карт Google, так как это документ. Как таковой, я взял его на ступеньку ниже и дал ему свои собственные простые функции:

    google.maps.event.addListener(flightPath, 'mouseover', function() {
        $('#mapTooltip').show();
    });

    google.maps.event.addListener(flightPath, 'mouseout', function() {
        $('#mapTooltip').hide();
    });

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

function tooltipMove(e) {
    var y = e.pageY;
    var x = e.pageX;

    $("span").css({
        top:y+5,
        left:x+10
    });
}

$("#gMap").mousemove(tooltipMove);

А потом просто разработал CSS, чтобы соответствовать. Все просто!