search

ailon / markerjs

[Deprecated - use markerjs2]: Let your users annotate and mark images
https://markerjs.com
MIT License
103 stars 32 forks source link

Annotations jump slightly when rasterized #40

Open TheTechromancer opened 4 years ago

TheTechromancer commented 4 years ago

First of all, thank you very much for taking the time to make marker.js. It is amazing :)

We are running into this issue when rendering marker.js inside a bootstrap modal. Any help/recommendations would be appreciated.

Peek 2020-10-06 10-03

Thanks!

ailon commented 4 years ago

Not sure if this could be helpful but have you tried setting a different targetRoot in the config?

targetRoot - in case your target image is not a child of document.body you can specify a different root here,

TheTechromancer commented 4 years ago

Thanks, I'll give this a try.

TheTechromancer commented 4 years ago

Okay so I finally was able to test this, and I wasn't able to get targetRoot to influence the positioning.

However, the size of the image seems to be a factor. Small images (e.g. 200x100 pixels) are unaffected by the bug and render normally, whereas for larger ones, the div element containing the svg overlay (the one with absolute positioning) is placed slightly too far to the left. It seems like larger images result in larger offsets, but I could be extrapolating.

small-offset