CODEWITHSUNDEEP
javascriptd3.jssvg
Peekyou
Peekyou

Reputation: 471

Get svg image real size after resizing

I have a picture in a svg tag. When I change the width (or the height) of the image, the height (or the width) also changes to keep the ratio. But I am not able to get the new value of the height (or the width).

Here an example : https://plnkr.co/edit/NrovrUKAv8KRGLPdjDpG?p=preview

We can see that although the width and the height are reduced, only the width value changes. I tried to get the height using d3js, but value is still the same.

d3.select("image").attr("height")

Upvotes: 2

Views: 174

Answers (1)

SiddP
SiddP

Reputation: 1663

Although it appears to be height of the image is dropping but it actually is not its just the way it spread across with changing width * 219 just to auto adjust into the frame. All more with a simple example what happens when try to make a 800*600 image a wallpaper in 1920*768 screen. Check the below image to see how much screen has actually your image has occupied.

enter image description here

If you really want to resize your pic then you need to resize your height also accordingly and recalculate both the values:

 var height = parseInt(d3.select("image").attr("height"));
    d3.select("image").attr("height", height / 2);

Here is an example.

Upvotes: 2

Related Questions