2

I am using this code to creating images with text written in it with transparent backgrounds.

 <?php
 // Set the content-type
 header('Content-Type: image/gif');

 // Create the image
 $im = imagecreatetruecolor(400, 150);

 // Create some colors

 $black = imagecolorallocate($im, 0, 0, 0);
 $acolor = imagecolorallocate($im, 153, 204, 153);
 imagecolortransparent($im, $black);

 // The text to draw
 $text = 'Testing...';
 // Replace path by your own font path
 $font = 'arial.ttf';

 // Add the text
 imagettftext($im, 50, 0, 10, 100, $acolor, $font, $text);

 // Using imagegif()
 imagegif($im,"img.gif");
 imagedestroy($im);
 ?>

But text which is written in img.gif has some unwanted color(Black) on borders of alphabets('e,s,n,g'). How can i finish that color.The generated image is
The arial font download site is http://code.google.com/p/ireader/downloads/detail?name=arial.ttf

yunzen
  • 32,854
  • 11
  • 73
  • 106
Ali Nouman
  • 3,304
  • 9
  • 32
  • 53
  • Not entirely clear what you mean: could you provide a sample graphic to demonstrate the problem? Also, I'm not sure what you're trying to do here, but if you're using these graphics to display text on your site, it might be possible to achieve it better using HTML/CSS without using graphics at all. But it depends what you're trying to do. – Spudley Oct 11 '11 at 08:15
  • @Spudley this code outputs this image written 'testing' in it http://imageshack.us/photo/my-images/851/imgsi.png/ in alphabet 'e','s','n' and 'g' there is little black on borders so i dont want that borders – Ali Nouman Oct 11 '11 at 08:32
  • re my second point: if all you're doing is creating graphics so you can have text in unusual fonts, you can do this in plain HTML/CSS, even with the special font, using CSS `@font-face`. Works in all browsers. See http://randsco.com/index.php/2009/07/04/p680 and http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/ for more info. – Spudley Oct 11 '11 at 08:48
  • @Spudley thanks for the links but i may have to use image in project but not sure yet . Thanks – Ali Nouman Oct 11 '11 at 09:48

1 Answers1

2

The GIF format cannot handle alpha transparency. It can have only 100% transparent (= invisible), or 100% opaque (= visible) pixels.

Your text seems to have anti-aliased, soft edges.

Those edges aren't 100% transparent, but they're also not 100% opaque - they are a mixture of foreground and background. That makes them appear softer.

Because the GIF format can't deal with these nuances, the library uses a mixture of green and black to simulate a "weaker" green.

If you use the PNG format, the problem should go away: PNG supports alpha transparency. There are some issues that you need to look into if you still need to support IE6, but for every other browser, this will work fine straight away.

Pekka
  • 442,112
  • 142
  • 972
  • 1,088