rui live note

WordPress、PHP、子育て、ブログ、将棋、コワーキング、子育て、群馬等に関する日々感じたことを書いているブログです

*

PHP+ImagickでSVGを画像変換する手順まとめ

      2014/10/15   PHP, 開発 , , ,

  • このエントリーをはてなブックマークに追加
  • Pocket

PHP+ImagickでSVGを画像変換してみるまでの流れをまとめておきます。

実行環境はCentOS 6.2です。

手順

peclインストール

# yum -y install php-pecl

ImageMagick、iMagickインストール

# yum -y install ImageMagick ImageMagick-devel
# pecl install imagick
# echo "extension=imagick.so" > /etc/php.d/imagick.ini

日本語フォントにTakaoゴシックを使う。
Takao Fonts https://launchpad.net/takao-fonts
上記URLからダウンロードしたフォントを、/usr/share/fonts/takao-gothic/TakaoGothic.ttf に配置。

ImageMagickでフォントマッピング設定

# vi /usr/lib64/ImageMagick-6.5.4/config/type.xml
<include file="type-truetype.xml"/>  行を追加

# vi /usr/lib64/ImageMagick-6.5.4/config/type-truetype.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE typemap [
<!ELEMENT typemap (type)+>
<!ELEMENT type (#PCDATA)>
<!ELEMENT include (#PCDATA)>
<!ATTLIST type name CDATA #REQUIRED>
<!ATTLIST type fullname CDATA #IMPLIED>
<!ATTLIST type family CDATA #IMPLIED>
<!ATTLIST type foundry CDATA #IMPLIED>
<!ATTLIST type weight CDATA #IMPLIED>
<!ATTLIST type style CDATA #IMPLIED>
<!ATTLIST type stretch CDATA #IMPLIED>
<!ATTLIST type format CDATA #IMPLIED>
<!ATTLIST type metrics CDATA #IMPLIED>
<!ATTLIST type glyphs CDATA #REQUIRED>
<!ATTLIST type version CDATA #IMPLIED>
<!ATTLIST include file CDATA #REQUIRED>
]>
<typemap>
  <type name="TakaoGothic" fullname="TakaoGothic" family="TakaoGothic" weight="400" style="normal" stretch="normal" glyphs="/usr/share/fonts/takao-gothic/TakaoGothic.ttf"/>
</typemap>

sample.svg作成

<?xml version="1.0" encoding="UTF-8"?>
<svg width="200" height="200">
  <text x="0" y="20" font-size="24" font-family="TakaoGothic">Takaoゴシックです</text>
  <rect x="10" y="40" height="30" width="30" stroke-width="5" stroke="#000000" fill="#0000ff"/>
  <ellipse cx="25" cy="100" ry="15" rx="15" stroke-width="5" stroke="#000000" fill="#ff0000"/>
</svg>

sample.php作成

<?php
$im = new Imagick();
$svg = file_get_contents("sample.svg");
$im->readImageBlob($svg);
$im->setImageFormat("png24");
header("Content-Type: image/png");
echo $im;

というわけで、sample.php を実行するとこんな感じで変換された画像ができ上がりました。

svg

ad

この記事が気に入ったらシェアしてもらえると嬉しいです!

  • このエントリーをはてなブックマークに追加
  • Pocket
  • follow us in feedly
  • RSS

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

  関連記事

programming_language
プログラミング言語の使い手の呼び名を集めてみました

photo credit: nyuhuhuu via photopin cc プ …

鍵
WordPressを強化するためのセキュリティ対策32項目

みなさんの WordPress はセキュリティ対策できてますか? 世界中の We …

ffmpeg-php
ffmpeg-phpを入れてNetCommonsの動画配信モジュールを使ってみるまでのセットアップ手順

NetCommons2公式サイト 動画配信モジュール NetCommonsに動画 …

WordPress
WordPressで過去記事のリンクを画像付きで表示するショートコードの作り方

記事内で、自分のサイトの過去の投稿を紹介する機会って結構ありますが、そんな時にリ …

野球ボールわぷー
野球ボールわぷーを作ってみました

高校野球真っ盛りシーズン!ということで、野球にちなんでボールを抱き抱えたわぷーを …

PERARI
WebRTCで動画チャットできる「PERARI」というWebサービスを作りました

※この投稿は「WebRTC Advent Calendar 2014」の3日目の …

command line
svnコマンドでリポジトリ作成する手順

時代はgitなどの分散バージョン管理システムですが、私はまだ公私ともSubver …

ERMaster
ERMasterの動作が重くなった時に変更履歴の削除を試してみてはいかが

・ER Master DBのモデリングには対応DBが多く、エクスポート機能も充実 …

Prime Timeline
WordPressのコア動作を解析できるプラグイン「Prime Timeline」を使ってみた

先日読んだ「詳解 WordPress」の中でも紹介されていたプラグイン「Prim …

git2xserver
XSERVER に Git をインストールする手順

知人の XSERVER で作業をする機会があったのですが、標準で Git が入っ …