JavaScript 無名関数ネタMac 買うべきか…

February 20, 2010

JavaScript を PNG画像化



自前のPngEncoderは使わず、HTML5 のCanvasで実装。
IE以外で動作するはず。

JavaScriptをPNG画像に埋め込む

埋め込みたいJavaScriptをテキストエリアに貼り付けて、「画像生成」をクリック。(エントリのページ表示3秒後に、イベントリスナ登録用のスニペットが自動で貼り付けられますので、気軽にクリックしてください)



(マルチバイト文字には未対応)





画像が表示されたら、一旦DL後、端末上の画像編集ソフトで開き、256階調モノクロで保存し直す等して圧縮率を高める。


古いソフトだけど、Fireworks MXの「書き出しプレビュー」例

ちなみに、







動作確認したのは firefoxのみ。他のブラウザは未確認。

あと、IE(excanvas)では確実に動作しません。
excanvas には createImageData() って無いだろうし。


(3/12 追記)
自前のPNGエンコーダを使うときは、必須ではないが推奨されるチャンクsBITの指定が必要。
これを解決できれば、さまざまなカラータイプでコードをPNGに埋め込むことが可能。
sBITは、「可逆変換を求める場合」は必須のチャンクといえる。


silverlight2_games at 07:12│Comments(0)TrackBack(0)

トラックバックURL

コメントする

名前
 
  絵文字
 
 
JavaScript 無名関数ネタMac 買うべきか…