Tenho um canvas dividido em duas partes, e a função abaixo:
function clicouNoCanvas(evento) {
var x = evento.pageX - tela.offsetLeft;
var y = evento.pageY - tela.offsetTop;
if( x < 300) {
if( y < 400) {
var cor = "yellow";
corEscolhida.push(cor);
c.fillStyle =corEscolhida ;
c.beginPath();
c.arc(x, y, 10, 0, 2*3.14);
c.fill();
} }
console.log("posicao do clique : " + x + " , " + y);
Como faço para na outra metade da tela (x entre 300 e 600p.ex) o clique do mouse printar bolas vermelhas?