GD Lib TTF Font Mattes
Posted: Thu Oct 01, 2009 3:46 am
Hi there,
I have created a CMS on a very heavily jQueried web site: http://rnmtest.co.uk/oddfellows/#
One problem I have is that the client specifically wanted Trajan Pro to be used for the headers, which are taken from a database (the CMS), so normally I'd just use a static image, but with there being a CMS, and thus dynamic content, this is impossible.
My solution: create a script that generates an image on-the-fly.
The script works perfectly on the left menu, but there are issues when a menu item is clicked and the page slides out. The problem is the matte on the text. A black matte around the text is automatically added so that it appears flawlessly on black backgrounds - my problem is that it's on a white(ish) background, so I get that horrible jaggedy border.
My question is how to change the matte to white or remove it completely, as I know from using Photoshop and the like that you can save 24-bit PNG's that work fine on any background. Below is my current code, please note that the left menu uses 'Gill Sans', which is why there are if-statements - the font is not the issue as the same problem occurs if I use Gills Sans in the slide-out area.
I have created a CMS on a very heavily jQueried web site: http://rnmtest.co.uk/oddfellows/#
One problem I have is that the client specifically wanted Trajan Pro to be used for the headers, which are taken from a database (the CMS), so normally I'd just use a static image, but with there being a CMS, and thus dynamic content, this is impossible.
My solution: create a script that generates an image on-the-fly.
The script works perfectly on the left menu, but there are issues when a menu item is clicked and the page slides out. The problem is the matte on the text. A black matte around the text is automatically added so that it appears flawlessly on black backgrounds - my problem is that it's on a white(ish) background, so I get that horrible jaggedy border.
My question is how to change the matte to white or remove it completely, as I know from using Photoshop and the like that you can save 24-bit PNG's that work fine on any background. Below is my current code, please note that the left menu uses 'Gill Sans', which is why there are if-statements - the font is not the issue as the same problem occurs if I use Gills Sans in the slide-out area.
Code: Select all
<?php
$im = imagecreatetruecolor(280, 20);
$string = $_GET['text'];
// Make the bg color transparent
$black = imagecolorallocate($im, 0, 0, 0);
$transparent = imagecolortransparent($im, $black);
// Set the text color
if(empty($_GET['font'])){
$textcolor = ImageColorAllocate($im, 255, 255, 255);
} else if($_GET['font'] == 'gillsans'){
$textcolor = ImageColorAllocate($im, 255, 255, 255);
} else if($_GET['font'] == 'trajan'){
$textcolor = ImageColorAllocate($im, 253, 6, 61);
}
// Set the font
if(empty($_GET['font'])){
$font = 'GIL.TTF';
} else if($_GET['font'] == 'gillsans'){
$font = 'GIL.TTF';
} else if($_GET['font'] == 'trajan'){
$font = 'TRAJAN.TTF';
}
// Write the text
if(empty($_GET['font'])){
imagettftext($im, 12, 0, 0, 15, $textcolor, $font, $string);
} else if($_GET['font'] == 'gillsans'){
imagettftext($im, 12, 0, 0, 15, $textcolor, $font, $string);
} else if($_GET['font'] == 'trajan'){
imagettftext($im, 14, 0, 0, 15, $textcolor, $font, $string);
}
// Output the png
header("Content-type: image/png");
imagepng($im, NULL, 0, PNG_ALL_FILTERS);
imagedestroy($im);
?>