-
-
Notifications
You must be signed in to change notification settings - Fork 103
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 arrows with text disappeared on Zoom #438
Comments
@FaizanAhmad1122 That's an interesting bug! I'll use your example and try to figure it out. I'm on parental leave with a baby, but I'll try to get to this as quickly as possible. |
@rpearce Can you please provide any update on this? |
@FaizanAhmad1122 Honestly, I didn't prioritize this issue in my life, and it never got done. I'll start thinking about it later tonight and see if I can get you taken care of. Expect a response here within maximum 3 days. Additionally, if you want to run the project locally and try to figure it out, you're more than welcome to! Contributions are welcome. |
@FaizanAhmad1122 The reason for this is, I believe, because of the use of edit: it does seem like this doesn't make the animation as smooth, for the original image is visible for a moment 🤔 edit 2: if the mask ID and the edit 3: ok, it's a little hacky, but I have a fix I'll publish. |
@FaizanAhmad1122 This should be fixed in Thank you for your bug report and your patience. |
It seems this happens as well with
|
@andreibarabas Do you have an example image you can share? |
sure @rpearce. see this one. |
Here is another one in mermaid diagrams: <svg>
<g>
<marker id="mermaid-1234_flowchart-pointEnd"></marker>
<g>
<path marker-end="url(#mermaid-1234_flowchart-pointEnd)"></path>
<g>
</g>
</svg> |
Thanks, y'all. I haven't gotten back to this yet. |
FYI, I'm looking at fixing this in the very near future. I have a test scenario all set up, and I'll try to get it fixed ASAP. |
Ok, I think I've got this fixed by targeting If there are other attributes that can receive |
@andreibarabas @zeitderforschung This has been updated and released in Let me know if anything needs adjusting to help with this issue further. |
Thanks @rpearce look forward to testing it |
@rpearce Thank you for working on it. I just tested it and don't know if it is a problem with the update or in my code, but this... ...turns into this after zooming with version 5.2.3: ...and here after zooming with version 5.2.2: If you need more information, let me know. Update: I am using mermaid charts. Below the svg element, there is a style tag and the ids inside need to be rewritten with the <svg id="mermaid-7NK7QkPDxFdxavoHEmQvkB-zoom">
<style>
#mermaid-7NK7QkPDxFdxavoHEmQvkB {}
</style>
...
</svg> |
😅 Goodness gracious there's a lot to this all because of IDs. I'll try to account for that, as well... This is normally the point where I say "this is the wrong solution to the problem", so I'll try to rethink it, too. |
@zeitderforschung |
@zeitderforschung Can you give |
@rpearce Update 5.2.4 works like a charm! 👍🏻 Very cool, thank you very much. |
Issue Type
Description
SVG Arrows that contain text seem to disappear on Zoom. I go to your official editor as well https://rpearce.github.io/react-medium-image-zoom/?path=/story/svg--animating-square and place my svg code instead of your svg through inspect element and got the same behavior. Below is the screen recording of your official site.
Screen.Recording.2023-08-10.at.11.04.01.AM.mov
Below is the SVG code that I am trying to Zoom
The text was updated successfully, but these errors were encountered: