title: Threejs & PhysiJs physics engine not updated when Mesh rotate
body: <p>I am a beginner of Threejs.</p>
  
  <p>I created a Box Mesh and a Sphere Mesh and applied physics using physiJs.
  What I want to do is to hit the ball when the Box Mesh rotates and passing through the ball.
  However, when the box mesh rotates, it passes without hitting the ball.
  I think the box mesh loses physicality when it starts spinning.</p>
  
  <pre><code>function createBall () {
      var ball = null;
      var ballGeo = new THREE.SphereGeometry(1.5, 30, 30);
      var ballMat = Physijs.createMaterial(
          new THREE.MeshBasicMaterial({specular: 0x111111})
          , 0.3, 0.1
      );
      ball = new Physijs.SphereMesh(
        ballGeo,
        ballMat,
        5
      );
      ball.position.set(30, 10, 0);
      scene.add(ball);
  }
  function createBox () {
      var material = Physijs.createMaterial(
          new THREE.MeshLambertMaterial(
              {
                  color: 0x8041D9,
              }), 5, 0.3);
  
      var boxMesh = new THREE.BoxGeometry(5, 5, 25);
      box = new Physijs.BoxMesh(
          boxMesh,
          material,
          5
      );
      box.position.z = 20;
      scene.add(box);
  }
  function createHeightMap() {
      var initColor = new THREE.Color( 0x00ff00 );
      initColor.setHSL( 0.25, 0.85, 0.5 );
      var ground_material = Physijs.createMaterial(
          new THREE.MeshPhongMaterial(
              { color: 0x47C83E}
          ),
          .5,
          .5
      );
  
      var ground_geometry = new THREE.PlaneGeometry(800, 800, 100, 100);
      ground = new Physijs.HeightfieldMesh(
          ground_geometry,
          ground_material,
          0, // 질량
          100, // PlaneGeometry 의 분할 세그먼트랑 똑같은 값으로 줘야 한다.
          100  // PlaneGeometry 의 분할 세그먼트랑 똑같은 값으로 줘야 한다.
      );
  
      ground.position.y = -10;
      ground.rotation.x = Math.PI / -2;
      ground.receiveShadow = true;
  
  
      var meshes = [];
      var controls = new function () {
          this.startRotate = false;
          this.addBall = function () {
              createBall();
          };
          this.addBox = function () {
              createBox();
          };
          this.clearMeshes = function () {
              meshes.forEach(function (e) {
                  scene.remove(e);
              });
              meshes = [];
          }
  
      };
  
      var gui = new dat.GUI();
      gui.add(controls, 'addBall');
      gui.add(controls, 'addBox');
      gui.add(controls, 'clearMeshes');
      gui.add(controls, 'startRotate').onChange(function (e) {
          isStartRoate = e;
      });
      return ground;
  }
  
  render = function () {
      stats.update();
      if (isStartRoate === true) {
          var rotateMatrix = new THREE.Matrix4();
          rotateMatrix.identity();
          rotateMatrix.makeRotationY(0.05);
          box.applyMatrix(rotateMatrix);
      }
      requestAnimationFrame(render);
      renderer.render(scene, camera);
      var axes = new THREE.AxesHelper(30);
      scene.add(axes);
      scene.simulate(undefined, 2);
  };
  
  function initStats() {
  
      var stats = new Stats();
  
      stats.setMode(0); // 0: fps, 1: ms
  
      // Align top-left
      stats.domElement.style.position = 'absolute';
      stats.domElement.style.left = '0px';
      stats.domElement.style.top = '0px';
  
      document.getElementById("Stats-output").appendChild(stats.domElement);
  
      return stats;
  }
  
  
  window.onload = initScene;
  </code></pre>
  
  <p>below is codepen link</p>
  
  <p><a href="https://codepen.io/jeonghu/pen/QZXQpv" rel="nofollow noreferrer">codepen</a></p>
  
  <p>It seems like physicality not updated.
  please give me any idea</p>