Canvas 태그의 addEventListener

그래픽을 만들 수있는 캔버스 태그가 있습니다. 내 라인의 각 섹션에는 마우스 오버를 활성화하고 더 자세하게 표시 할 수있는 "점"이 있습니다.Canvas 태그의 addEventListener

이 도트에 이벤트 수신기를 추가하지 않으면 모든 것이 잘 작동합니다.

방화범은 저를 경고한다 : s.addEventListener는 함수가 아닙니다 ...

은 동적 이벤트 리스너를 만들 수 있습니까? (저는 Javascript를 처음 사용합니다.)

2009-10-07 kadiks

일부 코드는 우리에게 도움이 될 것입니다 ... –

DOM 객체 (요소) 이외의 객체에 DOM 이벤트를 첨부 할 수 없습니다. canvas은 DOM 요소이며, 캔버스에 그리는 것은 그렇지 않습니다. 그것들은 img의 픽셀로서 캔버스의 일부가됩니다.

캔버스의 특정 지점에 대한 클릭을 감지하려면 click 이벤트를 canvas 요소에 첨부 한 다음 click 이벤트의 x/y 좌표를 캔버스의 좌표와 비교해야합니다. 당신이 거의 기본 구조를 그리기 될 경우 "How do I get the coordinates of a mouse click on a canvas element?"

출처

2009-10-07 17:11:00 Borgar

고맙습니다. 다른 캔버스를 캔버스에 추가하여 이벤트 리스너를 추가하는 데 관심이 있었지만 표시되지 않았습니다 (기본 캔버스 뒤에있을 수 있음). 어쨌든 마우스 위치와 비교하여 이벤트를 감지하는 방법을 찾고 있습니다. 다시 한번 감사드립니다 :-) – kadiks

[Easel js framework] (http://easeljs.com)을 사용하면 마우스 조작을 그려진 도형에 간단하게 추가 할 수 있습니다. – Neil

, 당신이 인라인 SVG의 사용을 제안한다

이

는에 대답했다.

이 경우 모든 svg 요소는 DOM 요소가되며 각 svg 요소는 각각 별도의 이벤트를 첨부 할 수 있습니다.

출처

2011-02-07 08:45:36 Sujay

Canvas 태그의 addEventListener

답변

관련 문제