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

line not rendered correctly #122

Open
welove opened this issue May 30, 2024 · 4 comments
Open

line not rendered correctly #122

welove opened this issue May 30, 2024 · 4 comments
Milestone

Comments

@welove
Copy link

welove commented May 30, 2024

Hello,

If I use version 0.8.2 I get this SVG correctly rendered:

Captura de ecrã 2024-05-30, às 13 04 24

But with version 2.0.4 or 3.0, it shows like this in Google Chrome PDF Viewer:

Captura de ecrã 2024-05-30, às 13 04 42

But if I download the file, those strange lines don't appear in the actual PDF...
In Safari PDF viewer they don't show, I only see those lines in Google Chrome.

I need to upgrade from 0.8.2 because in this version, these SVG don't render the letters (they are in curves):

Dompdf 2 or 3:
Captura de ecrã 2024-05-30, às 13 04 58

Dompdf 0.8:
Captura de ecrã 2024-05-30, às 13 05 16

Any help?

I need both cases to work properly

thank you in advance

@bsweeney
Copy link
Member

Can you supply the SVG so I can attempt to reproduce the error?

@welove
Copy link
Author

welove commented May 30, 2024

I'm printing as an image like this:

data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAwIiBoZWlnaHQ9IjQxNi42NjY2NjY2NjY2NjciPgoJPCEtLSBjcmVhdGVkIGJ5IGh0dHBzOi8vd3d3Lm9wdGljdXR0ZXIuY29tIC0tPgogICAgPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KICAgICAgICAucmVtbmFudExhYmVsU3R5bGUgeyBmb250LXNpemU6IDE1cHg7IGZpbGw6ICM2MDYwNjA7IH0KICAgICAgICAubGFiZWxTdHlsZSB7IGZvbnQtc2l6ZTogMTVweDsgZmlsbDogIzAwMDAwMDt9CiAgICA8L3N0eWxlPgoJPHJlY3Qgd2lkdGg9IjEwMDAiIGhlaWdodD0iNDE2LjY2NjY2NjY2NjY2NyIgc3R5bGU9ImZpbGw6I0YwRjBGMDtzdHJva2Utd2lkdGg6MTtzdHJva2U6YmxhY2siIC8+CgkJCTxyZWN0IHg9IjYzMCIgeT0iMTA1IiB3aWR0aD0iMzcwIiBoZWlnaHQ9IjIxMCIgc3R5bGU9ImZpbGw6I0YwRjBGMDtzdHJva2Utd2lkdGg6MTtzdHJva2U6I0EwQTBBMCIvPgoJCQkJPHRleHQgeD0iODE1IiB5PSIxMjAiIGNsYXNzPSJyZW1uYW50TGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgICAgIDEsMTEwCgkJCQk8L3RleHQ+CgkJCQk8dGV4dCB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2NDUsIDIxMCkgcm90YXRlKC05MCkiIGNsYXNzPSJyZW1uYW50TGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgICAgIDYzMAoJCQkJPC90ZXh0PgoJCQk8cmVjdCB4PSIwIiB5PSIzMTUiIHdpZHRoPSIxMDAwIiBoZWlnaHQ9IjEwMS42NjY2NjY2NjY2NjciIHN0eWxlPSJmaWxsOiNGMEYwRjA7c3Ryb2tlLXdpZHRoOjE7c3Ryb2tlOiNBMEEwQTAiLz4KCQkJCTx0ZXh0IHg9IjUwMCIgeT0iMzMwIiBjbGFzcz0icmVtbmFudExhYmVsU3R5bGUiIGRvbWluYW50LWJhc2VsaW5lPSJtaWRkbGUiIHRleHQtYW5jaG9yPSJ0b3AiIHBvaW50ZXItZXZlbnRzPSJub25lIj4KICAgICAgICAgICAgICAgICAgICAzLDAwMAoJCQkJPC90ZXh0PgoJCQkJPHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUsIDM2NS44MzMzMzMzMzMzMzMpIHJvdGF0ZSgtOTApIiBjbGFzcz0icmVtbmFudExhYmVsU3R5bGUiIGRvbWluYW50LWJhc2VsaW5lPSJtaWRkbGUiIHRleHQtYW5jaG9yPSJ0b3AiIHBvaW50ZXItZXZlbnRzPSJub25lIj4KICAgICAgICAgICAgICAgICAgICAzMDUKCQkJCTwvdGV4dD4KCQkJPHJlY3QgeD0iOTczLjMzMzMzMzMzMzMzMyIgeT0iMCIgd2lkdGg9IjI2LjY2NjY2NjY2NjY2NyIgaGVpZ2h0PSIxMDUiIHN0eWxlPSJmaWxsOiNGMEYwRjA7c3Ryb2tlLXdpZHRoOjE7c3Ryb2tlOiNBMEEwQTAiLz4KCQkJCTx0ZXh0IHg9Ijk4Ni42NjY2NjY2NjY2NjciIHk9IjE1IiBjbGFzcz0icmVtbmFudExhYmVsU3R5bGUiIGRvbWluYW50LWJhc2VsaW5lPSJtaWRkbGUiIHRleHQtYW5jaG9yPSJ0b3AiIHBvaW50ZXItZXZlbnRzPSJub25lIj4KICAgICAgICAgICAgICAgICAgICA4MAoJCQkJPC90ZXh0PgoJCQkJPHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOTg4LjMzMzMzMzMzMzMzMywgNTIuNSkgcm90YXRlKC05MCkiIGNsYXNzPSJyZW1uYW50TGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgICAgIDMxNQoJCQkJPC90ZXh0PgoJCQk8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iNjY2LjY2NjY2NjY2NjY2NyIgaGVpZ2h0PSIxMDUiIHN0eWxlPSJmaWxsOiM3NGI5ZmY7c3Ryb2tlLXdpZHRoOjE7c3Ryb2tlOmJsYWNrIi8+CgkJCTx0ZXh0IHg9IjMzMy4zMzMzMzMzMzMzMzMiIHk9IjE1IiBjbGFzcz0ibGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgMiwwMDAKCQkJPC90ZXh0PgoJCQk8dGV4dCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNSwgNTIuNSkgcm90YXRlKC05MCkiIGNsYXNzPSJsYWJlbFN0eWxlIiBkb21pbmFudC1iYXNlbGluZT0ibWlkZGxlIiB0ZXh0LWFuY2hvcj0idG9wIiBwb2ludGVyLWV2ZW50cz0ibm9uZSI+CiAgICAgICAgICAgICAgICAzMTUKCQkJPC90ZXh0PgoJCQk8cmVjdCB4PSIwIiB5PSIxMDUiIHdpZHRoPSI2MzAiIGhlaWdodD0iMTA1IiBzdHlsZT0iZmlsbDojZmZlYWE3O3N0cm9rZS13aWR0aDoxO3N0cm9rZTpibGFjayIvPgoJCQk8dGV4dCB4PSIzMTUiIHk9IjEyMCIgY2xhc3M9ImxhYmVsU3R5bGUiIGRvbWluYW50LWJhc2VsaW5lPSJtaWRkbGUiIHRleHQtYW5jaG9yPSJ0b3AiIHBvaW50ZXItZXZlbnRzPSJub25lIj4KICAgICAgICAgICAgICAgIDEsODkwCgkJCTwvdGV4dD4KCQkJPHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUsIDE1Ny41KSByb3RhdGUoLTkwKSIgY2xhc3M9ImxhYmVsU3R5bGUiIGRvbWluYW50LWJhc2VsaW5lPSJtaWRkbGUiIHRleHQtYW5jaG9yPSJ0b3AiIHBvaW50ZXItZXZlbnRzPSJub25lIj4KICAgICAgICAgICAgICAgIDMxNQoJCQk8L3RleHQ+CgkJCTxyZWN0IHg9IjAiIHk9IjIxMCIgd2lkdGg9IjYzMCIgaGVpZ2h0PSIxMDUiIHN0eWxlPSJmaWxsOiNmZmVhYTc7c3Ryb2tlLXdpZHRoOjE7c3Ryb2tlOmJsYWNrIi8+CgkJCTx0ZXh0IHg9IjMxNSIgeT0iMjI1IiBjbGFzcz0ibGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgMSw4OTAKCQkJPC90ZXh0PgoJCQk8dGV4dCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNSwgMjYyLjUpIHJvdGF0ZSgtOTApIiBjbGFzcz0ibGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgMzE1CgkJCTwvdGV4dD4KCQkJPHJlY3QgeD0iNjY2LjY2NjY2NjY2NjY2NyIgeT0iMCIgd2lkdGg9IjMwNi42NjY2NjY2NjY2NjciIGhlaWdodD0iMTA1IiBzdHlsZT0iZmlsbDojN2VkNmRmO3N0cm9rZS13aWR0aDoxO3N0cm9rZTpibGFjayIvPgoJCQk8dGV4dCB4PSI4MjAiIHk9IjE1IiBjbGFzcz0ibGFiZWxTdHlsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9InRvcCIgcG9pbnRlci1ldmVudHM9Im5vbmUiPgogICAgICAgICAgICAgICAgOTIwCgkJCTwvdGV4dD4KCQkJPHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjgxLjY2NjY2NjY2NjY2NywgNTIuNSkgcm90YXRlKC05MCkiIGNsYXNzPSJsYWJlbFN0eWxlIiBkb21pbmFudC1iYXNlbGluZT0ibWlkZGxlIiB0ZXh0LWFuY2hvcj0idG9wIiBwb2ludGVyLWV2ZW50cz0ibm9uZSI+CiAgICAgICAgICAgICAgICAzMTUKCQkJPC90ZXh0PgoJCQkJPGxpbmUgeDE9IjAiIHkxPSIyMCIgeDI9IjEwMDAiIHkyPSIyMCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+CgkJCQk8bGluZSB4MT0iMCIgeTE9IjQwIiB4Mj0iMTAwMCIgeTI9IjQwIiBzdHJva2U9Im5vbmUiIHBvaW50ZXItZXZlbnRzPSJub25lIiBzdHJva2Utb3BhY2l0eT0iOCUiLz4KCQkJCTxsaW5lIHgxPSIwIiB5MT0iNjAiIHgyPSIxMDAwIiB5Mj0iNjAiIHN0cm9rZT0ibm9uZSIgcG9pbnRlci1ldmVudHM9Im5vbmUiIHN0cm9rZS1vcGFjaXR5PSI4JSIvPgoJCQkJPGxpbmUgeDE9IjAiIHkxPSI4MCIgeDI9IjEwMDAiIHkyPSI4MCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+CgkJCQk8bGluZSB4MT0iMCIgeTE9IjEwMCIgeDI9IjEwMDAiIHkyPSIxMDAiIHN0cm9rZT0ibm9uZSIgcG9pbnRlci1ldmVudHM9Im5vbmUiIHN0cm9rZS1vcGFjaXR5PSI4JSIvPgoJCQkJPGxpbmUgeDE9IjAiIHkxPSIxMjAiIHgyPSIxMDAwIiB5Mj0iMTIwIiBzdHJva2U9Im5vbmUiIHBvaW50ZXItZXZlbnRzPSJub25lIiBzdHJva2Utb3BhY2l0eT0iOCUiLz4KCQkJCTxsaW5lIHgxPSIwIiB5MT0iMTQwIiB4Mj0iMTAwMCIgeTI9IjE0MCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+CgkJCQk8bGluZSB4MT0iMCIgeTE9IjE2MCIgeDI9IjEwMDAiIHkyPSIxNjAiIHN0cm9rZT0ibm9uZSIgcG9pbnRlci1ldmVudHM9Im5vbmUiIHN0cm9rZS1vcGFjaXR5PSI4JSIvPgoJCQkJPGxpbmUgeDE9IjAiIHkxPSIxODAiIHgyPSIxMDAwIiB5Mj0iMTgwIiBzdHJva2U9Im5vbmUiIHBvaW50ZXItZXZlbnRzPSJub25lIiBzdHJva2Utb3BhY2l0eT0iOCUiLz4KCQkJCTxsaW5lIHgxPSIwIiB5MT0iMjAwIiB4Mj0iMTAwMCIgeTI9IjIwMCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+CgkJCQk8bGluZSB4MT0iMCIgeTE9IjIyMCIgeDI9IjEwMDAiIHkyPSIyMjAiIHN0cm9rZT0ibm9uZSIgcG9pbnRlci1ldmVudHM9Im5vbmUiIHN0cm9rZS1vcGFjaXR5PSI4JSIvPgoJCQkJPGxpbmUgeDE9IjAiIHkxPSIyNDAiIHgyPSIxMDAwIiB5Mj0iMjQwIiBzdHJva2U9Im5vbmUiIHBvaW50ZXItZXZlbnRzPSJub25lIiBzdHJva2Utb3BhY2l0eT0iOCUiLz4KCQkJCTxsaW5lIHgxPSIwIiB5MT0iMjYwIiB4Mj0iMTAwMCIgeTI9IjI2MCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+CgkJCQk8bGluZSB4MT0iMCIgeTE9IjI4MCIgeDI9IjEwMDAiIHkyPSIyODAiIHN0cm9rZT0ibm9uZSIgcG9pbnRlci1ldmVudHM9Im5vbmUiIHN0cm9rZS1vcGFjaXR5PSI4JSIvPgoJCQkJPGxpbmUgeDE9IjAiIHkxPSIzMDAiIHgyPSIxMDAwIiB5Mj0iMzAwIiBzdHJva2U9Im5vbmUiIHBvaW50ZXItZXZlbnRzPSJub25lIiBzdHJva2Utb3BhY2l0eT0iOCUiLz4KCQkJCTxsaW5lIHgxPSIwIiB5MT0iMzIwIiB4Mj0iMTAwMCIgeTI9IjMyMCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+CgkJCQk8bGluZSB4MT0iMCIgeTE9IjM0MCIgeDI9IjEwMDAiIHkyPSIzNDAiIHN0cm9rZT0ibm9uZSIgcG9pbnRlci1ldmVudHM9Im5vbmUiIHN0cm9rZS1vcGFjaXR5PSI4JSIvPgoJCQkJPGxpbmUgeDE9IjAiIHkxPSIzNjAiIHgyPSIxMDAwIiB5Mj0iMzYwIiBzdHJva2U9Im5vbmUiIHBvaW50ZXItZXZlbnRzPSJub25lIiBzdHJva2Utb3BhY2l0eT0iOCUiLz4KCQkJCTxsaW5lIHgxPSIwIiB5MT0iMzgwIiB4Mj0iMTAwMCIgeTI9IjM4MCIgc3Ryb2tlPSJub25lIiBwb2ludGVyLWV2ZW50cz0ibm9uZSIgc3Ryb2tlLW9wYWNpdHk9IjglIi8+Cjwvc3ZnPgo=

@welove
Copy link
Author

welove commented May 30, 2024

I think the problem are these lines:

<line x1="0" y1="20" x2="1000" y2="20" stroke="none" pointer-events="none" stroke-opacity="8%"/>

stroke-opacity is not respected

@bsweeney
Copy link
Member

bsweeney commented May 30, 2024

This is an issue with SvgLib. I see a couple of problems with how the latest version renders that element.

  1. The stroke is set to "none" so the line shouldn't render at all. I suspect SvgLib is mis-reading that as if it were black.
  2. Percentage values are not really supported for stroke-opacity (or other mixed-value attributes), so the percentage is treated as fully opaque.

I'm going to move this to the SvgLib project to address with the next release of SvgLib.

@bsweeney bsweeney transferred this issue from dompdf/dompdf May 30, 2024
@bsweeney bsweeney added this to the 1.0.1 milestone May 30, 2024
@bsweeney bsweeney changed the title SVG render problems line not rendered correctly May 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants