Why does the thumbnail I create have a larger file size than the original image?

Question

I want to save Google Maps images to my server. Below is the code I am using to get and save these images, and the code for creating a thumbnail. I'm using CodeIgniter for this.

//saving original image on server
$post = $_POST;
$file = file_get_contents("http://maps.google.com/maps/api/staticmap?size=".$post['w']."x".$post['h']."&sensor=false&markers=color:red|size:mid|".$post['lt'].",".$post['lg']."&&zoom=".$post['z']);

$filename = 'map_'.uniqid().'.png';
$name     = './assets/images/upload/'.$filename;
file_put_contents($name, $file);

// creating thumbnail 
$config_manip = array(
    'image_library' => 'gd2',
    'source_image' => './assets/images/upload/'.$filename,
    'new_image' => './assets/images/upload/thumb_'.$filename,
    'maintain_ratio' => false,
    'quality' => "10%",
    'width' => 480,
    'height' => 480 
);

$this->load->library('image_lib', $config_manip);
$this->image_lib->resize();

My problem is that the generated thumbnail image is much bigger in size then the original. For comparison:

• Original image
• Thumbnail image

Why is the thumbnail bigger than the original?

Answer 1

The principal difference is that your original image contains a palette, whereas your thumbnail does not. So, instead of having to store an 8-bit index into a palette for each pixel, the thumbnail has to store 3 off 8-bit true colours for each pixel. You need a way to force a palettised thumbnail - i.e. use imagecreate() rather than imagecreatetruecolor() or call imagetruecolortopalette() prior to output.

Here is the analysis of each file:

Depending on the number of colours you choose to include in your palette, you will get different file sizes as follows:

Colours    Filesize (bytes)
=======    ================
10          3,380
16         12,199
32         12,415
64         36,581
128        36,825
256        42,013