Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TCPDF image quality issues

Tags:

image

tcpdf

I'm using a TCPDF to generate PDF documents and I'm trying to add a logo into header, but I have a problem with the image quality and later as I found out, with scaling also.

The images inserted into PDF documents with TCPDF suffer from quality losses and size issues. I don't care so much for the size because I can change it, but I can't restore the quality of image.

What I have tried:

  • TCPDF scaling and quality issue
  • tcpdf: poor image quality
  • I have also converted header into HTML code, same quality degradation occurrs.
  • Removed all other options for $pdf->Image() and left everything in default - image size increased to (presumably) original size with the same quality issues.

This is the code I'm using to insert an image:

$this->Image("../images/logo.jpg", 8, 10, 35, '', 'JPG', '', 'T', false, 0, '', false, false, 0, false, false, false);

And this is the beginning of createPDF() function:

$pdf = new MYPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
$pdf->SetCreator('PHP TC-PDF Generator');
$pdf->SetDefaultMonospacedFont(PDF_FONT_MONOSPACED);
$pdf->SetMargins(8, 50, 8); // page margins
$pdf->SetAutoPageBreak(TRUE, 30);
$pdf->setImageScale(1);
$pdf->setFontSubsetting(true);
$pdf->SetFont('helvetica', '', 12, '', true);
$pdf->AddPage();
$pdf->setTextShadow(array('enabled'=>false));

Any other recommendations?

Alternative: I'm willing to change TCPDF with any other PDF generator, if it supports HTML tables and can insert images with better quality.

Your help will be greatly appreciated.

like image 240
Kristjan O. Avatar asked Oct 18 '13 11:10

Kristjan O.


2 Answers

To make the image bigger, increase the defined width. You appear to be using the default units of mm so you are specifying a width of 35 mm. If you want a bigger image, change that number to the desired width.

For a better quality image, start with a bigger image. You may have to experiment, but try 1.531 times bigger. If you make it too big, then it may look choppy when scaled.

I would use PNG. The PNG format is better suited to images with text and solid colours like you have there. But If you want to use JPG, then try increasing the image quality with the SetJPEGQuality() method. I believe the default is 75.

Scaling

If you specify a dimension, then the image scale value is not used. If you don't want to specify the size explicitly, then set the scale factor accordingly with the setImageScale() method. So if you make your image 1.53 times bigger than the desired size, set the scale to 1.53.

Note: The description in the docs for setImageScale() is misleading, IMO. It doesn't really have anything to do with converting pixels to user units. That conversion is handled by the script internally.

Zoom Level

Be aware that the image will not look good at all zoom levels, regardless of what you do. You can set the initial zoom level with the SetDisplayMode() method. TCPDF defaults to page width, which will be more than 100% on most modern desktops and laptops.

Image Size

The dimensions passed to the Image() method use the defined user units (default is mm). While there are some technical differences between dpi and ppi, they only apply to print.

So for our purposes:

72 pixels = 72 points = 1 inch = 2.54 cm = 25.4 mm

Therefore, if you want an image 40 mm wide, try creating an image that is 173 pixels wide.

40 mm * 72 px / 25.4 mm * 1.53 scale factor

Vector Images

If image quality is really important, you should consider using one of the vector formats. Check the TCPDF manual for ImageSvg() or ImageEps() methods.


Footnotes

  1. I've found that at 100% zoom, there is an appreciable improvement in quality when the original image is 1.53 times bigger than the desired size. When I first started fiddling with TCPDF and image quality, I came across the number 1.53 numerous times. However, there was never any explanation as to where that number came from. I believe I have finally figured that out. Adobe Reader uses a resolution of 110 ppi by default, and TCPDF creates a document that is 72 dpi. 110 / 72 = 1.53
like image 68
toxalot Avatar answered Nov 09 '22 09:11

toxalot


I had the same issue and none of the previous suggestions worked for me either. My salvation was THIS. The secret is to use your pdf logo as template, see the result using Google logo:

enter image description here

1) You need a PDF logo version 1.4 (the current PDF versions are not supported). To do so pick a high quality png,jpeg, etc logo and convert to PDF 1.4 using this site.

2) Download FPDI library.

3) Follow the instructions from the first link,and that I'm copying here:

<?php
// just require TCPDF instead of FPDF
require_once('tcpdf.php');
require_once('fpdi.php');

class PDF extends FPDI
{
/**
 * "Remembers" the template id of the imported page
 */
var $_tplIdx;

/**
 * Draw an imported PDF logo on every page
 */
function Header()
{
    if (is_null($this->_tplIdx)) {
        $this->setSourceFile("logo.pdf");
        $this->_tplIdx = $this->importPage(1);
    }
    $size = $this->useTemplate($this->_tplIdx, 130, 5, 60);

    $this->SetFont('freesans', 'B', 20);
    $this->SetTextColor(0);
    $this->SetXY(PDF_MARGIN_LEFT, 5);
    $this->Cell(0, $size['h'], 'TCPDF and FPDI');
}

function Footer()
{
    // emtpy method body
}
}

// initiate PDF
$pdf = new PDF();
$pdf->SetMargins(PDF_MARGIN_LEFT, 40, PDF_MARGIN_RIGHT);
$pdf->SetAutoPageBreak(true, 40);
$pdf->setFontSubsetting(false);

// add a page
$pdf->AddPage();

// get external file content
$utf8text = file_get_contents('examples/data/utf8test.txt', true);

$pdf->SetFont('freeserif', '', 12);
// now write some text above the imported page
$pdf->Write(5, $utf8text);

$pdf->Output();
like image 40
carla Avatar answered Nov 09 '22 09:11

carla