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

PNGs render black for transparency, even on a white background #2214

Closed
IanHaskin opened this Issue Feb 19, 2015 · 28 comments

Comments

Projects
None yet
@IanHaskin

IanHaskin commented Feb 19, 2015

The title says it all.

@rsteinwand

This comment has been minimized.

rsteinwand commented Feb 20, 2015

Sorry, your title doesn't say what version of wkhtmltopdf or os you're running or image type.

You also didn't post an sample image.

My transparent pngs work perfect on 0.12.2.1 on Windows 7 and Server 2003.

@IanHaskin

This comment has been minimized.

IanHaskin commented Feb 20, 2015

Sorry:
0.12.2.1
Windows 7x64 Pro

I got around the issue by setting a white background for the PNG.

@rsteinwand

This comment has been minimized.

rsteinwand commented Feb 20, 2015

You shouldn't have to do that. I use Paint.net (free) with the Optimized Png plugin.

http://www.getpaint.net
http://forums.getpaint.net/index.php?showtopic=22841

@NielsFestjens

This comment has been minimized.

NielsFestjens commented Mar 18, 2015

I have this issue too.
Wkhtmltopdf 0.12.2.1
Note: with Wkhtmltopdf 0.12.0.0, I did not have this problem
Windows 8 x64 Enterprise

Original
original image

Web
result on web

Pdf
result in pdf

I tried the Optimized Png plugin, but none of the options seemed to give any difference in the generated pdf

@rsteinwand

This comment has been minimized.

rsteinwand commented Mar 19, 2015

This may be the same bug as this: #2208

@XavierLOTJ

This comment has been minimized.

XavierLOTJ commented May 4, 2015

I am having the same issue with 0.12.2.1 on Windows 7 x64. Has anyone had any luck with this?

@ashkulz

This comment has been minimized.

Member

ashkulz commented May 4, 2015

Did it work in 0.12.1 or 0.12.2? Just trying to see when any regression happened. Also, more test cases would be helpful.

@canavese

This comment has been minimized.

canavese commented May 9, 2015

Strangely, for me this seems to be triggered by the height of the image (!). For one given image, I get a black background when the image is in a certain range of sizes. Outside that range I get a proper transparent background. I'm using 0.12.2.1 on OSX.

Edit: since the image was being scaled down in the HTML, I tried changing the size of the source image, and that also affected the behavior. Doing that allowed me to display the image in the preferred size in the PDF.

@nakupanda

This comment has been minimized.

nakupanda commented May 14, 2015

Same problem here.
Ubuntu 14 LTS
wkhtmltopdf 0.12.2.1
image type: .png with transparent background

Black background rendered in some sizes, e.g. I scaled the image from original width 40px to 20px.

@j-d

This comment has been minimized.

j-d commented Jun 12, 2015

Same issue here.

@g5681332trbvmcom

This comment has been minimized.

g5681332trbvmcom commented Jun 22, 2015

Changing the .PNG to a .GIF with transparent background does not solve the problem -- blackness persists.

I can confirm that resizing is part of this bug. Only certain heights of the image have the black background.

Am on Mac OS 10.6.8 running wkhtmltopdf 0.12.2.1

wkhtmltopdf is a lifesaver! :-)

@g5681332trbvmcom

This comment has been minimized.

g5681332trbvmcom commented Jun 22, 2015

I rolled back to release 0.12.2 and the problem persisted. I rolled back to release 0.12.1 and the problem disappeared.

Also of note: the 0.12.2.1 release included a change in the way that transparency is rendered. See Issue 2084

@ashkulz

This comment has been minimized.

Member

ashkulz commented Jun 22, 2015

Does this happen only on 32-bit builds or 64-bit builds? Also, does it matter whether the host OS is 32-bit or 64-bit? I tried running it with the test image given by @NielsFestjens and it worked fine on a 32-bit debug build of master on 32-bit Windows 7.

2214.html

<!DOCTYPE html>
<html lang="en">
  <body>
    <img src="2214.png" />
  </body>
</html>

Command Line

wkhtmltopdf 2214.html 2214.pdf

Output

2214

A test case which can be reproduced will help track down the regression, if any.

