detector de eventos en lienzo en el problema html5

Question

Soy nuevo en html5, quiero crear un detector de eventos en mi mouse, he escrito el siguiente código, pero no puedo entenderlo, no puedo crear el detector de eventos en mi elemento de lienzo, por favor ayuda

     var canvasDiv = document.getElementById('canvas');
     canvas_simple = document.createElement('canvas');
     canvas_simple.setAttribute('height', canvasHeight);
     canvas_simple.setAttribute('id', 'canvasSimple');
     canvasDiv.appendChild(canvas_simple);
     if(typeof G_vmlCanvasManager != 'undefined')
     {
     canvas_simple = G_vmlCanvasManager.initElement(canvas_simple);
     }
     context_simple = canvas_simple.getContext("2d");
    context_simple.addEventListener('mousemove', ev_mousemove, false);

A la luz de una respuesta, también quiero darme el código de escucha de eventos, puede ser que también tenga un error.

  var started = false;
  function ev_mousemove (ev) {
  var x, y;

   if (ev.layerX || ev.layerX == 0) { // Firefox
  x = ev.layerX;
  y = ev.layerY;
  } 
  else if (ev.offsetX || ev.offsetX == 0) { // Opera
  x = ev.offsetX;
  y = ev.offsetY;
  }
  if (!started) {

  context.beginPath();
  context.moveTo(x, y);
  started = true;
  }
  else {
    context.strokeStyle = "#df4b26";
    context.lineJoin = "round";
    context.lineWidth = 10;
    context.lineTo(x, y);
    context.stroke();
     }

}

Answer 1

Desea agregar el evento a su lienzo, no al contexto 2D:

canvas_simple.addEventListener('mousemove', ev_mousemove, false);

Aquí hay una demostración: JSFIDDLE LINK

Answer 2

Hay algunos errores:

• No puede adjuntar el oyente al contexto, los oyentes solo se pueden adjuntar: un solo nodo en un documento, el documento en sí, una ventana o una XMLHTTPRequest. Por lo tanto, debe adjuntarlo al elemento de lona.

• No puedes anidar lienzo

• La propiedad Canvasheight no está definida

Creé un jsfiddle con su ejemplo modificado y funcionando -> aquí