올바른 위치에서 svg 내에서 html 팝업을 얻으려면 (자바 스크립트 사용)

Question

나는 단순한 svg-graph를 가지고 있는데이 그래프에 대한 간단한 툴팁 팝업을 만들려고 노력하고 있지만 어떻게 찾을 수 없습니까? 툴팁의 위치 을 올바르게 설정하십시오. 에, 내 문제에 대한 지금

p.setAttributeNS(null,"onmousemove","parent.drawPopup(evt)"); 

다음 SVG에서 노드를 만들 때

#popup { 
    position: relative 

내가 좋아하는 리스너를 훅 :

내 팝업 사업부는 절대입니다 .CSS가 drawPopup callack, 좌표를 올바르게 설정하는 방법을 알아내는 데는 을 알아낼 수 없습니다. drawPopu 함수에서 다음과 같은 것을 시도했습니다 :

pop = document.getElementById("popup"); 
pop.innerHTML = popupText; 
pop.style.visibility='visible'; 
pop.style.left=evt.pageX + 'px'; 

그러나 pageX는 svg.graph와 관련이있는 것 같습니다. 그래서 어떻게 든 상쇄해야합니까?

일반적으로 이러한 문제는 어떻게 발생합니까? 어떤 제안?

Answer 1

절대적으로 툴팁을 배치하고 CSS 규칙은 이라고 말하고 마우스 포인터로 툴팁이 트리거되기 때문에 마우스 x, y 좌표를 사용하여 그래프 위에 놓을 수 있습니다.

이 링크는 quirksmode.org 페이지를 스크롤하거나 마우스 위치을 검색하면 마우스 x, y 좌표를 정확하게 계산하는 데 유용한 정보를 얻을 수 있습니다.

Answer 2

Raphael을 살펴보십시오.

http://raphaeljs.com/

자바 스크립트 라이브러리 우수한 벡터.