Camera still renders to screen after setting CCCamera renderTexture

Cocos Creator
#1

Hi all,

According to the API for v. 2.4.3, the targetTexture property of CCCamera states: “Destination render texture. Usually cameras render directly to screen, but for some effects it is useful to make a camera render into a texture.”

I been working on a mini-map for my game and I am trying to have the minimap camera render to a texture. I’ve taken a look at the example cases found here and tried to replicate it in JavaScript - the example is using Typescript.

I’ll attach my code below but my problem is that although the RenderTexture is being instantiated and put into a Sprite node (via a sprite frame), the camera is still rendering to screen. Even when I implement the minimap-with-rendertexture.ts in the example case, it is still the same thing – the camera renders on screen. Is this a known issue or is there something I am not doing right or misunderstanding?

Thanks for your help. My code is below, which is attached to the Minimap camera itself.

cc.Class({
    extends: cc.Component,

    properties: {
        // All properties are properly set in the editor.
        camera: {
            default: null,
            type: cc.Camera
        },

        renderTextureSprite: {
            default: null,
            type: cc.Sprite,
        },
    },

    // LIFE-CYCLE CALLBACKS:

    onLoad () {
        // Mostly taken from the minimap-with-rendertexture.ts script
        let { width: canvasWidth, height: canvasHeight} = cc.Canvas.instance.node;
        let width = canvasWidth;
        let height = canvasHeight;

        this.renderTexture = new cc.RenderTexture().initWithSize(width, height);
    
        // should this mean the camera stops rendering to screen and onto the renderTexture instead?
        this.camera.targetTexture = this.renderTexture;

        // Even with these commented out, the camera is still rendering onscreen
        // let spriteFrame = new cc.SpriteFrame(this.renderTexture);
        // this.renderTextureSprite.spriteFrame = spriteFrame;

        let deviceWidth = canvasWidth, deviceHeight = canvasHeight;
        if (!CC_EDITOR) {
            deviceWidth = cc.game.canvas.width / cc.view._scaleX;
            deviceHeight = cc.game.canvas.height / cc.view._scaleY;
        }

        let node = this.renderTextureSprite.node;
        node.x = deviceWidth / 2 - width / 2;
        node.y = deviceHeight / 2 - height / 2;
        node.width = width;
        node.height = height;
    },

    update (dt) {
        this.camera.node.position = cc.v2(0, 0);
        this.camera.orthoSize = 360;
    },
});
#2

I found out what was wrong & it was the dumbest thing. Guess you can’t chain CCRenderTexture objects. So, in the onLoad function, I instantiated it, thinking you can chain it with .initWithSize(). It was failing silently so I couldn’t understand why the camera was still rendering on-screen.

Turns out it worked when put initWithSize function on a separate line:
this.renderTexture = new cc.RenderTexture();
this.renderTexture.initWithSize(width, height)

#3