I found out that we can use multiple cameras!
I would like to use this feature to make an overlay camera that renders certain
objects only. This way I could implement a 3D-GUI without the need of CSS.
Masking objects for different cameras is in our roadmap, not sure when it will land at the moment.
One way you can do this is to move or point the UI camera away from the main scene so that it doesn’t render anything else. Set the clear color to have an alpha value and then use the camera priority setting to render one camera in front of the other.
if you’re adding renderables as custom pc.Command(), you can add this line in callback function (here is example with SpriteRenderer script):
var command = new pc.Command(pc.LAYER_HUD, this.blendType, function () {
var entity = this.entity,
camera = this.cameraEntity;
// check if current rendering camera is the one your custom renderable is assigned with.
if (entity.enabled && (camera && camera.camera ? camera.camera.data.isRendering : true)) {
// render something here.
}
}.bind(this));