Google지도에서 맞춤 기능 호출? 그래서

Question

, 내가 jQuery를 작성 먼지 간단한 툴팁을 가지고 는 단지 클래스를 가질 요소를 필요 = "툴팁"및 요소 후 오른쪽 (그리고 당연히는 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() ... 직접 기능이 아니라이 전반적으로 좋아, 그것을 호출 한 결과를 사용합니다. 풀렸다.

농구와 그 밖의 것들을 뛰어 넘은 후, 생각보다 쉽게 ​​쉬워졌습니다.

간단히 말하면 "this"는 Google지도 폴리 라인과 마찬가지로 유용하지 않습니다. 따라서 나는 노치를 내려 갔다과 같은 그것의 자신의 간단한 기능을했다 : 나는 또한에 있었다으로 리스너에 마우스 오버와 함께 할 수 없습니다 툴팁을 배치하는 행위를 발견하지만

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

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

I 이것을 추가 document.ready 영역에서 I 어디서나 이동마다 같은 소성 하였다 루프 결과 어쨌든 요소를 ​​호출

다음

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

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

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

그리고 단지 맞게 CSS 스타일. 간단합니다!

Answer 2

이 Wiki를 직접 만들지는 않겠지 만,이 모든 함수 래퍼가 필요하지는 않지만 대신 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);