memorandum
thinking about creation

画像に文字を合成するシンプルなプラグイン

Entry Date _ 2016.09.16
/
ModifiedDate _ 2016.09.16

仕事で画像に動的な文字を合成する必要があったので、ついでにjQueryのプラグインにしてみました。

仕様としては、イメージダグから画像のパスを取得し、そのパスから画像をキャンバスに展開。それに文字を合成して dataURI を使って画像に変換。また同じイメージダグに出力させるというもの。

用途は少なそうですが、例えばこんなことに使えると思います。

・チケットとしてユーザーに保存させたい画像があり、それにユニークな情報を付加させたい場合。

・ユーザーに入力させた文字を画像に合成して、面白画像をつくるジェネレーターのようなもの。

使い方は特に難しいこともないので、ダウンロードしたフォルダに含まれている「example.html」を参照してください。

ダウンロード

吹き出しジェネレータ

これは、このプラグインを応用してつくった、入力した文字を吹き出し画像にするものです。
適当につくってあるのでズレたりしていますが、サンプルなのでご容赦ください。またテキストエリアの右端で改行されていても、生成された画像では改行されていません。テキストエリア内で任意に改行を入れてください。

(吹き出しの画像は「フキダシデザイン」様の素材を使わせていただきました。)

Category

memorandum index