search

dompdf / php-svg-lib

SVG file parsing / rendering library
GNU Lesser General Public License v3.0
1.39k stars 78 forks source link

line not rendered correctly #122

Open welove opened 1 month ago

welove commented 1 month ago

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 commented 1 month ago

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

welove commented 1 month ago

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 commented 1 month ago

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 commented 1 month ago

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.