Unicode font broken when merge images & text using php - php

I tried to merge text with images, but my text not rendering correctly after merge.
See my screenshot:
The Red mark ( আমি তোমায় ভালবাসি ) text format is correct while I normally show the variable. Font Link: http://www.fonts2u.com/solaimanlipi.font
But while I merge text with image, its broken or not render correctly.
Here is my full code:
<?php
mb_language('uni');
mb_internal_encoding('UTF-8');
$username="";
if(isset($_POST['user'])){
$username = $_POST['user'];
$username = mb_convert_encoding($username, 'HTML-ENTITIES',"UTF-8");
$username = html_entity_decode($username,ENT_NOQUOTES, "ISO-8859-1");
}
$im = imagecreatefromjpeg('image.jpg');
//The numbers are the RGB values of the color you want to use
$black = ImageColorAllocate($im, 255, 255, 255);
//The canvas's (0,0) position is the upper left corner
//So this is how far down and to the right the text should start
$start_x = 50;
$start_y = 80;
$font = 'SolaimanLipi.ttf';
Imagettftext($im, 50, 0, $start_x, $start_y, $black, $font, "$username");
//Creates the jpeg image and sends it to the browser
//100 is the jpeg quality percentage
Imagejpeg($im, 'result.jpg', 100);
echo "<div style='color:red;font-size:60px;'>".$username."</font><br /><img src='result.jpg' height='500' />"
?>
Note 1: SolaimanLipi.ttf is Bangla (Unicode) Font.
Note 2: Bangla (Unicode) font not rendering correctly in tcpdf This Stack & Stack solution will help you to understand my problem & give me a solution.
Please someone help me to get out this problem. Thanks in advance.
[[Previously I asked the same question and no one answer. So I re-post this and deleted the old one. I hope this time someone help me.]]

Bengali is one of a number of scripts that cannot be rendered simply by putting one character after the next. The shapes of characters change and merge depending on their neighbours.
To render this correctly, you need a set of features known as Complex Text Layout. On text rendering systems that do not support CTL, you'll get the equivalent of each letter being rendered alone, so আমি comes out like আ ম ি.
The GD library used by PHP's imagettftext function does not support Complex Text Layout. You'd have to use some higher-level rendering library such as Pango. This is a bit of a pain; if you can achieve your aims by rendering the text over the image as part of HTML/CSS/SVG that would certainly be easier.
(BTW writing $username out to the HTML without doing htmlspecialchars() is an XSS security hole, and writing-then-serving the JPEG file is unsafe as it will break if two requests come in at the same time. You should also serve your page/form as UTF-8 by adding <meta charset="utf-8"/> so you don't have to do the crazy dance with mb_convert_encoding/html_entity_decode).

Related

Font rendering issue with imagefttext in PHP

I am running into a weird font rendering issue when writing text over images using imagefttext().
$img = imagecreatefromjpeg( $canvas_image_path );
imagettftext( $img, $font_size, 0, $x, $y, $font_color, $font_path, $text );
I have a tool which selects a background image (different sizes - JPEGs (.jpg)) to work on and then write the text over it which comes from an WYSIWYG editor.
Using Bodoni-italic font, for certain image sizes the rendering of i is weird.
Spacing looks weird after T
It works absolutely fine for images that are small like 320 x 240 or big like 1536 x 2048 but for other sizes in between that range, i is written as shown in screenshot.
Now the fact that it does show up correctly for certain image sizes rule out the possibility of something being wrong with the font file itself. The only suspect I see here is the image size but I am not sure how to debug the situation from here & find a fix for it.
Any idea on where I should be looking or what can possibly cause this?

imagettftext() always gray even with black defined

A client of mine is trying to place text on a background image using imagettftext(). The code was working previously and suddenly went from displaying black text to displaying gray text. The code is properly set to black and changing it to any other color also has no effect.
$im = imagecreatefrompng("/path/to/background.png");
$text = imagecolorallocate($im, 0, 0, 0);
imagettftext($im, 10, 0,96, 201,$text, "vera", $thiscardnumber);
imagepng($im, "/path/to/new/".$imagefilename.".png");
imagedestroy($im);
Any help would be appreciated as nothing was changed in the code or on the server that I am aware of to suddenly stop this from generating proper black text.
You can see the text generated here:
The black text is part of the background image, the gray text is generated by the code above.
EDIT: From comments below
Ah, OK. If you just recreate a the few lines of code separately, do you still get the grey text? Because I get black text with your code. What about if you try a different font, or a different base image just to eliminate them as the culprit? Have you verified what the value of $text is?
ORIGINAL Answer:
There's something amiss here. Your "x" and "y" coordinates are larger than the background image, so the text you are generating is off of the image canvas.
Is there any chance that your background image just has the grey text in it already, and the text you are generating is happening outside of the image?

Bold text using imagefttext() in PHP

I have the below code and I want to bold the output.
Example:
This code;
$info['users_online']);
Outputs the users online count from my database. I want the number that is being output on the image to be bold.
Full code:
<?php
/db info all here/
$getInfo = mysql_query("SELECT users_online FROM server_status");
$info = mysql_fetch_array($getInfo);
{
$image = imagecreatefrompng("banner.png");
$black = imagecolorallocate($image, 1, 1, 1);
imagefttext($image, 6.5, 1, 293, 68, $black, 'volter.ttf', $info['users_online']);
header('Content-type: image/png');
imagepng($image);
imagedestroy($image);
}
?>
Don't mind the "/db info all here/" part. I just need the users_online to be bold when it is outputted on the image. Right now, it's not bold.
Thanks.
Use a bold font. For example a bold version of volter.ttf.
You'll want to replace the font file you're currently using (volter.ttf) with one which contains the same font, but in bold weight. If you're unable to do so, you might be able to produce a "pseudo-bold" effect by writing the string several times with a slight X-coordinate offset each time, but frankly at that point it's a lot easier just to change the font to something you can find in bold.

