Annoying white space on the left when using GD library and text
I am working on a class that can create multiple text inputs and position them on top of each other so that they match, left and right - like this:
(source: vandret.dk )
The problem is that sometimes the text is positioned incorrectly. When drawing, it works. When drawing the letter M (and a series of other vertical-stroke letters - P, i, etc.), it puts spaces on the left and truncates the sentence on the right. If you look at the two lines below, they should align perfectly, but not like that.
(source: vandret.dk )
(source: vandret.dk )
If you right-click and view the images directly, the problem becomes more obvious.
It works like this:
- Create a blank canvas, place the text "virtually" on it to measure the width and height.
- When the dimensions are obtained, create a canvas that matches the dimensions of the text. We now have a scene about 800px wide
- Reduce a sentence or word to 400 pixels wide
- Increase the y offset for another sentence or word
- Repeat the same thing as long as we have sentences / words to display
My starting point was this and I created this code:
$fontsize = 120;
$size = imagettfbbox($fontsize, 0, "./fonts/".$fontname, $text);
$xsize = abs($size[0]) + abs($size[2]);
$ysize = abs($size[5]) + abs($size[1]);
//print_r($size);
$image = imagecreate($xsize, $ysize);
// Colors
$backgroundcolor = imagecolorallocate($image, 255, 255, 255);
$textcolor = imagecolorallocate($image, 155, 142, 138);
imagettftext($image, $fontsize, 0, 0, abs($size[5]), $textcolor, "./fonts/".$fontname, $text);
header("content-type: image/png");
imagepng($image);
and then any resizing that works. But why is the text not aligned correctly?
source to share
Resolved! This is a font issue, not a GD issue. I opened the TrueType font inside the High-Logic FontCreator and found that some letters have a separator on the left.
I used a feature in a program called the Automatic Metrics Wizard to remove all left indentation, which was done in a matter of seconds - and the font still looks acceptable. Kerning on letters like j looks a little off of it - but it will.
source to share