Position caption on photo with php?

[Glenskie]

Hello I have a script that puts text on a picture... i need help, i dont know to position these captions ? i need the topcaption to be center top and the bottom center bottom but i do not know how to achieve this. here is my code so far, any help is greatly appreciated.

 

$picture = $_GET['image'];
            $topcaption = $_GET['topcaption'];
            $bottomcaption = $_GET['bottomcaption'];


      //Set the Content Type
      header('Content-type: image/jpeg');
       if (isset($_GET['image'])){
          
      // Create Image From Existing File
      $jpg_image = imagecreatefromjpeg("../useruploadedphotos/$picture");


      // Allocate A Color For The Text
      $white = imagecolorallocate($jpg_image, 255, 255, 255);


      // Set Path to Font File
      $font_path = '../fonts/Timeless-Bold.ttf';


      // Set Text to Be Printed On Image
      $text = $topcaption;


      // Print Text On Image
      imagettftext($jpg_image, 0, 0, 0, 0, $white, $font_path, $text);


      imagejpeg($jpg_image, "../photos/$picture");


      imagejpeg($jpg_image, "../useruploadedphotos/$picture");


       imagejpeg($jpg_image);
      // Clear Memory
      imagedestroy($jpg_image);


// header("location: success.php");
}

 

[Ch0cu3r]

Have a read on the man page for imagettftext() this function is what writes the text to your image.

 

You position the the text using the 4th and  5th arguments, these handle the xy position of the text.

[Psycho]

You'll also need to use imagettfbbox() first. That function will give you the bounding box size. From that you can calculate where to put the text so it will be centered. Look at the example code for that function.

[Glenskie]

can you show me an example with the code ive given ? i have tried others but i just cant seem to get this to work

[Psycho]

can you show me an example with the code ive given ? i have tried others but i just cant seem to get this to work

 

Did you look at the code in the manual?

[Glenskie]

yes i have 

[Psycho]

So, where is the modified code you've made and where is the problem you are now facing?

[Glenskie]

is there anyway to do this with jquery ? and php?

Edited March 31, 2014 by Glenskie

[Psycho]

is there anyway to do this with jquery ? and php?

 

Do "what" exactly with JQuery? You could superimpose text on top of an image using CSS (no JavaScript involved). Or, if you are talking about using JQuery to perform AJAX calls to PHP, yes. But, not knowing how you want to use it, I can't give you any input. I will say this, however: I don't see why you are creating the image, writing it to two different places and then also outputting it directly to the browser. It would make more sense to me to write the image ONCE to the file system and then have a normal IMG tag for displaying it.

<?php
 
if (isset($_GET['image']))
{
    ## Hard coded values
    $images_folder = '';
    $font_path = '../fonts/Timeless-Bold.ttf';
    $font_size = 10;
    $top_margin = 50;
    $bottom_margin = 50;
    $photo_directory = '../photos/';
    $upload_directory = '../useruploadedphotos/';
 
    #Variable values
    $image_name    = $_GET['image'];
    $topcaption    = $_GET['topcaption'];
    $bottomcaption = $_GET['bottomcaption'];
    $image_path     = "{$images_folder}{$image_name}";
 
    //Create image resource from source image
    $imageRes = imagecreatefromjpeg($image_path);
    //Determine the image hieght & width
    $image_x = imagesx($imageRes);
    $image_y = imagesy($imageRes);
    //Create color identifier for the text
    $black = imagecolorallocate($imageRes, 0, 0, 0);
 
    //Create bounding box for the top caption
    $bbox = imagettfbbox($font_size, 0, $font_path, $topcaption);
    //Calculate cordinates for X and Y of top caption
    $x = $bbox[0] + (($image_x-$bbox[4]) / 2);
    $y = $top_margin - $bbox[5];
    //Write top caption to image
    imagettftext($imageRes, $font_size, 0, $x, $y, $black, $font_path, $topcaption);
 
    //Create bounding box for the bottom caption
    $bbox = imagettfbbox($font_size, 0, $font_path, $bottomcaption);
    //print_r($bbox);
    //Calculate cordinates for X and Y of bottom caption
    $x = $bbox[0] + (($image_x-$bbox[4]) / 2);
    $y = $image_y - $bottom_margin;
    //Write bottom caption to image
    imagettftext($imageRes, $font_size, 0, $x, $y, $black, $font_path, $bottomcaption);
 
    //Write image to file system
    imagejpeg($jpg_image, "{$photo_directory}{$image_name}");
    imagejpeg($jpg_image, "{$upload_directory}{$image_name}");
 
    //Output to browser
    header('Content-Type: image/jpg');
    imagejpeg($imageRes);
    imagedestroy($imageRes);
 
    // header("location: success.php");
}
 
?>

Edited March 31, 2014 by Psycho

[Glenskie]

i really appreciate it but for some reason it just gives me a broken img ?

and this is for a upload website so basically it will upload with a caption to both and then an admin aproves it or denys it 

Edited March 31, 2014 by Glenskie

[Psycho]

i really appreciate it but for some reason it just gives me a broken img ?

and this is for a upload website so basically it will upload with a caption to both and then an admin aproves it or denys it 

 

 Well, that code works for me. I don't work with images much. I just took the example code from the manual and then made one change after another to meet the intent of your original code. That's what I was expecting you would do. If you are getting a broken image, then an error is occurring, but because the header is forcing the output to be an image you see a broken image. Comment out the following line to see the errors

 

header('Content-Type: image/jpg');

 

Are you sure the two directories where you are trying to save the photos exist where you think they do?

 

 

Also, your comments above still don't explain why you need to save two instances of the photo. makes no sense. Just create one file.

[Glenskie]

thank you it works i apprecitate it so much !