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

SVG size issue #18

Open
fritzlaszlo opened this issue Jan 21, 2021 · 0 comments
Open

SVG size issue #18

fritzlaszlo opened this issue Jan 21, 2021 · 0 comments
Assignees
Labels
bug Something isn't working

Comments

@fritzlaszlo
Copy link

fritzlaszlo commented Jan 21, 2021

Heya, first of all: Thanks for this fantastic plugin.

While trying it out with the editor, I realized some SVGs cause scaling problems in the annotator preview:

Screenshot 2021-01-20 at 16 42 41

The editor used an svg export from illustrator. A simple map.

The head of the SVG with the viewbox looks like this:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 419.95 498.3">

Now when I gave the SVG some height in the Inspector, it worked again:

Screenshot 2021-01-20 at 16 42 52

So of course this could be solved with changed properties inside the SVG, but since this file might be changed or updated from time to time by the editors, I tried to find a css-only solution. This is where I am right now:
All elements inside the annotator inherit width: 100% apart from .annotator-ctn .image-ctn, which only has:

 {
    max-width: 100%;
}

If I change this to width instead of max-width, the image scales to visibility But due to its dimensions ("Portrait mode" so to say), the values max-height: calc(100vh - 12rem); are keeping it cropped. If i remove it, the image is of course huge, but seem to work fine.

Screenshot 2021-01-21 at 10 36 15

I can imagine the max-heights are there for a reason, but so far that was my try on tackling this issue.

Cheers and thanks,
Fritz

@sylvainjule sylvainjule self-assigned this Nov 19, 2021
@sylvainjule sylvainjule added the bug Something isn't working label Nov 19, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants