2010-05-28 7 views
3

기본적으로 svg "FirstSVG"에 "SecondSVG"라는 svg "MainSVG"가 있습니다. 모든 SVG에는 자체 ViewBox가 있습니다. 이 페이지는 다른 페이지에서 화면의 아무 곳이나로드 할 수 있습니다.
그래서 기본적으로 "SecondSVG"에 대한 viewBox의 화면 x를 찾을 수 있습니다.이 svg는 기본적으로 호출 페이지를 기반으로로드 될 수 있습니다. event.clientX는 나 자신에게 화면의 x 좌표를 제공합니다. "SecondSVG"의 ViewBox에 대한 좌표를 모른다면 "SecondSVG"의 ViewBox에서 x 좌표를 어떻게 찾을 수 있습니까?SVG - Window 좌표에서 ViewBox 좌표로

Firefox 3.6.3을 사용하고 있으며 clientX, clientY 및 화면과 관련된 기타 좌표를 추출 할 수있는 이벤트 개체가 있습니다. 그러나 내가 필요한 것은 ViewBox 내부의 좌표입니다.

+0

이상하게 들리 겠지만 이벤트는 대상 요소에 로컬 좌표를 제공해야합니다. 나는 최근 파이어 폭스에서 이것으로 좋은 성공을 거두었 다. 이 동작을 설명하는 페이지에 연결할 수 있습니까? – jbeard4

+0

동일한 문제가 있습니다. 이 주제에 대해 밝히기를 관리 했습니까? –

+1

Im가 나타나지 않습니다. 화면 좌표 (clientX, clientY)를 SVG 좌표로 변환하려고하십니까? – Cipi

답변

5
function click(evt) 
{ 

var root = document.getElementById('your svg'); 

     var uupos = root.createSVGPoint(); 

     uupos.x = evt.pageX; 

     uupos.y = evt.pageY; 

     var ctm = evt.target.getScreenCTM(); 

     if (ctm = ctm.inverse()) 

      uupos = uupos.matrixTransform(ctm); 



///the new x y are : uupos.x , uupos.y 
} 
+0

body 태그에 여백이 있으면'evt.clientX'와'evt.clientY'를 사용해야합니다. 계산 결과가 잘못 나온다 – Hoffmann

+1

관련 항목 : http://stackoverflow.com/a/20958980/500207 –