How to setup dynamic resize with SVG

[vinzent]

Hi,

I made very good looking (well, to me ...) svg panels.
The svg items were created with inkscape.
Everything works fine except when adding new panels or viewing the report with a lower resolution screen : the svg does not resize to fit the new space it has.

Please find a picture that summarize my issue.
On top the two panels with 2 svgs (+ the viewbox params for each) : looks fine !
Below, the result after adding 2 more panels : the svgs on the left does not resize and then are truncated.

Your suggestions will be extremely appreciated.
I'm now very close to be fully "proficient" in creating svgs reports. 😉
I had to obfuscate some items on the svgs (purple rectangles), sorry for that.

Thanks

Vince

[msivill_splunk]

Could you share a cut down stand-alone example using SPL with | makeresults so people can try things remotely? Can you replace the SVG image with a simple rectangle and still replicate the issue?

Also make sure in the SVG text there isn't any width or height sizing set, using viewbox sizing dimension is OK. In the new version of the SVG app images can be made to fill the HTML space without defining a viewbox in parameters, that may help.

When I build SVG images externally I try to make sure that image starts in the top left corner so I don't need to get into setting Min-X and Min-Y

Could you tag the question (if possible) with "Scalable Vector Graphics - Custom Visualization" so it's tied to the app that way as well. I originally missed this question.