Skip to content

Instantly share code, notes, and snippets.

Last active February 22, 2020 09:21
  • Star 2 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
External SVG
license: gpl-3.0
<!DOCTYPE html>
<meta charset="utf-8">
<script src=""></script>
d3.xml("rect01.svg").mimeType("image/svg+xml").get(function(error, xml) {
if (error) throw error;
Display the source blob
Display the rendered blob
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Copy link

fcsds commented Feb 4, 2016

Question: How do I add other svg objects on top of the rectangle?

Copy link

How i can put SVG external file with"#mysvg").append()... ?

Copy link


I know the question is kinda far in the past but perhaps it'll help someone:

The way I did it was (note that this is d3v5):

        d3.svg('external.svg').then((svg) => {
            //the external svg looks like this: [...]<svg><g>[...]</g></svg> so I select the g element and inject it into my svg
            const gElement ='g'); 

With it did not work in my case.
I don't know if my approach is best practice but it certainly works.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment