spotLight is not defined

Questions
1

so my 2nd and 3rd spot lights are undefined for some reason?
works if i remove spotLight2 and 3 but why?

// global
var camera, flashLight, spotLight, spotLight2, spotLight3;

 const fov = 65;
    const aspect = window.innerWidth / window.innerHeight;
    const near = 1.0;
    const far = 230;
    this._camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
    this._camera.position.set(0, 0, 0);
camera = this._camera;


	flashLight = new THREE.Mesh(new THREE.CylinderGeometry(1, 1, 7, 20), new THREE.MeshPhongMaterial({color:0x000000}));
			flashLight.rotateX(Math.PI/2);
		camera.add(flashLight);

			spotLight = new THREE.SpotLight(0xffffff, 0.5, 150);
			spotLight.power = 4000;
			spotLight.angle = 0.5;
			spotLight.decay = 2;
			spotLight.penumbra = 0.1;
			spotLight.distance = 200;
			spotLight.castShadow = true;
			spotLight.rotateX(Math.PI/2);

     spotLight2 = new THREE.SpotLight(0xCCCCCC, 0.5, 150);
			spotLight2.power = 2000;
			spotLight2.angle = 0.55;
			spotLight2.decay = 2;
			spotLight2.penumbra = 0.1;
			spotLight2.distance = 200;
			spotLight2.castShadow = true;
			spotLight2.rotateX(Math.PI/2);
      
      spotLight3 = new THREE.SpotLight(0xFFFFFF, 0.5, 150);
			spotLight3.power = 4000;
			spotLight3.angle = 0.6;
			spotLight3.decay = 2.5;
			spotLight3.penumbra = 0.1;
			spotLight3.distance = 200;
			spotLight3.castShadow = true;
			spotLight3.rotateX(Math.PI/2);
      
      flashLight.add(spotLight);
			flashLight.add(spotLight.target);
			flashLight.add(spotLight2);
			flashLight.add(spotLight2.target);
      flashLight.add(spotLight3);
			flashLight.add(spotLight3.target);

animate:

flashLight.position.copy(camera.position);
			flashLight.position.x += 2;
			flashLight.position.y -= 3;
			flashLight.position.z -= 1;

any idea’s?

2

I don’t know what causing it, but positions don’t like integer. Try this:

flashLight.position.copy(camera.position);
			flashLight.position.x += parseFloat(2);
			flashLight.position.y -= parseFloat(3);
			flashLight.position.z -= parseFloat(1);

else try to set them all to 0 to see if something changed.

3

spotLight2 undefined

4

You add the flashLight befor you defined you spotlights ! Add the flashLight to the camera AFTER you defined your spotlights !?

5 

	flashLight = new THREE.Mesh(new THREE.CylinderGeometry(1, 1, 7, 20), new THREE.MeshPhongMaterial({color:0x000000}));
			flashLight.rotateX(Math.PI/2);
	// original	camera.add(flashLight);

			spotLight = new THREE.SpotLight(0xffffff, 0.5, 150);
			spotLight.power = 4000;
			spotLight.angle = 0.5;
			spotLight.decay = 2;
			spotLight.penumbra = 0.1;
			spotLight.distance = 200;
			spotLight.castShadow = true;
			spotLight.rotateX(Math.PI/2);

  spotLight2 = new THREE.SpotLight(0xCCCCCC, 0.5, 150);
			spotLight2.power = 2000;
			spotLight2.angle = 0.55;
			spotLight2.decay = 2;
			spotLight2.penumbra = 0.1;
			spotLight2.distance = 200;
			spotLight2.castShadow = true;
			spotLight2.rotateX(Math.PI/2);
      
      spotLight3 = new THREE.SpotLight(0xFFFFFF, 0.5, 150);
			spotLight3.power = 4000;
			spotLight3.angle = 0.6;
			spotLight3.decay = 2.5;
			spotLight3.penumbra = 0.1;
			spotLight3.distance = 200;
			spotLight3.castShadow = true;
			spotLight3.rotateX(Math.PI/2);
      
      flashLight.add(spotLight);
			flashLight.add(spotLight.target);
			flashLight.add(spotLight2);
			flashLight.add(spotLight2.target);
      flashLight.add(spotLight3);
			flashLight.add(spotLight3.target);
      
      // added 
     camera.add(flashLight);

still undefined funny enough it works with spotLight but returns undefined for spotLight2 and spotLight3
i can see no errors either

6

i really don’t understand why it is working for first spotlight but non of the others it really doesnt make any sense

7

Did you try just to use one of the others ? temporarily deactivated

spotLight1 and spotLight3

to see if spotLight2 works?

EDIT:

???

var spotLight1;
var spotLight2;
var spotLight3;
8

yep tried using spotlight 2 and 3 on their own but get undefined even changed the var names still didn’t work it only works when the var is spotLight its weird
my vars are definded in the same exact place:
// global
var camera, flashLight, spotLight, spotLight2, spotLight3;

9

Maybe this can help:

spotLight.target.position issue

1 Like