Unique Mosaic

Because the creating of mosaics might need much resources such as memory_limit and time, we recommend to use a local environment for testing (such as XAMPP) where you are able to set a large memory_limit.

Installation-Steps

• unzip the component-folder to your destination
• create a MySQL-database and import the install.sql file into it
• open the lib/config.inc.php file and set up the database settings for your created database
• have a look at the example.php

Testing with small amount of images

For testing we recommend to use a small stock of images (10 for example). Place them into the /import/-folder and set up your example project and select an image to create a mosaic from:

error_reporting(E_ALL);

ob_start();

require_once('lib/includes.inc.php');

connectToDefinedDB('DEFAULT');

// set the base pixel for each single mosaic element
// 118 pixel means 1x1 cm per single mosaic element when printing in a resolution of 300 dpi
// 300 dpi = 118 dots per cm   <-- (300 dpi / 2.54)
$size = 118;
ini_set('memory_limit', '3048M');
ini_set('max_execution_time', 60*300);

// set our input image
$tf = new imgtransformer('images/input.jpg');

// set the project name 
// from there we load the resized images
$tf->setProject('my-project');

// neighboored pixels aren't used to determine single pixel color
$tf->setSurrouding(false);

// set the import directory if you want to add new images to your project
// and also start directly the import from import/ to images/my-project/
$tf->importDir('import/');

// resize images from images/my-project/ to images/resized_my-project/ with $size
// each single image will be resized to 118x118 px
$tf->transformDir('images/my-project/', 'images/', $size, array($size,$size));

With this code the component will copy your source images into the images/my-project/ -folder and creates a smaller version of each image (118x118 in this case) into the images/resized_my-project/ -folder. The destination-size can be set by yourself. At a later point we will discuss the best target size.

Please check now your images/ -folder for the new images and be sure to clean the import/-directory or uncomment the source code lines for importing and transforming because we just need no more images to import at this point.

Each copy and resizing will be logged into the log/-folder . This will help you when creating large mosaics where you will get no response for some minutes until the code has finished.

Updating the color database

When creating a mosaic each pixel of your destination image will be checked for a relating mosaic-part image. For that we use to know each average colors of your images. So we will walk each image and save their colors in the database:

// get color of each image of images/resized_my-project/ and store them in database
$tf->generateMidColor('images/', $size, 'mergePalette');

After that your database-table will have a list of images and their average colors.

Scaling the mosaic draft (source)

Imagine your input.jpg has a dimension of 200x150 px. Your finished mosaic will contain of 200x150 images. If this is too much, you can downscale the mosaic draft:

// resize or input image to 50% of original size
$tf->reducePixelsOnTemplateImage(50);

With this example we create a new mosaic draft with a new size of 100x75 px. Also if you doesnt want to resize the draft, please still call this method with the value of 100.

Now you would have the following files in your images/-folder: - input.jpg - reduced_50_input.jpg (the smaller variant)

You are ready now to create your mosaic!!!

Generating the mosaic

Calling generateMosaicTemplate($size) will create a large template file where each place-holder pixel will be replaced by a matching mosaic-part. The method returns the template image and via generateMosaicParts() you can start your mosaic:

// generate mosaic template and store in $newFile
// and create the mosaic
if(($newFile = $tf->generateMosaicTemplate($size)) !== false) {
    $tf->generateMosaicParts($size, $newFile, array(10,25,50,'255_a'));
}else{
    echo 'error creating the mosaic template file';
}

After calling generateMosaicTemplate() you will get a template_118_input.jpg as mosaic template. While creating your mosaic you can have a look at the logfiles to check the progress. Your finished file will be saved as final_input.jpg or final_reduced_x_input.jpg

Each mosaic is unique and the quality of the finished image depends on your available mosaic-parts you provide.

That means: more images = more choices = more variance = better result

For example: An image of a forest will look best if you have much nature photos for input!

When creating the mosaic the component checks each pixel for a matching image. This will be done in several loops. Each loop you can define the variance for the image search:

$tf->generateMosaicParts($size, $newFile, array(10,25,50,'255_a'));

In this example each pixel check will work like this: - search an andom image with an average color +/- 10 colorsteps - search an andom image with an average color +/- 25 colorsteps - search an andom image with an average color +/- 50 colorsteps - search an andom image with an average color +/- 255 colorsteps (which means ALL images) and colorize them with the target pixel color (what the "_a" stands for)

With this settings I've got the best results.

The $size

With this param you set the pixels of the resized images when importing/transforming your source images. The $size describes how much pixel each single mosaic-part will be in your final mosaic. This is very import for printing your mosaic. When you let print your mosaic and the printer will have a resolution of 300 dpi, you're images has to have a resolution of 118px so you have small parts of 1x1 cm per item in real. If you want to have larger pieces (e.g. 2x2 cm) you can set the $size to 236px . You just have to calc the target dpi and the size each of your parts have to be.

Have a look at the screenshots to see finished results. Your website or your real live can be enriched by such mosaics!!!

Any questions? Please easily leave a comment :)