HTML5 JavaScriptのFlashのBitmapData.hitTest（）に相当する

Question

Flashと同じようにビットマップオンビットマップの評価ができるJavaScript（HTML5対応ブラウザ用）に、既存の同等のメソッドがあるかどうかを知りたいと思います。

また、「ぼかしフィルタ」はどのように達成できますか？ 既存のDIV/SPANタグを（FlashのBitmapData.draw（）メソッドのように）ビットマップオブジェクトに "描画"できるので、キャンバス上で "hitTest"目的に使用できますか？

私はHTML5専門用語がここで間違っていると思いますが、これはやや意味があります。

ピクセルレベルの評価で、ビットマップが互いに接触するかどうかを確認する組み込みメソッドはありますか？

ありがとうございます！

Answer 1

1. いいえ、HTML CanvasまたはContextには、2つの領域が重なっているかどうかを判断する方法はありません。不透明なピクセルが重なっていない非正方形領域のテストは行われず、変形されたバウンディングボックスが重なってテストされず、軸に沿ったバウンディングボックスが重なってもテストされません。このようなヒットテストは、あなたまたは個々のビットマップを追跡するより高いレベルのAPIによって行われる必要があります。 Canvas/Contextは、の非保有低レベルピクセルの描画および描画APIです。

2. いいえ、画像やキャンバスのコピーにdrawImage()を使用する以外は、HTML要素のレンダリングをキャンバス画像にシリアル化することはできません。これには、透明/半透明キャンバスの下に描画されたコンテンツをキャプチャしようとすることが含まれます。これが許可されているとセキュリティ上の問題があり、そうではありません。

   • しかし、あなたはすでに、生のピクセルを取得するためにgetImageData()を使用して、ピクセル値を操作し、再びキャンバスに変更された画素をプッシュするputImageData()を使用してキャンバスにを描かれた「ぼかしのコンテンツすることができます。

Answer 2

PlayMyCodeは、ActionScriptのhitTestのように非常に多くの作品Javascript per-pixel collision detection functionの大きなステップバイステップの説明があります。