HTML5キャンバスのクリックをキャッチする

Question

のクリックを私のHTML5のキャンバスにキャッチしたいと思います。

マイオブジェクト：

mouse = 
    position: 
    x: 0 
    y: 0 
    set: (event) -> 
     boundaries = canvas.getBoundingClientRect() 
     this.position.x = event.clientX - boundaries.left 
     this.position.y = event.clientY - boundaries.top 

マイイベントリスナー：

window.addEventListener 'click', (event) -> 
    event.preventDefault() 
    mouse.position.set event 
    console.log "#{mouse.position.x} - #{mouse.position.y}" 

エラーメッセージ：

TypeError: undefined is not an object (evaluating 'this.position.x = event.clientX - boundaries.left') 

何このコードは間違っていますか？

mouse = 
    position: 
    x: 0 
    y: 0 
    set: (event) -> 
     boundaries = canvas.getBoundingClientRect() 
     mouse.position.x = event.clientX - boundaries.left 
     mouse.position.y = event.clientY - boundaries.top 

は、このキーワードを使用しないでください。

Answer 1

だから、私は答えを持っています。

• マウス .position.x
• マウス .position.y

と：：より良い適切なオブジェクト名を使用

canvas.addEventListener 'click', (event) -> 
    event.preventDefault() 
    mouse.position.set event 
    console.log "#{mouse.position.x} - #{mouse.position.y}" 

をええ、それが動作します。