2012-06-07 2 views
2

Raphael 2+ 라이브러리를 사용하여 마우스로 직사각형을 그려보고 있습니다 (참고 : this question에 대한 대답은 Raphael 2에서 작동하지 않습니다).마우스 이벤트를 Raphael rect에 첨부하기

사각형 (Paper.rect)을 사용하면 mousedown/mouseup 이벤트는 커서가 사각형의 가장자리에있을 때만 트리거됩니다. 이러한 이벤트를 첨부하여 마우스 커서가 사각형 내에있을 때 트리거하는 방법이 있습니까?

궁극적으로 마우스를 사용하여 선택 윤곽/프레임을 그려 봅니다. 이상적으로, 마우스 리스너를 첨부하고 싶습니다. 그러나 이것은 더 이상 가능하지 않습니다. 따라서 종이 위에 '표면'rect를 만들고 그 안에 요소를 그립니다. 이 접근 방식은 꽝인가? 모든 아이디어를 환영합니다.

답변

4

나는 놀았으며, 이벤트를 해고하기 위해 을 채워 모양을 채워야하는 것으로 보입니다. 여기를 참조하십시오 : http://jsfiddle.net/bathz/KrpKs/

그게 내게 감동을줍니다. 그것은 당신이 듣는 것의 둘레를 예리하게 정의 할 수있게 해줍니다. 나는 당신이 투명한 색으로 도형을 채울 수 있다고 생각하지만, 나는 그것을 당신에게 맡길 것입니다.

+0

고마워요. 요소를 통해 이벤트를 전파하는 방법을 알고 있다고 생각하지 않습니까? 다른 객체 아래에있는 객체에서 마우스 움직임을 추적 할 때 마우스가 맨 위 요소 위로 이동하면 이벤트가 중지됩니다.이 요소는 맨 아래 요소로 전달되지 않습니다. – simonhaines

+1

헴, 불행히도, 나는 라파엘을 사용한 이벤트 핸들링에 대한 경험이 없습니다. 어쩌면이 대답은 당신을 방해 할 수 있습니다 : http://stackoverflow.com/questions/6617548/why-is-dragging-in-raphael-broken-by-stopping-propagation-of-mousemove-in-an-enc. 어쩌면이 라파엘 예제가 당신을 도울 수 있습니다 (그러나 그것은 마우스 끌기를 구현합니다) : http://raphaeljs.com/graffle.html. – Bathz

+0

다시 한번 감사드립니다. 좀 더 놀아 라 Raphael 이벤트 메커니즘을 모두 무시하고 svg 요소 자체에 핸들러를 연결했습니다. 훨씬 좋네요. – simonhaines

관련 문제