How can I render my camera on a texture?

Help & Support
1

Hi guys, I tried this code but this doesn’t seem to work properly:

var RenderLayerTotexture = pc.createScript('renderLayerTotexture');

RenderLayerTotexture.attributes.add("layerName", {type: "string"});

// initialize code called once per entity
RenderLayerTotexture.prototype.initialize = function() {
    // Create a 512x512x24-bit render target with a depth buffer
    var colorBuffer = new pc.Texture(this.app.graphicsDevice, {
        width: 512,
        height: 512,
        format: pc.PIXELFORMAT_R8_G8_B8,
        autoMipmap: true
    });
    colorBuffer.minFilter = pc.FILTER_LINEAR;
    colorBuffer.magFilter = pc.FILTER_LINEAR;
    var renderTarget = new pc.RenderTarget(this.app.graphicsDevice, colorBuffer, {
        depth: true
    });

    var layer = this.app.scene.layers.getLayerByName(this.layerName);
    layer.renderTarget = renderTarget;
};

var ApplyTexture = pc.createScript('applyTexture');
ApplyTexture.attributes.add("layerName", {type: "string"});

// initialize code called once per entity
ApplyTexture.prototype.postInitialize = function() {
    var layer = this.app.scene.layers.getLayerByName(this.layerName);   
    
    this.entity.element.texture = layer.renderTarget.colorBuffer;
};

I have applied the layer “Render” to both my camera and image by editor but it gives me the error “layer is null” even if I created and correctly wrote the layer name.

2

Hi @SaccoVinc,

I think the code you are using is older, using the renderTarget property on the layer level is deprecated. You should be using it on a camera component.

There is a render to texture engine example here: PlayCanvas Examples

3

Ok, thanks, I’ll give it a look.

1 Like