1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

[HELP] Calculating font/text string width

Discussion in 'PHP' started by Swefx, Jun 24, 2007.

0
  1. #1
    Hey,

    So something that I was recently reading about was embedding fonts into webpages so that even though a font isn't on a users computer they can still see the font. I can find tutorials on how to do this myself but...

    Something else caught my attention aswell. If you look at this: http://www.1001fonts.com/font_details.html?font_id=3101 you will see you can type in your own font preview and what I noticed was the string of characters is automatically sized down so that it remains on the same line.

    So if you type in a word that is too long to fit into one line at size "48" text it will automatically lower the size of the text to "36" or whatever fits.

    Does anybody have any ideas how to do this? This feature will be essential in a current project I am making.

    +rep for anybody who can help me with this and if anybody is really helpful I am willing to put their links up on a few of my websites or do some minor web design work for them.

    Thanks in advance!
     
    Swefx, Jun 24, 2007 IP
  2. ansi

    ansi Well-Known Member

    Messages:
    1,483
    Likes Received:
    65
    Best Answers:
    0
    Trophy Points:
    100
    #2
    pretty much what they do is use the gd2 library with freetype and then upload all the fonts to their server and create an image with the text of your choice in the font you choose and then scale it to the width of the background image.

    here's something i came up with. 2 files. index.php and index2.php

    index.php
    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> new document </title>
 </head>

 <body>
  <form action="<?=$_SERVER['PHP_SELF'];?>" method="post" style="margin:0 0 10px 0;">
	<label for="input">Text: </label>
	<input type="text" size="40" id="input" name="mytext" />
	<input type="submit" value="make it" />
  </form>
  <?php
	if (isset($_POST['mytext']))
	{
	?>
	
		<img src="index2.php?text=<?=urlencode($_POST['mytext']);?>" alt="" />

	<?php
	}
	else
	{
	?>
		<img src="index2.php" alt="" />
	<?php
	}
  ?>
 </body>
</html>
    PHP:
    and index2.php

    
<?php

if (isset($_GET['text']))
	$Text = urldecode($_GET['text']);
else
	$Text = "type something";

/* Get image info */
$Image = @ImageCreateFromJPEG ("bg.jpg") ;
$sx = imagesx($Image) ;
$sy = imagesy($Image) ;

/* Set text info */

$Font="arial.ttf" ;
$FontColor = ImageColorAllocate ($Image,0,0,0) ;
$Rotation = 0 ;
/* Make a copy image */
$OriginalImage = ImageCreateTrueColor($sx,$sy) ;
ImageCopy ($OriginalImage,$Image,0,0,0,0,$sx,$sy) ;
/* Iterate to get the size up */
$FontSize=1 ;
do
	{
	$FontSize += .1 ;
	$Box = @ImageTTFBBox($FontSize,0,$Font,$Text);
	$TextWidth = abs($Box[4] - $Box[0]) ;
	$TextHeight = abs($Box[5] - $Box[1]) ;
	}
while ($TextWidth < $sx*0.9) ;
/*  Awkward maths to get the origin of the text in the right place */
//$x=1;
//$y = 95;
$x = $sx/2 - cos(deg2rad($Rotation))*$TextWidth/2 ;
$y = $sy/2 + sin(deg2rad($Rotation))*$TextWidth/2 + cos(deg2rad($Rotation))*$TextHeight/2 ;

ImageTTFText ($Image,$FontSize,$Rotation,$x,$y,$FontColor,$Font,$Text);
/* merge original image into version with text to show image through text */
ImageCopyMerge ($Image,$OriginalImage,0,0,0,0,$sx,$sy,50) ;

ImageJPEG ($Image) ;
?>
    PHP:
    though the math isn't spot on so you will need to play with it and blah blah but just an example. most of index2.php can be found @ http://php.net/manual/en/function.imagettftext.php#70946
     
    ansi, Jun 24, 2007 IP
    Swefx likes this.
  3. Swefx

    Swefx Guest

    Messages:
    227
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Wow dude! Thanks!

    I'm not on my home computer yet but when I get back I'll try it out.
     
    Swefx, Jun 25, 2007 IP
  4. Swefx

    Swefx Guest

    Messages:
    227
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #4
    The script isn't working. I was talking to Ansi and it worked on his local system but not when he uploaded it.

    If anybody has any clue how to get it working that would be great.
     
    Swefx, Jun 25, 2007 IP
  5. dp-user-1

    dp-user-1 Well-Known Member

    Messages:
    794
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    110
    #5
    Forcing a user to download a font is a bad idea. Use GD.
     
    dp-user-1, Jun 25, 2007 IP
  6. ansi

    ansi Well-Known Member

    Messages:
    1,483
    Likes Received:
    65
    Best Answers:
    0
    Trophy Points:
    100
    #6
    i do believe that does use GD.
     
    ansi, Jun 26, 2007 IP