Still Can't Group Physijs Objects

‹prev | My Chain | next›

I ran into a bit of a problem in my Three.js / Physijs game yesterday. I had hoped to use a generator to create segments of a river. Normally in Three.js, I would group all of the components (water, left and right river banks) inside a THREE.Object3d() object to make for easier positioning and rotation. But I found yesterday that Physijs ignores my Object3d river segment and everything grouped inside.

The obvious solution is to manually position each of the individual parts. And I almost get started down that path. But then I wonder...

Is there a way to register the component parts manually?

I continue to add the result of the riverSegment() generator function to the Physijs scene:

function init() {
  // ...
  scene = new Physijs.Scene;
  // ...
  // River
  scene.add(riverSegment());
  // ...
}

In the add() method on the Physijs.Scene prototype, it seems as though I might be able to get away with marking a grouping object with _physijs to make this work:

 Physijs.Scene.prototype.add = function( object ) {
  THREE.Mesh.prototype.add.call( this, object );
  
  if ( object._physijs ) {
      // ...
   if ( object.children.length ) {
    object._physijs.children = [];
    addObjectChildren( object, object );
   }
      // ...
    }
  }

So I mark my Object3D group as a Physijs container:

function riverSegment() {
  var segment = new THREE.Object3D();
  segment._physijs = true

  // Add water and two banks to segment

  return segment;
}

Not surprisingly, that does not work right away. I get the following error from line 336 of physi.js:

Uncaught TypeError: Cannot call method 'push' of undefined

After working through that and another couple of messages, I find that I at least need to decorate my group with the following Physijs properties:

  segment._physijs = {
    children: [],
    touches: 0
  };
  segment.material = {};

Unfortunately, I am still left with an error on line 1801 of ammo.js:

Uncaught TypeError: Cannot read property 'a' of undefined 

Bah! Ammo.js is uglified code, so I am going to be hard pressed to figure out what that problem is. And it is a problem because my raft can shoot right though the river banks:

The last thing that I try along these lines is to add the pieces children of my Object3D individually:

  river_segment = riverSegment();
  river_segment.position.z = 100;
  river_segment.position.x = 100;
  river_segment.rotation.y = Math.PI/8;
  while (river_segment.children.length > 0) {
    var child = river_segment.children[0];
    child.__dirtyPosition = true;
    child.__dirtyRotation = true;
    scene.add(child);
  }

That works in that the banks will again bounce the raft back to the middle of the river. What does not work is the positioning of the entire river segment. Above, I tried to re-position and rotate the segment, but it is positioned vertically in the center of the screen:

Ah well, it was worth a shot. Tomorrow, unless I get a brainwave (or external help), I will repurpose the segment function to generate a segment and place the individual pieces on the scene. That is not at all ideal, but it (hopefully) will not cause too many problems.


Day #484