backgroun trascinabile

Voglio ottenere qualcosa di simile a una resistenza infinita come quella di Konva js Qualcuno può aiutarmi in questo. Provo varie cose, ma non di loro erano ok. Sono nuovo in p5js e javascript. Per favore, per eventuali suggerimenti. Solo questo elemento mi impedisce di completare l'intero progetto.

var grid;
var current_img;
var BgCat1 = [];
var layerOne;
let show_grid = false;

Potrebbe esserci una soluzione più elegante, ma qui disegno una cella aggiuntiva su ciascun lato della griglia per gestire il wraparound, quindi una griglia 12x12 con 10x10 visibile. Guardalo correre qui: https://editor.p5js.org/rednoyz/full/uJCADfZXv

let dim = 10, sz;
let xoff = 0, yoff = 0;

function setup() {
  createCanvas(400, 400);
  sz = width/ dim;
}

function mouseDragged() {
  xoff += mouseX - pmouseX;
  yoff += mouseY - pmouseY;
}

function draw() {
  background(255);

  for (let i = 0; i < dim+2; i++) {
    for (let j = 0; j < dim+2; j++) {

      let x = ((xoff + j * sz) % (width+sz)) - sz;
      if (x < -sz) x += width+sz;

      let y = ((yoff + i * sz) % (height+sz)) - sz;
      if (y < -sz) y += height+sz;

      rect(x, y, sz, sz);
      text(i * 10 + j, x + sz/2, y + sz/2);
    }
  }
}