Is there an easy way to add an svg file to a svg image created by D3

Community Help
1

Is there an easy way to add an svg file to a svg image created by D3.

I have this svg image created using D3 and I i’m trying to add another layer (group) to that image which is an svg image.

I think I need to take the body of the svg image file (it’s a group) and append it to a new group in my svg cell. But not sure of the best way to do that. And I think I have also to address scaling issues and the svg file looks small when I load it into a cell, but if I mess with the styles with the ‘style width’ then the transform needed is huge.

(mock up of problems)

2

Remove the height attribute from your SVG, then it should scale correctly (based on the aspect ratio given by the viewBox attribute).

Also note that you can nest <svg> elements inside other <svg> elements, so there may be no need to take your SVG image apart.

1 Like
3

Thanks @mootari that helped a lot. Appending the svg as a svg:image let me embed the svg inside a svg.

updated: experiment code example.

1 Like