I'm playing around with the SVG tutorial here, and can't load an image. XAMPP is giving me an error that says
This XML file does not appear to have any style information associated with it. The document tree is shown below.
I've copypasta'd from the docs, but it still doesn't work. Code below:
<?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="5cm" height="4cm" version="1.1" xmlns="localhost" xmlns:xlink= "localhost/svgtest"> <image xlink:href="My_Image.jpg" x="0" y="0" height="50px" width="50px"/> </svg>
Googling the error message tells me that the XML is broken somehow, but I haven't changed anything but the locale and image title.
If you are trying to use SVG like <img src="image. svg"> or as a CSS background-image , and the file is linked to correctly and everything seems right, but the browser isn't displaying it, it might be because your server is serving it with an incorrect content-type.
From IE9 and above you can use SVG in a ordinary IMG tag..
SVG images can be written directly into the HTML document using the <svg> </svg> tag. To do this, open the SVG image in VS code or your preferred IDE, copy the code, and paste it inside the <body> element in your HTML document.
Chrome was the first browser to launch with native SVG support from the beginming.
You got the namespaces wrong.
change
xmlns="localhost" xmlns:xlink= "localhost/svgtest"
to
xmlns="http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink"
Maybe you should have a look at this Namespaces Crash Course by MDN.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With