Riron / ionic-img-viewer

Ionic 2+ component providing a Twitter inspired experience to visualize pictures.
MIT License
283 stars 118 forks source link

"Full Resolution Image" Feature is not rendering as a Full Resolution Image #124

Open oriuken opened 6 years ago

oriuken commented 6 years ago

Please provide you version information :

Dependency Version
ionic2 Ionic 3.19.1
angular 5.2.10
ionic-img-viewer 2.9.0

Hi guys, first of all thanks for the excellent work, really really helpful.

So, maybe I'm wrong with the concept of "Full Resolution Image" or just doing something wrong but when I use that feature, the opened image is not a full resolution image, it is resized to the container and the zoom i make is not a quality zoom because the size of the image is not the real size.

What I mean is that the "full resolution" image width/height is less than the original image and CSS transform:scale always starts in 1, instead of having the "full resolution" image with the real size and a starting scale of 0.x

Step 1) step1 step2 step3

The real image is here

Is there a way to achieve this with the current version ?

ZeroQool007 commented 6 years ago

same issue. I need a solution, please. thanks

brassier commented 6 years ago

I'm in a similar boat. Any update on this issue?

murshid1988 commented 6 years ago

Sigh. Same issue. I managed to find what causes the issue. Yet to come up with a proper solution. The thing is this impacts the entire idea behind this plugin.

Here is how this plugin works...

It basically uses the CSS's transform property's scale() function for the zoom. The issue is, there is a class which restricts the image to have the max-width as 100% and max-height as 100vh. So it's either the width or height whichever touches the edge of the screen first decides what resolution the image is going to be (Basically something like object-fit:contain).

Let's say if your image has 1000px width and 500px height. On a screen, with a 700px width, the image will have 700px width and 350px height.

Then when you pinch to zoom this image is being scaled, which results in blurry image even if you provide a high res image.

rshah-ksgcorp commented 5 years ago

@murshid1988 Have you find the solution for the issue?