vasturiano / globe.gl

UI component for Globe Data Visualization using ThreeJS/WebGL
https://vasturiano.github.io/globe.gl/example/world-population/
MIT License
1.99k stars 298 forks source link

Directional Light Helper not showing up. #63

Closed franciscosierra1915 closed 2 years ago

franciscosierra1915 commented 2 years ago

Hello,

I'd like to see the position of the directional light in my scene, but I can't make it show up. This is my code:

<script>

    const world = Globe()
      .globeImageUrl('./earth.jpg')
      .bumpImageUrl('./earth_bump.png')
      .pointOfView({lat:35.44,lng:-99.21,altitude:1.5}, 1000)
      (document.getElementById('globeViz'));

    const globeMaterial = world.globeMaterial();
    globeMaterial.bumpScale = 5;
    new THREE.TextureLoader().load('./earth_specular.jpg', texture => {
      globeMaterial.specularMap = texture;
      globeMaterial.specular = new THREE.Color('#ccc');
      globeMaterial.shininess = 25;
    });

    setTimeout(() => {
      const scene = world.scene();
      const directionalLight = scene.children.find(obj3d => obj3d.type === 'DirectionalLight');
      const helper = new THREE.DirectionalLightHelper(directionalLight, 100);
      scene.add(helper);

    }, 2000);
  </script>
vasturiano commented 2 years ago

@franciscosierra1915 thanks for reaching out.

I've just plugged a helper like yours into the custom globe styling example, and it worked:

Screenshot 2021-09-06 at 20 53 08

Have you not managed to get it to work?

franciscosierra1915 commented 2 years ago

I got it working! Thanks so much for your help!