createCanvas(400, 400);

}

​

function draw() {

  background(255,255,100);

  stroke(0);

  noFill();

  DrawGrid(400, 20);

  noStroke();

  fill(0);

  textSize(16);

  text(coord(mouseX), mouseX, mouseY);

}

​

function coord(gridx) {

  var graphx = map(gridx, 0, 400, -10, 10);

  return graphx;

}

​

function DrawGrid(MAX,SPACING) {  

  for (var g = 0; g < MAX; g = g + SPACING) {

    strokeWeight(1);

    line(g, 0, g, MAX);

    line(0, g, MAX, g);

  }

  // setting up the mid-point lines

  strokeWeight(3);

  line(0, MAX/2, MAX, MAX/2);

  line(MAX/2, 0, MAX/2, MAX);

}

​