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

white background with SVG image #57

Open
nosilver4u opened this issue Aug 11, 2022 · 4 comments
Open

white background with SVG image #57

nosilver4u opened this issue Aug 11, 2022 · 4 comments

Comments

@nosilver4u
Copy link

Hi folks,
I was testing out a watermark function, and while it works great with PNG images, my SVG image is being added with a lovely white background.
Is there any way to get the Gmagick extension to properly handle SVG images and transparency?

Here is essentially my code (commented bits are things I've tried to make this work):

$image = new Gmagick( '/path/to/my-image.jpg' );
...
$watermark          = new Gmagick();
// $watermark_contents = file_get_contents( $this->watermark );
//                      $watermark->newimage( round( $this->image_width * .15 ), round( $this->image_height * .15 ), 'none', 'png' );
//                      $watermark->setimagebackgroundcolor( new GmagickPixel( 'transparent' ) );
//                              $watermark->setimagecolorspace( Gmagick::COLORSPACE_TRANSPARENT );
//              $watermark->readimageblob( $watermark_contents );
$watermark->readimage( '/path/to/my-watermark.svg );
$image->compositeimage( $watermark, 1, $pos_x, $pos_y );

Any thoughts/ideas? Is it not possible with Gmagick?
My source/test image is here: https://test.exactlywww.com/wp-content/uploads/2021/03/LB-ZCAV-1A22.jpg
SVG watermark here: https://test.exactlywww.com/wp-content/uploads/2022/08/ewwwio-logo-gray.svg (I was originally using a white version, but the gray color helps to see better what is happening.

@Danack
Copy link
Contributor

Danack commented Aug 15, 2022

If you want SVG images to be converted correctly, I strongly recommend installing and using Inkscape directly.

inkscape "input.svg" --export-filename="/tmp/output.png" \
  --export-dpi="96" \
  --export-background="white" \
  --export-background-opacity="255" > inkscape_output.txt 2>&1
  

Or with appropriate settings for your users.

It is the SVG converter that seems most reliable. Both the converters in Imagick and Gmagick are less reliable, and to be honest, speaking as the maintainer of Imagick (and allegedly part time maintainer of Gmagick) I am fed up of hearing about the bug reports.

There's nothing I can do to prevent them, other than tell people to use Inkscape directly.

@nosilver4u
Copy link
Author

Apologies if I wasn't clear about the use case. I'm not trying to convert the SVG to PNG, I'm trying to use Gmagick to overlay the SVG on a JPG or PNG image--so that we can dynamically size/scale the watermark, rather than scaling a PNG and introducing distortion. I don't want it to have a white background, that's precisely what I'm hoping to avoid.

From what I've read, Imagick has a setBackgroundColor() method, distinct from setImageBackgroundColor(), that sometimes works to solve this issue, but I couldn't find anything that worked with Gmagick.

If it's not possible, I'll just move on and tell my users that SVG doesn't work with our setup, and we'll "suffer through" with scaling PNG watermarks :)

@Danack
Copy link
Contributor

Danack commented Aug 15, 2022

I don't want it to have a white background

Ok.

inkscape "input.svg" --export-filename="/tmp/output.png" \
  --export-dpi="96" \
  --export-background="transparent" \
  --export-background-opacity="0" > inkscape_output.txt 2>&1
  

rather than scaling a PNG and introducing distortion.

Converting the SVG to a PNG at the same size it's going to be used as an overlay, shouldn't have any 'distortion'.

You can set the exact width and height for output, apparently https://inkscape.org/doc/inkscape-man.html:

 -w, --export-width=WIDTH
 -h, --export-height=HEIGHT

If it's not possible,

It might be possible.....but really if you want to accept SVGs, using Inkscape is probably best.

@nosilver4u
Copy link
Author

Yeah, that's certainly an interesting alternative (using inkscape). I had no idea you could use inkscape on the CLI, so thanks for the tip!
I wasn't even sure how Gmagick would handle "scaling" the SVG since I couldn't get past the issue with it applying a white background 😄

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