http://to-a.ru
元ネタは言わなくてもお分かりいただけるでしょうが、某禁書目録や某超電磁砲のタイトル風画像を作れるだけのサイトです。
ちなみに、「とある画像の自動生成」というサイトが既にあるのですが、Silverlightベースなのでクライアントのインストールが必要ですし、そのほかにも改良したいところが多かったので、自分で作りました。
改良したところ
- サーバでの生成方式に変えた
- グラデーションの粒度を細かくした
- すべての文字にアンチエイリアスをかけた
- フォントを極太明朝に変えた（HG明朝Ｅ）
- サーバへの保存機能を設けた
- とある???で、3文字入力を可能にした→ ex. とあるラジオの超電磁砲
今回は、ＰＨＰ＋ＧＤで書いたのですが、文字に斜めの滑らかなグラデーションをかけるのは意外と難しく、文字データとグラデーションを別個で作って、独自のルーチンで合成するということをしました。
ImageMagickのレイヤーを使えば簡単だと言う情報をさまざまな人から寄せられたのですが、「プログラマたるもの制約の中で最高のアウトプットを出さんとあかん」ということで、ＧＤのままです。（といいつつ、「ここまで作ったしＧＤでいいや」ってのが本音ですｗｗ）
まず、グラデーションを生成するコード。
]]>
# サイズの指定
$maxx = 640;
$maxy = 300;
$start = -200;
$end = 300;
# 色の初期化
$fg1 = array( 233, 19, 29 ); #開始色
$fg2 = array( 235, 115, 52 );
# グラデーションイメージの作成
$imggra = imagecreatetruecolor($maxx, $maxy);
# 開始色で塗りつぶし
$col = imagecolorallocate($imggra, $fg1[0], $fg1[1], $fg1[2]);
imagefill($imggra, 0, 0, $col);
# グラデーション作業の開始
for( $i=$start; $i<$end; $i++ ){
# グラデーションの色のステップ
$per = ($i-$start) / ($end-$start);
# 色の作成
$r = $fg1[0] + ($fg2[0] - $fg1[0]) * $per;
$g = $fg1[1] + ($fg2[1] - $fg1[1]) * $per;
$b = $fg1[2] + ($fg2[2] - $fg1[2]) * $per;
$col = imagecolorallocate($imggra, $r, $g, $b);
# グラデーションを描く
imageLine($imggra, $i, 0, $maxx-1, $maxx-$i, $col);
}
# 終了色で残りのエリアの塗りつぶし
$col = imagecolorallocate($imggra, $fg2[0], $fg2[1], $fg2[2]);
imagefill($imggra, $maxx-1, 0, $col );
作成できた画像
グレースケール書かれた文字と、上記のグラデーションを合成する
$font = "HGminchoE/HGRME.TTC"; # フォントを指定
# メインイメージの作成（グレースケールで文字を描く）
$im = imagecreatetruecolor($maxx, $maxy);
$black = imagecolorallocate($im, 0, 0, 0);
$white = imagecolorallocate($im, 255, 255, 255);
imagefill($im, 0, 0, $white );
ImageTTFText ($im, 100, 0, 100, 200, $black, $font, "とある");
# 合成する
for($x=0; $x<$maxx; $x++){
for($y=0; $y<$maxy; $y++){
# グラデーション色を取得
$rgb = imagecolorat($imggra, $x, $y);
$r = ($rgb >> 16) & 0xFF;
$g = ($rgb >> 8) & 0xFF;
$b = $rgb & 0xFF;
# 文字パターンの色を取得（グレースケール）
$mask = imagecolorat($im, $x, $y);
$alpha = $mask & 0xFF;
# 文字にグラデーション色を貼り付け
$r += $alpha; if($r>255) $r=255;
$g += $alpha; if($g>255) $g=255;
$b += $alpha; if($b>255) $b=255;
# 新しい色をセット
$col = imagecolorallocate($im, $r, $g, $b);
imagesetpixel($im, $x, $y, $col);
}
}
作成された画像
ちなみに、本サイトを作るにあたってMS Officeに付属するＨＧ明朝Ｅが一番グッときたのですが、色々調べてみるとサーバにコピーして利用してはいけないようです。
Office付属のフォントは、インストールしたＰＣに対するライセンスなので、自分のＰＣにあるフォントをサーバにコピーした時点で、複数台へのインストールとみなされますし、そもそも目的外利用になるそうです。
さまざまなサイトで、Windowsから取り出したフォントをＧＤで利用していますが、本当はダメなので、要注意です。
ということでＨＧフォントを調べたのですが、Microsoftは「うちは関与しない」というスタンスであり、作成元のリコーにてライセンス処理が行えるとのことらしいので、Ａ方式と呼ばれるライセンスをリコーから購入しました。
そこそこ値段はしますが、オンラインで手続き出来るので便利です。
というわけで、お粗末さまでした。
どうでもいいですが、先日の日曜日に一日で作ったので名実ともに日曜プログラミングです。
2009/12/25 2:00追記
上記のとおり、今回はHG明朝Eを使いましたが、オリジナル作品ではAdobeの小塚明朝が使われているとの情報を皆様よりお寄せ頂きました。
一応、個人所有のAdobe製品に同フォントが付属していたのですが、サーバで利用するためのライセンスがわからないので、利用するのは控えたいと思います。（使えるとの情報もありましたが、信憑性がないので・・・）
その上で、InDesign Server CS4を購入する以外の方法で、同フォントを利用する方法をご存知の方がおられれば、ぜひともコメント頂ければ幸いです。]]>
みる人が見ればわかる、そうラック型の箱に入ったチョコです。
ちなみに、ラックは手作りで、中にはチロルチョコが入っています。
以下は、ラックが並んだところ。
壮観ですね。
ただ、チョコはラックに乗っかっているだけなので、うっかりするとポロっと落ちてしまいます。
実際のデータセンターでも、ラックにマウントしていないお客様を見かけますが、サーバーがポロっと落ちたとなるとシャレになりませんから、地震対策用具などを活用して事故の無いようにお気を付け下さい。
ところで、嫁さんからは蛙チョコを貰いました。リアルです。
ちなみに、なぜ電車の運転士かというと、私が電車好きであることをした上でのことだと思われます。
猫はうちでやってる、さくらのレンタルサーバのキャラだと思いますが、何とも胡散臭い仕上がりになっています。
本当は先月紹介されたのですが、なにはともあれ今年もよろしくお願いいたします。
]]>
専用サーバは一匹だけのんびりインターネットにぶら下がっています。
専用サーバ複数台サーバは、インターネットにぶら下がったウェブサーバの下に、ＤＢサーバがぶら下がっています。
専用サーバプラットフォームは、ファイアーウォールを介して、さまざまなサーバがネットワーク化されています。ちなみにＤＢサーバはローカル側にしかつながっていません。
サメも心なしか寂しそうにしていますね。
年末押し詰まる忙しい中とは思いますが、うちの営業が挨拶回りとともに配ってますので、笑顔で受け取ってもらえるとうれしいです。
ちなみに、専用サーババージョン。
]]>