directional light not working

[vorth]

I've made a simple change to the interactive example, adding an ambient light and a directional light, and switching to MeshLambertMaterial. The ambient light seems to work, while I cannot get the directional light to work.

Using MeshNormalMaterial confirms that there are no problems with the normals.

I'm sure I'm doing something wrong, but I could not find any examples of lighting in the samples.

The light declarations:

var AmbientLight = React.createClass({
  displayName:'AmbientLight',
  render: function() {
    return React.createElement(ReactTHREE.AmbientLight,
      {
        color:0x888888
      });
  }
});

var DirectionalLight = React.createClass({
  displayName:'DirectionalLight',
  render: function() {
    return React.createElement(ReactTHREE.DirectionalLight,
      {
        color:0xffffff,
        intensity: 1
      });
  }
});

The scene change:

React.createElement(ReactTHREE.Scene,
                          {pointerEvents: ['onClick', 'onMouseMove'], background:0x202020, camera:'maincamera'},
                          [
                            React.createElement(OrbitCamera, {key:'camera', distance:600, azimuth:this.state.cameraazimuth, aspectratio:this.state.width / this.state.height}),
                            React.createElement(RemovableCubes, {key:'cubes', cubes:this.props.cubes}),
                            React.createElement(CubeAppButtons, {key:'gui'}),
                            React.createElement(DirectionalLight, {key:'directional'} ),
                            React.createElement(AmbientLight, {key:'ambient'} )
                          ]
                         ));

[Izzimach]

You need to specify the direction of the directional light using the position prop. If you specify no direction it will use 0,0,0 which won't show anything.

    var DirectionalLightElement = React.createElement(
      ReactTHREE.DirectionalLight,
      {
        color: 0xffffffff,
        intensity: 1.0,
        position: new THREE.Vector3(0, 0, 1)
      }
    );

[vorth]

Thank you, that did the trick. I was expecting defaults to work as in three.js.