hello,

i try to implement this 2d interface in order to use it in a 3d project.
I know that i have to use screenX and screenY but i don't understand how it function. If i put this sketch in P3D, the rectangle are not picking correctly, there is a gap between the target and the coordinate of my computer mouse. Here the code :

//press "i" to draw the grid
boolean show = false;
boolean Switch = false;
int cellsize = 15;
int COLS, ROWS;
int[][] board;

void setup()
{
 size(800, 500);
 smooth();
 //initialize rows, columns and set-up arrays
 COLS = width/cellsize;
 ROWS = height/cellsize;
 board = new int[COLS][ROWS];
 background(0);
 //call function to fill array with random values 0
  for (int i =0;i < COLS;i++) {
   for (int j =0;j < ROWS;j++) {
     board[i][j] = 0;
   }}
 frameRate(30);
}

void draw()
{
 background(0);
 if(key=='i') show = true;
 else show = false;
 if(show){
 grid();
 render();
  }}

void grid() {
 for (int a=0; a<=COLS; a++) {
   for (int b=0; b<=ROWS; b++) {
     stroke(0, 0, 255, 45);
     //stroke(15);
     noFill();
     rectMode(CENTER);
     rect(a*cellsize, b*cellsize, cellsize, cellsize);
     }}}

void render() {
 for ( int i = 0; i < COLS;i++) {
   for ( int j = 0; j < ROWS;j++) {
     if ((board[i][j] == 1)) {
       fill(255);
       noStroke();
       rect(i*cellsize,j*cellsize,cellsize,cellsize);
     }}}}
void mousePressed() {
 if (mouseX<width && mouseX >0 && mouseY <height && mouseY > 0) {
  int new_x;
 int new_y;
 
 new_x = mouseX/cellsize;
 new_y = mouseY/cellsize;

if(Switch) Switch = false;  
else if(!Switch) Switch = true;

if(Switch)
board[new_x][new_y] = 1;
else  board[new_x][new_y] = 0;
 }}