JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/three@0.139.2/build/three.min.js"></script>

CSS

body {
  margin: 0;
}

JavaScript

const SCREEN_WIDTH = window.innerWidth;
const SCREEN_HEIGHT = window.innerHeight;

let container;

let camera, scene, renderer;

let mouseX = 0,
  mouseY = 0;

const windowHalfX = window.innerWidth / 2;
const windowHalfY = window.innerHeight / 2;

init();
animate();


function init() {

  container = document.createElement('div');
  document.body.appendChild(container);

  camera = new THREE.PerspectiveCamera(35, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 5000);
  camera.position.z = 1500;

  scene = new THREE.Scene();
  scene.background = new THREE.Color(0xffffff);
  scene.fog = new THREE.Fog(0xffffff, 1500, 4000);

  // GROUND

  const imageCanvas = document.createElement("canvas");
  const context = imageCanvas.getContext("2d");

  imageCanvas.width = imageCanvas.height = 128;

  context.fillStyle = "#ffffff";
  context.fillRect(0, 0, 128, 128);

  context.fillStyle = "#ffffff";
  context.fillRect(0, 0, 64, 64);
  context.fillRect(64, 64, 64, 64);

  const textureCanvas = new THREE.CanvasTexture(imageCanvas);
  textureCanvas.repeat.set(1000, 1000);
  textureCanvas.wrapS = THREE.RepeatWrapping;
  textureCanvas.wrapT = THREE.RepeatWrapping;


  const materialCanvas = new THREE.MeshBasicMaterial({
    map: textureCanvas
  });

  const geometry = new THREE.PlaneGeometry(100, 100);

  const meshCanvas = new THREE.Mesh(geometry, materialCanvas);
  meshCanvas.rotation.x = -Math.PI / 2;
  meshCanvas.scale.set(1000, 1000, 1000);


  // PAINTING 1

  const callbackPainting = function() {

    const image = texturePainting.image;

    scene.add(meshCanvas);

    const geometry = new THREE.PlaneGeometry(100, 100);
    const mesh = new THREE.Mesh(geometry, materialPainting);


    addPainting(scene, mesh);

    function addPainting(zscene, zmesh) {


      zmesh.scale.x = image.width / 60;
      zmesh.scale.y = image.height / 60;
      zmesh.position.z = 300.0;
      zmesh.position.x = -215.0;
      zmesh.position.y = -80.0;

      zscene.add(zmesh);


      const floorHeight = -8 *...