I’m working on a webgl based image generator. To save the canvas as an image i’m resizing it and using the canvas.toDataURL. Now everything is working fine I just noticed a slight difference on the bloom rendering. It seems like the radius is not applied on the resized/big canvas as on the smaller one. I tried rendering more frames after resizing and before saving but I’m not able to recreate the same image for the export.
My canvas resizing code
ocamera.left = -canvasWidth / 2; ocamera.right = canvasWidth / 2; ocamera.top = canvasHeight / 2; ocamera.bottom = -canvasHeight / 2; ocamera.updateProjectionMatrix(); bloomPass.setSize(canvasWidth, canvasHeight); renderer.setSize(canvasWidth, canvasHeight); composer.setSize(canvasWidth, canvasHeight); drawTarget.setSize(canvasWidth, canvasHeight); fMesh.scale.set(canvasWidth, canvasHeight, 1);
An example image so you can see the difference. Left is the smaller size, right is the resized/big canvas that I want to save as an image. You can see in the left image the black is not fully black as the bloompass overlays it.