<canvas id ="cvs48" width ="300" height = "300 onclick="gereclick(event)">
      votre navigateur n'accepte pas Canvas
</canvas>
<script>
var canv3 = document.getElementById('cvs48');
var context3 = canv3.getContext('2d');
function gereclick(event) {
   var XYrect = canv3.getBoundingClientRect();    // action avec le canvas et pas le context
   var Xcurseur = Math.round(event.clientX - XYrect.left);
   var Ycurseur = Math.round(event.clientY - XYrect.top);
   context3.fillStyle= ' rgb('+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+')' ; // = rgb ( R,V,B) (choix aléaloire)
   context3.beginPath();
   context3.arc(Xcurseur, Ycurseur, Math.random()*20,0, Math.PI*2);// =rayon aléaloire
   context3.fill();
   };
  </script>

cliquez la souris dans le cadre ci-dessous!