古籏一浩のJavaScriptラボ ― 第26回
Photoshopを超えた!?BridgeとJSで作る画像フィルター
2010年02月22日 11時00分更新
そのほかの画像処理機能
ここまでに紹介したとおり、BridgeのJavaScriptを使うとピクセル単位での書き込み／読み出しができます。最後に、Bridgeのそのほかの画像処理機能を紹介しておきましょう。
といっても、リサイズ(resize)と回転(rotate)ぐらいしかありませんし、リサイズはPhotoshopの処理に比べると画質がかなり悪く、回転も90度単位でしかできないなど、あまり実用的とは言えません。細かく説明するよりも実際のサンプルを見た方が早いでしょう。サンプル05が画像を320×240ピクセルにリサイズするスクリプト、サンプル06が画像を90度回転するスクリプトです。
●サンプル05
#target "Bridge"
var imgPath = File.openDialog ("画像ファイルを選択してください", "", false);
var myCanvas = new BitmapData(imgPath);
var newImage = myCanvas.resize(320, 240);
newImage.exportTo(new File("~/BridgeSample_0002.jpg"), 100);
●サンプル06
#target "Bridge"
var imgPath = File.openDialog ("画像ファイルを選択してください", "", false);
var myCanvas = new BitmapData(imgPath);
var newImage = myCanvas.rotate(90);
newImage.exportTo(new File("~/BridgeSample_0003.jpg"), 100);
◆
次回はいよいよBridge入門の最終回です。ランダムに点を描画するフィルターにGUI（グラフィカルユーザーインターフェース）をつけてみましょう。それでは、また次回。
この連載の記事
- 第53回 Mac用ウィジェットをHTML/CSSで自作
- 第52回 Web技術で作るDashboardウィジェット開発入門
- 第51回 iOS 4.2×localStorageで作るGPSレコーダー
- 第50回 HTML5 SVGで作るシューティングゲーム
- 第49回 HTML5のInline SVGをJavaScriptで操作
- 第48回 HTML5で注目！インラインSVGの使い方
- 第47回 iOS 4.2の新機能で作るHTML5+JSアプリ
- 第46回 JavaScriptでEPUBビューアーを自作してみた
- 第45回 Audio Data APIでブラウザーをシーケンサーに！
- 第44回 Firefoxでソフトシンセも作れるAudio Data APIの使い方
- この連載の一覧へ
