feeds2013/12/25カテゴリー:JavaScriptEaselJS用のGlowFilterを作ったよTweetメリークリスマス!最近、サンタさんとご縁のないkudoxです。0.7には、まだGlowFilterが実装されていません。Shadowクラスでグローに似た効果を得ることもできますが、Shadowクラスはcacheされないため処理負荷が高く、またChromeがバグを抱えていたりします。そこでEaselJS用のGlowFilterを作ってみました。domainで公開しますので、商用でもご自由にお使い下さい。EaselJSソースはGitHubに置いてありますので、下記リンク先からダウンロードして下さい。ZIPボタンをクリックしてね。今後、新しいFilterを作ったら、こちらにプッシュしていきますので、宜しければ覗いてやって下さい。DocumentationGlowFilterの使い方それでは、GlowFilterの基本的な使い方を見てみましょう。GlowFilterのコンストラクタに渡す引数を順番に確認してみます。基本的にはActionScript3.0と同じにしていますが、デフォルト値が若干異なるのでご注意下さい。colorグローのカラー値を0xRRGGBB形式の16進数値で指定します。デフォルト値は、0xFF0000です。alphaグローのアルファ透明度を0〜1の数値で指定します。blurX水平方向のぼかし量を指定します。このGlowFilterは、ぼかし処理でEaselJSのBlurFilterを使用しているため、この値はそのままBlurFilterに渡されます。blurY垂直方向のぼかし量を指定します。このGlowFilterは、ぼかし処理でEaselJSのBlurFilterを使用しているため、この値はそのままBlurFilterに渡されます。strengthグローの強さを0〜255の数値で指定します。この値は、小さいほど処理負荷が低くなります。qualityブラー処理の回数を指定します。このGlowFilterは、ぼかし処理でEaselJSのBlurFilterを使用しているため、この値はそのままBlurFilterに渡されます。inner内側のグローであるかをBool値で指定します。knockoutノックアウト効果を適用するかをBool値で指定します。trueを指定するとオブジェクトが透明になり、グローだけが表示されます。コンストラクタでGlowFilterインスタンスを生成したら、あとはEaselJSの他のFilterと同様にDisplayObjectのfiltersプロパティに配列で指定し、cacheメソッドをコールするだけです。以上でオブジェクトにGlowFilterが適用されます。200);_stage.addChild(_shape);Sampleあとがきバグ報告やご質問等ございましたらContact、または@u_kudoxからお願いします。それでは皆さん、楽しいクリスマスをお過ごし下さい。サンタさん、待ってます。