CODEWITHSUNDEEP
javascriptjqueryhtmlxmlsvg
user4883426
user4883426

Reputation:

get svg element from an xml response

When i try to access the reponse xml i get errors. i want to access the svg firstly and then get the height and width of the svg viewbox or an alternative way. how can i access the svg from the response xml to get the height and width?

I want to access the height and width using javascript (maybe jquery) like so:

this._imageW = jQuery(".SVGImage").width(); this._imageH = jQuery(".SVGImage").height();

i am using a method to download the file and then give me the response in xml. idk how to access the elements withing the xml reponse thought.

enter image description here

this is the reponse above. i tried this in the console but doesn't work enter image description here

how can i access the height and width of the svg element?

Upvotes: 0

Views: 1179

Answers (1)

Stewartside
Stewartside

Reputation: 20905

You're going to want to parse the string c into HTML using the jQuery function $.parseHTML().

From that, you will then have a variable which can be accessed by your getElementByX() calls and can find the SVG element you want.

var c = '<svg width="200px" height="100px" viewbox="0 0 100 50"> <path d="M50,35 a20,20 0 1,0 0,-20 a20,20 0 1,0 0,20z" fill="white" stroke="black"></path> </svg>'

var html = $.parseHTML(c);

$('#width').html($(html).attr('width'));

$('#height').html($(html).attr('height'));

$('#output').html($(html));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Height: <span id="height"></span>
</p>
<p>Width: <span id="width"></span>
</p>

<div id="output"></div>

Upvotes: 2

Related Questions