Image GUI control using SVG with opaque background renders as transparent background

Questions
, ,
1

Hi everyone, I’m looking for some help understanding how the GUI Image control works when the source image is an SVG.

My babylon version: 5.57.1

I’ve created a simple Image GUI control and am passing in the SVG image as the url. The image does render and I’m using the autoScale property to make it fit properly within the parent StackPanel.

The problem I’m trying to debug is the background color of the SVG. It has a white background fill color defined in the SVG while the SVG content itself is black.

When the image is rendered, its taking the white background and rendering it as transparent. Is it possible to have the image render the white background as defined in the SVG file?

I did test a few other colors with mixed results. Changing the background fill color in the SVG file to blue renders a blue background as expected. Using a color close to white renders it as transparent though.

Is this expected?
Is it possible to have the image render the SVG with a white background color?

I am still waiting on a teammate to finish some other debugging related to lighting and post processing and if that ends up being the cause of the issue I will report back here.

2

Well it looks like this is being caused by the post processing happening in the scene. Specifically the Tone mapping property. Disabling tone mapping appears to have fixed the color.

If I am still having issues with the image color after the lighting and post processing squared away in the project I will follow up here.