To access and manipulate SVG markup, you can treat it like any other XML file. If you need a javascript solution,
For example, in the javascript code snippet provided, the variable sMyString
contains the SVG content after parsing it using DOMParser
.
var sMyString = "<a id=\"a\"><b id=\"b\">hey!<\/b><\/a>";
var oParser = new DOMParser();
var oDOM = oParser.parseFromString(sMyString, "image/svg+xml");
// print the name of the root element or error message
console.log(oDOM.documentElement.nodeName == "parsererror" ? "Error while parsing" : oDOM.documentElement.nodeName);
When using PHP with SimpleXML, like in the following snippet, you can handle SVG content stored in $xmlstr
:
$movies = new SimpleXMLElement($xmlstr);
echo $movies->movie[0]->plot;
Below is a complete PHP example of extracting SVG data:
<?php
$xmlstr = '...'; // SVG content goes here
$xml = new SimpleXMLElement($xmlstr);
print '<pre>';
// Find and display relevant path data (example shown is specific to provided SVG content)
var_dump($xml->symbol->g->path);
print '<hr>';
print $xml->symbol->g->path['d'];
print '</pre>';
?>
If you want to see a JavaScript approach, check out my fiddle:
https://jsfiddle.net/tobiasbeuving/gyheqvfs/5/