Creating a Game in Three.js do i share camera, scene objects?

Question

Im creating a game with React and Three.js and vanilla Javascript, i have several clases, representing objects in the game, do i need to create a camera, scene, renderer for each class or i simply share the canvas for every class?

Answer 1

So i found some code and implemented it to my own needs, i have also added Physics with cannon-es, but anything is posible.

import * as THREE from 'three';

import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
import * as CANNON from 'cannon-es'

class Floor{
  constructor(game, world){
    this.assetsPath = game.assetsPath;
    //this.loadingBar = game.loadingBar;
    this.game = game;
    this.scene = game.scene;
    this.init(world);
    this.tmpPos = new THREE.Vector3();
  }

  /*
  get position(){
    if (this.plane!==undefined) this.plane.getWorldPosition(this.tmpPos);
    return this.tmpPos;
  }

  set visible(mode){
    this.plane.visible = mode;
  }
  */
  init(world){
    const textureLoader = new THREE.TextureLoader()
    const texturePlane = textureLoader.load(
        './AiCourse Models/Texturas/grass.jpg',
        () =>
        {
          console.log('loading finished')
        },
        () =>
        {
          console.log('loading progressing')
        },
        () =>
        {
          console.log('loading error')
        }
    )


    const geometry  = new THREE.PlaneGeometry(1000,1000,400)
    const material  = new THREE.MeshBasicMaterial({map: texturePlane})
    const floor = new THREE.Mesh( geometry, material )
    floor.receiveShadow = true
    floor.rotation.x = - Math.PI * 0.5
    this.scene.add(floor)

    const floorBody = new CANNON.Body()
    const floorShape = new CANNON.Plane()
    floorBody.mass = 0
    floorBody.addShape(floorShape)
    floorBody.quaternion.setFromAxisAngle(new CANNON.Vec3(- 1, 0, 0), Math.PI * 0.5)
    world.addBody(floorBody)

  }

  update(time){
    world.step(1 / 60, deltaTime, 3)
  }
}

export { Floor };

This way i pass game data to any class/component i wish, i was attempting to do it in a similar way. Hope this helps someone. In the class constructor i pass all game class data, a game class returning this data in the constructor will do (that is scene object, renderer, camera etc) simply pass this keyword in class. For the Physics with cannon, create a global world variable and set it up (establish gravity, etc) Well at least this is my solution but it works.