@bri2

This comment has been minimized.

bri2 commented Jun 22, 2015

@ashkulz Try resizing the image using css. Certain sizes then cause the image to get a black background.

What worked for me is creating an image to 2x the size you actually want it to be. Then resize the image using css to the size you want it to be. For example:

Image: 48 x 48 px
Image in pdf: 24 x 24 px

This obviously can't work if you have images that can't be enlarged or which you don't have the original copy of, then give it a few tries by just changing the size of the image using css. It's still a bug in wkhtmltopdf though..

@g5681332trbvmcom

This comment has been minimized.

g5681332trbvmcom commented Jun 22, 2015

My Mac OS is 32-bit.

I encountered the issue when resizing the image below to a height of 72 pixels. I didn't use CSS, exactly -- I added a "height" attribute to the IMG tag (don't hate me).

https://upload.wikimedia.org/wikipedia/commons/c/c0/JAG_logo_USCG.gif

@ashkulz

This comment has been minimized.

Member

ashkulz commented Jun 22, 2015

So can someone post a full test case like I did which reproduces the issue?

@bri2

This comment has been minimized.

bri2 commented Jun 24, 2015

@ashkulz Yes:

Wkhtmltopdf version:
image
Host OS: Windows 8 64 bit

Command line used in all the examples:

wkhtmltopdf test.html test.pdf

I use this image (close.png):
close

The html:

<!DOCTYPE html>
<html>
  <body>
    <img src="close.png" width="24" height="24" />
  </body>
</html>

Result full sized (no width/height set either using attributes or css) it's not too good but ok:
image

Result image sized down to 24x24px using the html supplied above:
image

