How do I rotate BoundingBox?

Help & Support
1

Hello, I’m Hizard. It’s been a long time.

I came to ask because I couldn’t solve it alone.

var CollisionTest = pc.createScript('collisionTest');

CollisionTest.attributes.add('colEntity', { type: 'entity', title: 'Collision Entity'});

// initialize code called once per entity
CollisionTest.prototype.initialize = function() {
    this.groundShape = new pc.BoundingBox(this.colEntity.collision.getShapePosition().clone(), this.colEntity.collision.halfExtents.clone());
};

CollisionTest.prototype.update = function(dt) {
    this.groundShape.center.copy(this.colEntity.collision.getShapePosition());
    this.app.drawWireAlignedBox(this.groundShape.getMin(), this.groundShape.getMax(), pc.Color.GREEN);
};

CollisionTest.prototype.getBoundingBox = function() {
    return this.groundShape;
}
  • This code shows the size of the bounding box at runtime.
  • The bounding box obtains the size of the collisions.
this.entity.rotate(0, 90, 0);
  • Use this function to rotate the entity.

Result:

12
12861×662 121 KB

11
11785×698 118 KB

According to the results, the entity rotates, but the bounding box does not rotate.
If you’ve solved a problem like this, please help.

2

This function only draws aligned box.
To draw other shapes, you should use drawLines or drawLineArrays to build them out of lines.

2 Likes
3

Thanks. I made it using drawLines method, but it’s same result.

var CollisionTest = pc.createScript('collisionTest');

CollisionTest.attributes.add('colEntity', { type: 'entity', title: 'Collision Entity'});

// initialize code called once per entity
CollisionTest.prototype.initialize = function() {
    this.groundShape = new pc.BoundingBox(this.colEntity.collision.getShapePosition().clone(), this.colEntity.collision.halfExtents.clone());
};

CollisionTest.prototype.update = function(dt) {
    this.groundShape.center.copy(this.colEntity.collision.getShapePosition());
    //this.app.drawWireAlignedBox(this.groundShape.getMin(), this.groundShape.getMax(), pc.Color.GREEN);

    var p1 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p2 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));
    var p3 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p4 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));

    var p5 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p6 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));
    var p7 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p8 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));


    // upper
    this.app.drawLines([p1, p2], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p1, p3], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p3, p4], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p2, p4], [pc.Color.RED, pc.Color.WHITE]);
    
    // lower
    this.app.drawLines([p5, p6], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p5, p7], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p7, p8], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p6, p8], [pc.Color.RED, pc.Color.WHITE]);

    //pillar
    this.app.drawLines([p1, p5], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p2, p6], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p3, p7], [pc.Color.RED, pc.Color.WHITE]);
    this.app.drawLines([p4, p8], [pc.Color.RED, pc.Color.WHITE]);
};

CollisionTest.prototype.getBoundingBox = function() {
    return this.groundShape;
}

3
3691×601 105 KB

4

You need to get world transform from the entity using getWorldTransform() and transform your points by it using Mat4.transformPoint()

5 
    this.groundShape.center.copy(this.colEntity.collision.getShapePosition());
    //this.app.drawWireAlignedBox(this.groundShape.getMin(), this.groundShape.getMax(), pc.Color.GREEN);
    var wt = this.colEntity.getWorldTransform();

    var p1 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p2 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));
    var p3 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p4 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));

    var p5 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p6 = this.groundShape.center.clone().add(new pc.Vec3(this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));
    var p7 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, this.groundShape.halfExtents.z));
    var p8 = this.groundShape.center.clone().add(new pc.Vec3(-this.groundShape.halfExtents.x, -this.groundShape.halfExtents.y, -this.groundShape.halfExtents.z));

    p1 = wt.transformPoint(p1);
    p2 = wt.transformPoint(p2);
    p3 = wt.transformPoint(p3);
    p4 = wt.transformPoint(p4);

    p5 = wt.transformPoint(p5);
    p6 = wt.transformPoint(p6);
    p7 = wt.transformPoint(p7);
    p8 = wt.transformPoint(p8);

    ...

4

Something’s wrong, isn’t it? :sweat_smile:

6

I don’t think there’s a way to rotate the bounding box.
Whenever the object rotates, even if I draw a new bounding box, the rotation values are not applied.

Anyone no idea? :frowning: