question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Is it possible to calculate svg height or read the inside of downloaded svg file?

See original GitHub issue

Hello, I am trying to load image from link. For it I am using:

<SvgCssUri
  style={{width: imageWidth, height: 176}}
   key={Math.random()}
    uri={source}
 />

Is there a way to then get the actual xml code from it, so that I would get the dimensions of the image, or is it possible to load image without setting height? I am doing the same thing with image:

export function OnlineImage({source, imageWidth}){
    const [imgHeight, setImgHeight] = useState(0);
    useEffect(() => {
            const image = <Image
                width={imageWidth}
                source={{uri: source}}
                key={Math.random()}
            />;
            Image.getSize(source, (width, height) => {
                setImgHeight(height * (image.props.width / width))
            }, null);
    }, [])

    return(
            <Image
                style={{width: imageWidth, height: imgHeight}}
                source={{uri: source}}
                key={Math.random()}
            );
}

This way I calculate the right height for image based on width.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:11

github_iconTop GitHub Comments

1reaction
schmrucommented, Mar 30, 2020

@soroushm So I ended up using this, this way I get parts of the svg that I need, it is ugly, but it works 😃

0reactions
schmrucommented, Mar 30, 2020

@soroushm Thank you for suggestion, but even if I download file with fetch, it doesn’t contain data about height or width, neither the viewBox. Looks like I’ll have to think some other way to get that info.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Is it possible to calculate svg height or read the inside ... - GitHub
This way I calculate the right height for image based on width.
Read more >
Get size of SVG graphics by javascript - Stack Overflow
Having JS retrieve the SVG's XML content and parse it into a DOM to retrieve only the image dimensions is a bit overkill....
Read more >
SVG Viewport and viewBox (For Complete Beginners)
As with a window, the size of the viewport determines how much you can see, but it doesn't define the size of whatever...
Read more >
How to find correct the size for any SVG file - YouTube
If you have had trouble with svgs not importing at the correct size in some softwares, (like design space after their latest update)...
Read more >
How to Find and Download Great SVG Cut Files for ... - YouTube
Get the free SVGs Made Simple workbook here: https://jennifermaker.com/svgs-made-simple-free-workbookThe UPDATED version of this video is at ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found