Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Getting Image width/height with the preview #106

Open
levelingup opened this issue Sep 24, 2021 · 2 comments
Open

Getting Image width/height with the preview #106

levelingup opened this issue Sep 24, 2021 · 2 comments

Comments

@levelingup
Copy link

Is there a way to capture the image's width and height so then it can be used to see its aspect ratio?

@Nimsrules
Copy link

I too am looking for an option to capture the dimensions in absolute pixels to compare with widow's innerHeight & innerWidth. @levelingup did you find a way?

@Tpleme
Copy link

Tpleme commented Sep 26, 2022

You could do the following to get all the info from the file:

const getImageProperties = (file) => {

    const picture = URL.createObjectURL(new Blob(file, { type: file[0].type }))
    const image = new Image();

    image.onload = () => {
        file[0].width = image.width;
	file[0].height = image.height;
	const GCD = findImageGCD(image.width, image.height);
	file[0].aspectRatio = `${image.width / GCD}:${image.height / GCD}`
    }

    image.src = picture;
}

//Function tho get the aspect ratio
const findImageGCD = (w, h) => {
    if (h === 0) return w
    return findImageGCD(h, w % h)
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants