자체 정의 된 객체가있는 HTML5 캔버스

Question

저는 캔버스에 관한 캔버스와 자체 정의 된 객체에 관한 질문이 있습니다. 캔버스에 자체 정의 된 객체는 캔버스에 여러 번 자바 스크립트 객체를 그릴 수 있도록 다양한 속성을 가진 자바 스크립트 클래스입니다. 이제 내 질문에 자바 스크립트 클래스에 oncontextmenu를 추가하는 것이 가능합니다. 다음 객체를 원합니다 :

캔버스 객체에서 이러한 javscript 클래스 객체를 마우스 오른쪽 버튼으로 클릭하면 컨텍스트 메뉴가 팝업됩니다.

Answer 1

캔버스에서 마우스 오른쪽 버튼을 눌렀 음을 알 수있는 contextmenu 이벤트를 수신 할 수 있습니다.

$("#canvas").contextmenu(function(e){handleContextMenu(e);}); 

function handleContextMenu(e){ 
    e.preventDefault(); 
    e.stopPropagation(); 

    mouseX=parseInt(e.clientX-offsetX); 
    mouseY=parseInt(e.clientY-offsetY); 

    // hit-test each of your objects 
    // if the mouse is inside an object 
    // then display your context menu 

} 

그런 다음 개체를 반복하고 마우스가 개체 안에 있는지 테스트합니다.

오브젝트 내부에있는 경우 컨텍스트 메뉴를 표시하십시오.

실제 컨텍스트 메뉴를 표시하는 Google 사례가 많이 있습니다.

http://ignitersworld.com/lab/contextMenu.html