When I resize the image (close) to 48x48px (so it's double the size), it's okay again:
image

@FeanorsCurse

This comment has been minimized.

FeanorsCurse commented Jun 26, 2015

Not sure if another "me too" entry is helpful but: Me too :P

@SArnab

This comment has been minimized.

SArnab commented Jun 26, 2015

Happens here as well. Test case included below (it's long, but it's the exact example).

System

Ubuntu 14.04.2 LTS (GNU/Linux 3.13.0-52-generic x86_64)
wkhtmltopdf 0.12.2.1 (with patched qt)

Troubled Image

image

HTML

<html>
    <style type="text/css">
        body{
            margin:0;
            padding:0;
        }
        #slide{
            width:1920px;
            height:1080px;
            position:relative;
            page-break-after:avoid;
            page-break-inside:avoid;
            overflow:hidden;
        }
        .item{
            position:absolute;
        }
        .item.item-image img{
            width:100%;
            height:100%;
        }
        .item.item-text textarea{
            margin:0;
            outline:none;
            white-space: pre-line;
            resize:none;
            border:0;
            background:none;
            display:block;
            width:100%;
            height:100%;
            overflow:hidden;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="http://api.buncee.com/static/player/css/normalize.css" />
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
    <body>
        <div id="slide" style="background:url('https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/backgrounds/3f5dc11addfa97f293a748209062a0d9/77e/1428013520_Yuki_BeachIslandGraphic022615_01.jpg');background-repeat:no-repeat;background-size:100%;">
            <div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:24;top:273.12783318223px;left:1091.2873980054px;width:99.002719854941px;height:121.84950135993px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/558/88e/1434487011_Young_sticker_animals061615_05.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:23;top:301.94016319129px;left:709.01178603808px;width:293.16409791478px;height:327.25294650952px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/556/1da/1433279919_Meg_stickers_seasons060215_01.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-text" style="-webkit-transform:rotate(0deg);z-index:22;top:26.890299184043px;left:35.593834995467px;width:675.99274705349px;height:122.44786944696px">
    <textarea style="text-align:left;color:#000;font-family:Life Savers;font-weight:bold;font-style:none;font-size:66px;text-decoration:none;">
        The Water Cycle
    </textarea>
</div><div class="item item-image" style="-webkit-transform:rotate(-45.098645592176deg);z-index:21;top:40.389163002542px;left:1064.7173707845px;width:145.67141242665px;height:165.12353803082px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/41a2de462d7ea38b861ce3d64147f9c9/be7/1428013726_Meg_Arrow_0621_06.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:20;top:88.114233907525px;left:758.46177092777px;width:370.23874282261px;height:215.8476881233px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/ab2c0722a35285b9d7a6fdb65bfbcd43/51d/1428013143_buncee_stickers_seasonal_04291404.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:19;top:3.3182230281052px;left:-821.61378059837px;width:1499.7642792384px;height:170.5893019039px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/a54f98b0e23e6925c855760cdabd7168/c2e/1428013849_Meg_BannerNov2513_016.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:18;top:610.4016327822px;left:1080.9633449783px;width:109.80916973871px;height:134.0044105286px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/558/345/1434661968_bunceemanshy.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:17;top:444.44875781122px;left:1054.92757919px;width:284.11411742924px;height:284.11411742924px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/ab2c0722a35285b9d7a6fdb65bfbcd43/2c1/1428013135_umbrella_blue.png" style="-webkit-transform:scaleX(-1) scaleY(1);transform:scaleX(-1) scaleY(1);"/>
</div><div class="item item-text" style="-webkit-transform:rotate(0deg);z-index:16;top:836.58115363921px;left:500.18573940678px;width:319.14777878513px;height:108.76087094466px">
    <textarea style="text-align:left;color:#000;font-family:Life Savers;font-weight:bold;font-style:none;font-size:54px;text-decoration:none;">
        evaporation
    </textarea>
</div><div class="item item-text" style="-webkit-transform:rotate(0deg);z-index:15;top:120.88848594741px;left:1389.8640072529px;width:334.09836065574px;height:94.596554850412px">
    <textarea style="text-align:left;color:#000;font-family:Life Savers;font-weight:bold;font-style:none;font-size:48px;text-decoration:none;">
        precipitation
    </textarea>
</div><div class="item item-image" style="-webkit-transform:rotate(221.16657765872deg);z-index:14;top:455.55162863118px;left:214.38768718998px;width:145.67141242665px;height:235.08111860603px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/41a2de462d7ea38b861ce3d64147f9c9/be7/1428013726_Meg_Arrow_0621_06.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:13;top:118.20489573889px;left:1382.447869447px;width:335.75098216984px;height:113.1459655485px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/554/f92/1430321453_Meg_stickers_color042815_014.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(98.655209638739deg);z-index:12;top:607.79019436397px;left:1068.593276782px;width:252.19558964525px;height:406.98734455648px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/41a2de462d7ea38b861ce3d64147f9c9/be7/1428013726_Meg_Arrow_0621_06.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:11;top:751.34498521856px;left:263.71223256716px;width:586.39496622721px;height:232.25339416861px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/d6e6cb19e3b9c02f89d6cd54cfa7c613/6be/1428013375_BusinessStickers021115_04.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:10;top:784.02684563758px;left:-43.346116970278px;width:1992.5599232982px;height:419.71236816874px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/ab2c0722a35285b9d7a6fdb65bfbcd43/1de/1428013116_Yuki_Waves_Clipart_01151501.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:9;top:17.243880326383px;left:1227.6824419166px;width:690.11424088605px;height:814.65095194923px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/animations/b7b0e81603cc2b33d502bb8e6280c096/2d8/1428011579_YukiRaina111413_01.gif" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-text" style="-webkit-transform:rotate(-2.5414649542007deg);z-index:8;top:246.88585932862px;left:258.3419101107px;width:364.25519716211px;height:142.52018138849px">
    <textarea style="text-align:left;color:#000;font-family:Life Savers;font-weight:bold;font-style:none;font-size:44px;text-decoration:none;">
        condensation
    </textarea>
</div><div class="item item-image" style="-webkit-transform:rotate(14.364721742457deg);z-index:7;top:142.75444082288px;left:265.20326798465px;width:308.1403482692px;height:243.91958854752px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/d6e6cb19e3b9c02f89d6cd54cfa7c613/51d/1428013373_BusinessStickers021115_02.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:6;top:44.116047144153px;left:599.57691145361px;width:370.23874282261px;height:215.8476881233px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/ab2c0722a35285b9d7a6fdb65bfbcd43/51d/1428013143_buncee_stickers_seasonal_04291404.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:5;top:681.05465004794px;left:-2.0070310003195px;width:570.25247682966px;height:250.35474592522px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/animations/b7b0e81603cc2b33d502bb8e6280c096/7e0/1428011699_Yuki_061014_WaterSplashAnimation_01.gif" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(-0.25799019207035deg);z-index:4;top:641.46113879234px;left:-28.189767272242px;width:1957.2118650428px;height:349.76030680729px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/animations/b7b0e81603cc2b33d502bb8e6280c096/398/1428011700_YukiWavesGif0.gif" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(179.6003204169deg);z-index:3;top:453.75365674009px;left:-6.1801757676243px;width:624.21120961462px;height:624.21120961462px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/animations/b7b0e81603cc2b33d502bb8e6280c096/2d8/1428011579_YukiRaina111413_01.gif" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:2;top:425.04986400725px;left:81.097008159565px;width:254.17951042611px;height:283.7352674524px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/556/1da/1433279919_Meg_stickers_seasons060215_01.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div><div class="item item-image" style="-webkit-transform:rotate(0deg);z-index:1;top:280.09066183137px;left:1253.8531278332px;width:369.57388939257px;height:412.54759746147px">
    <img src="https://7551bdfc54adf45425bb-e1819ba959867bdb3382b3652a5f5ff1.ssl.cf5.rackcdn.com/stickers/556/1da/1433279919_Meg_stickers_seasons060215_01.png" style="-webkit-transform:scaleX(1) scaleY(1);transform:scaleX(1) scaleY(1);"/>
</div>
        </div>
    </body>

Command

wkhtmltopdf -L 5mm -R 5mm -T 5mm -B 5mm --encoding utf8 --disable-smart-shrinking --zoom 0.398058 --page-width 156mm --page-height 269mm --orientation Landscape page.html output.pdf
@ashkulz

This comment has been minimized.

Member

ashkulz commented Jun 29, 2015

I was able to reproduce it with the test case given by @bri2.

@ashkulz ashkulz added Verified and removed NeedToVerify labels Jun 29, 2015

@ashkulz

This comment has been minimized.

Member

ashkulz commented Jun 29, 2015

This is a regression between the 0.12.1 and the 0.12.2 releases due to wkhtmltopdf/qt@b18df9f which fixed #1638 but introduced this problem for PNG images. @poizan42 will have to chime in here, as I'm not too familiar with this area -- reverting the above change certainly fixes it for the above test case.

@ashkulz ashkulz added this to the 0.12.3 milestone Jun 29, 2015

@ashkulz ashkulz added Regression and removed Verified labels Jun 29, 2015

@ashkulz

This comment has been minimized.

Member

ashkulz commented Jul 2, 2015

The fixes for #1512 and #1638 were band-aids but did not fix the underlying problem: the noneScaled image was in a different format than what was expected (i.e either ARGB32 or RGB32). The patch below fixes it so that it is always converted to the expected format.

diff --git a/src/gui/painting/qprintengine_pdf.cpp b/src/gui/painting/qprintengine_pdf.cpp
index d7e0fb0..a041e26 100644
--- a/src/gui/painting/qprintengine_pdf.cpp
+++ b/src/gui/painting/qprintengine_pdf.cpp
@@ -846,20 +846,22 @@ int QPdfEnginePrivate::addImage(const QImage &img, bool *bitmap, qint64 serial_n
         return object;

     QImage image = img;
-    QImage::Format format = image.format();
     if (image.depth() == 1 && *bitmap && img.colorTable().size() == 2
         && img.colorTable().at(0) == QColor(Qt::black).rgba()
         && img.colorTable().at(1) == QColor(Qt::white).rgba())
     {
-        if (format == QImage::Format_MonoLSB)
+        if (image.format() != QImage::Format_Mono)
             image = image.convertToFormat(QImage::Format_Mono);
-        format = QImage::Format_Mono;
     } else {
         *bitmap = false;
-        if (format != QImage::Format_RGB32 && format != QImage::Format_ARGB32) {
+        if (image.format() != QImage::Format_RGB32 && image.format() != QImage::Format_ARGB32)
             image = image.convertToFormat(QImage::Format_ARGB32);
-            format = QImage::Format_ARGB32;
-        }
+    }
+    QImage::Format format = image.format();
+    QImage nonScaledImage;
+    if (noneScaled && noneScaled->format() != format) {
+        nonScaledImage = noneScaled->convertToFormat(format);
+        noneScaled = &nonScaledImage;
     }

     int w = image.width();
@@ -902,10 +904,7 @@ int QPdfEnginePrivate::addImage(const QImage &img, bool *bitmap, qint64 serial_n

         if (noneScaled && noneScaled->rect() != image.rect()) {
             QByteArray imageData2;
-            if (noneScaled->format() != QImage::Format_RGB32 && noneScaled->format() != QImage::Format_ARGB32)
-                convertImage(noneScaled->convertToFormat(QImage::Format_ARGB32), imageData2);
-            else
-                convertImage(*noneScaled, imageData2);
+            convertImage(*noneScaled, imageData2);
             uLongf len = imageData2.size();
             uLongf destLen = len + len/100 + 13; // zlib requirement
             Bytef* dest = new Bytef[destLen];
@@ -956,7 +955,7 @@ int QPdfEnginePrivate::addImage(const QImage &img, bool *bitmap, qint64 serial_n
         bool hasAlpha = false;
         bool hasMask = false;

-        if ((!uns && format == QImage::Format_ARGB32) || (uns && noneScaled->format() == QImage::Format_ARGB32)) {
+        if (format != QImage::Format_RGB32) {
             softMaskData.resize(w * h);
             uchar *sdata = (uchar *)softMaskData.data();
             for (int y = 0; y < h; ++y) {

With this, it generates the PDF properly for the test cases from earlier issues as well as the test case given by @bri2.

@ashkulz ashkulz closed this in aa6f83b Jul 2, 2015

@ashkulz ashkulz added Fixed and removed Regression labels Jul 2, 2015

DanielCeregatti added a commit to DanielCeregatti/wkhtmltopdf that referenced this issue Jul 8, 2015

fix broken rendering of transparent images when converting to PDF
The fixes for wkhtmltopdf#1512 and wkhtmltopdf#1638 were band-aids but did not fix the
underlying problem. Updating the patched Qt should fix wkhtmltopdf#2214.
@ashkulz

This comment has been minimized.

Member

ashkulz commented Jul 14, 2015

A preview for the next release 0.12.3-dev-79ff51e is available, which should contain the fix for this issue. Please report back if it is not solved with the above version.

Please note that the above downloads will be removed after the 0.12.3 release.

@PhilterPaper

This comment has been minimized.

PhilterPaper commented Aug 15, 2015

Just to confirm, I am seeing this problem (PNG transparent background rendered as black) on 0.12.2.4 (Win 7, 64 bit). I also see it with GIF.

@ashkulz

This comment has been minimized.

Member

ashkulz commented Aug 27, 2015

@PhilterPaper: is it not fixed for you with 0.12.3-dev?

@PhilterPaper

This comment has been minimized.

PhilterPaper commented Aug 27, 2015

I haven't tried a later version yet. It was easier just to do a workaround with setting the background to the desired color (white), rather than transparent. The code has been released to the customer and so far they're happy. I'll try to get to 0.12.3 (isn't it time for a release 1 by now?) within a week or two.

@digitalmoran

This comment has been minimized.

digitalmoran commented Dec 3, 2015

I am working on a project where using the 0.12.3 development release is not an option. After exploring the issue further, it appears to happen when the dpi of the PNG image is much higher than the dpi of the pdf. In my case the source PNG image was 300 dpi and the PDF was 96 dpi. When I changed the source image dpi to 150 or 96 the background is transparent as expected. On OSX I used: sips -g all image.png to see the image metadata like color profile, dpi, etc.

@ashkulz

This comment has been minimized.

Member

ashkulz commented Jan 21, 2016

0.12.3 has been released, which should contain the fix for this issue. Please report back if it is not solved with the above version.

Note that the preview downloads mentioned above have been removed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment