Search code examples
phpcharacter-encodingimagemagickbig5

ImageMagic is annotating the character codes rather than the characters in annotateimage

When I send a string of Chinese text to ImageMagick to annotate an image, the character codes get printed. For example, instead of this:

chinese

I get this:

character codes

Below is my code. Obviously, I have the font set right. When I echo $textString; in line 3, it prints correctly to the browser.

    function drawText($textString,$height,$width){
  $textString = mb_convert_encoding($textString, 'UTF-8', 'BIG-5');
  echo $textString;
  $permitted_chars = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
  $filepath =  ABSPATH . "\wp-content\uploads\h5p\content\words\\".substr(str_shuffle($permitted_chars), 0, 16).".PNG";
  $image = new \Imagick();
  $draw = new \ImagickDraw();
  $pixel = new ImagickPixel('white');

  /* New image */
  $image->newImage($width, $height, $pixel);

  /* Black text */
  $draw->setFillColor('black');

  /* Font properties */
  $draw->setFont(plugin_dir_path( __FILE__ ) .'wt034.ttf');
  $draw->setFontSize( 30 );

  /* Create text */
  $image->annotateImage($draw, 10, 45, 0, $textString);

  /* Give image a format */
  $image->setImageFormat('png');
  file_put_contents($filepath,$image);
return $filepath;
Solution

  • Looks like the $textString value passed into your function is HTML encoded. Your 我 strings are HTML entities. They render fine in browsers, but you need to decode into utf-8 before converting them to big-5.

    Try using html_entity_decode() for your conversion.

    $textString = html_entity_decode($textString, ENT_COMPAT, 'UTF-8');
$textString = mb_convert_encoding($textString, 'UTF-8', 'BIG-5');

    Or, you might try this to do it in one step.

    $textString = html_entity_decode($textString, ENT_COMPAT, 'BIG5');

    or, as you ended up doing it, like this:

    $textString = html_entity_decode($textString);