Is it possible to calculate svg height or read the inside of downloaded svg file?
See original GitHub issueHello, 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:
- Created 3 years ago
- Comments:11
Top 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 >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@soroushm So I ended up using this, this way I get parts of the svg that I need, it is ugly, but it works 😃
@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.