firtoz / react-three-renderer

Render into a three.js canvas using React.
https://toxicfork.github.com/react-three-renderer-example/
MIT License
1.49k stars 155 forks source link

Animation by this.refs.scene #148

Closed Ongoza closed 7 years ago

Ongoza commented 7 years ago

if I create box in this way

componentDidMount(){
            var geometry = new THREE.BoxGeometry( 1, 1, 1 );
            var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
            var cube = new THREE.Mesh( geometry, material );
            cube.rotation=this.state.cubeRotation;
            this.refs.scene3d.add( cube );
}

It works. Then I want animate it

  onAnimate(){
      var rot =  new THREE.Euler(Math.random()*2,0, 3);
      this.setState({ cubeRotation:rot });
  }

but it doesn't work I know that I can create box in this way

      <mesh rotation={this.state.cubeRotation}>
        <boxGeometry width={1} height={1} depth={1} />
        <meshBasicMaterial  color={0x00fff0}  />
      </mesh>

But I have to create some meshes runtime and animate it. Can you help?

Ongoza commented 7 years ago

Sorry, I found. It works with this.refs.scene3d.cube.rotation.set(x,y,z);