-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Description
Describe the bug
The rotate transformation of SVG elements can accept up to 3 arguments: https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/transform#rotate
The first one is the angle, while the other two can be used to specify the coordinates of the point from where the element should be rotated.
Currently react-pdf ignores those arguments:
| const [angle] = value; |
This means that you are unable to rotate elements at a custom point (for example the center of the element), instead it will always rotate around (0, 0).
There was already one bug report about this before, which got closed, because the reproduction was misunderstood: #2275
In the issue, the blue and red rectangle should not align, because the red rectangle should be rotated around (3, 3) while it gets rotated around (0, 0) like the blue rectangle.
To Reproduce
react-pdf REPL
Expected behavior
In this example the red and blue rectangles should not align.
This is what the actual svg rendered by a browser looks like:
https://codepen.io/kaesekuchendev/pen/EaKVrbw
Screenshots
Current react-pdf:

How the browser renders the same svg:

Desktop
- OS: Linux
- Browser Firefox
- React-pdf version 4.2.3