Support the viewBox property in <symbol> tags
I found what appears to be a common use-case which you seem to be able to support but don't:
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200">
<symbol id="s" viewBox="0 0 200 200">
<circle cx="100" cy="100" r="100" />
</symbol>
<use xlink:href="#s" />
</svg>
The expected result is a black circle filling the entire image. The actual result is an empty image.
If I delete the viewBox
property everything renders correctly.
If I replace the symbol
with a nested svg
element it also works, i.e.:
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200">
<defs>
<svg id="s" viewBox="0 0 200 200">
<circle cx="100" cy="100" r="100" />
</svg>
</defs>
<use xlink:href="#s" />
</svg>
It also supports a viewport which is different than the viewport of the entire image, and knows how to scale things.
It appears that you have the logic to handle <symbol viewBox="">
, it's just not hooked up or something. But I haven't looked at the code yet so I can't say for sure.
Btw, is it complicated to contribute a PR?
Edited by Snir