PHP Dynamic Image Has Undesired Border

I'm having some problems with a project I'm doing using Google Maps.
I have the map functionality all figured out, and it works great. I want to add dynamically generated icons to the map, and I've figured out how to do that as well using PHP to dynamically add the text I want to the icon image.
However, the icon is changed beyond the text I want added. The border around the original is made much thicker when there is nothing in the PHP code that should be doing anything like that. The image I've attached to this post shows the two icons. The top icon is the original, and the bottom one has the text added to it by my PHP script. Notice the thicker border.
Here's my PHP code:
<?php
// GETS THE NUMBER TO ADD TO THE ICON
$number = $_GET['number'];
// THE SOURCE OF THE ICON THAT I WANT TO ADD THE TEXT TO
$src = $_GET['src'];
header ("Content-type: image/png");
$font = 4;
$im = imagecreatefrompng($src);
// POSITION THE TEXT TO THE PREFERRED LOCATION
$x = 5 ;
$y = 2;
$textColor = imagecolorallocate ($im, 0, 0,0);
imagestring ($im, $font, $x, $y, $number, $textColor);
imagepng($im);
?>
Keep in mind that all of this is working, except the image is changed beyond just adding the text. The icons look much nicer without the really thick border.
I don't know for sure if this is the case but something like this can be caused if your initial image used transparency at the margin to get an effect of rounded corners. if you want to keep the transparency from the initial image you need to research other functions also. something like this should help:
imagealphablending( $im, false );
imagesavealpha( $im, true );
*right after imagecreatefrompng

Draw color for text background PHP and GD

I've run into another problem with GD and PHP.
I'm successfully writing text to an image.
However, I've encountered a case where it would be beneficial to place the text - instead of directly on the image - on a rectangle (or any shape) to create a solid background for the text where the image it's being placed on might not allow the text to be read very easily.
My two ideas are, in order of preference:
Fill the background with the color as it writes the text
Write the text to an appropriately sized image with a solid background, and then overlay the image onto the target
I can't figure out how to do #1 and #2 seems overly complex and I don't know how to determine the dimensions of the text so that I can create a new image for it.
For clarity, here is the output that isn't very good:
And here's how I'd like it to look, with a tight box behind the text of any color:
I'm open to any suggestions, but drawing the color on the fly without any other images or hackiness would obviously be my first choice.
Update:
After #Dan suggested using `imagettftext', I decided that it was high time I added support for that function to my library. Everything is working as would be expected except for one major issue.
The text that's written to the image is still transparent, even when written to a solid background (0 transparency).
Here's a script I wrote to test:
<?php
set_include_path('backbone:global:jquery');
require_once('Image.php');
$scout = new Image();
$scout->source = "scout.jpg";
$result = $scout->Write->Font(25, 25, "A Fairly Long String", 12, "#FF0000", 0, "LiberationSans-Regular.ttf", 1, "#FFFF00", .4, 4);
if( !isset($_GET['dev']) )
{
header("Content-Type: " . $scout->contentType());
}
if( $result )
{
$scout->output();
}
?>
The files I used/required:
1. scout
2. liberation font
3. Image Manipulation Library
- Image
- ImageBase
- ImageCombine
- ImageDraw
- ImageManipulate
- ImageWrite
I apologize about all the files, it really only uses Image, ImageBase, ImageCombine, and ImageWrite, but the others are require_onceed by the loader.
Here's a sample of the output from the script above:
And here's output with zero transparency (fully opaque):
$result = $scout->Write->Font(25, 25, "A Fairly Long String", 12, "#FF0000", 0, "LiberationSans-Regular.ttf", 1, "#FFFF00", 1, 4);
Any ideas what could be causing this? It's EXTREMELY possible that it's my code somewhere, but it seems strange that it would work exactly as I thought it should except for this one bug.
In searching desperately for the answer to this problem, I stumbled upon this SO question that's tangentially related to my problem, and contains the answer.
I've never fully understood why you tell imagealphablending false when you want transparency, so I guess my failure to properly understand the code I'm using has led to this issue.
In any case, the following modified code works like a charm in my one single test case.
To write text to a background without forced 100% transparency for the character boxes, you must turn alpha blending ON while writing the text:
imagealphablending($text->handle, true);
$bool = imagettftext($text->handle, $textSize, $angle, $padding, abs($size[5]) + $padding, $this->AllocateColor($rgba[0]['r'], $rgba[0]['g'], $rgba[0]['b'], $rgba[0]['alpha']), $font, $string);
imagealphablending($text->handle, false);
Maybe this will do the job for you if you switch to ttf. http://php.net/manual/en/function.imagettfbbox.php

Categories