2016-12-09 11 views
1

ウェブワーカーの内部にキャンバスエレメントを使用する方法はありますか?私はの画像を減らすために、Webワーカーの内部にcanvas.toBlobを実行したいと思います。
ウェブワーカーでキャンバスを使用する

  • 私はキャンバスオフスクリーン実験について知っているのImageDataは私を助けないWebワーカーに渡すことができ、私はcanvas.toBlob
  • を行うにはキャンバスではなく、canvasContextを必要とするだけ知っていますFirefoxでは、他のブラウザでもサポートが必要です。

どういうわけか、https://github.com/substack/webworkify webworkifyですか?これは、Webワーカーの内部に他のライブラリを必要とすることができますか?

Webワーカーにキャンバス要素を渡すか、Webワーカー内部にキャンバス要素を作成するか、イメージの品質を低下させる別の方法を見つける必要があります。

+0

OffscreenCanvas https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas – defghi1977

+1

感謝を試したが、私の問題の前にドットで記載されている第二の点に注意してください。 – bergben

+0

現在のところ、クロスブラウザの方法ではなく、WebワーカーがDOMを操作する方法 – Viney

答えて

0

使用OffscreenCanvas:

OffscreenCanvasオブジェクトはずっとHTMLCanvasElement等が挙げられるが、DOMへの接続なしで、レンダリングコンテキストを作成するために使用されています。これにより、作業者にキャンバス・レンダリング・コンテキストを使用することが可能になります。

OffscreenCanvasオブジェクトは、通常、OffscreenCanvasオブジェクトによって埋め込みコンテンツが提供されるDOM内のプレースホルダキャンバス要素への弱い参照を保持することがあります。 OffscreenCanvasオブジェクトのビットマップは、OffscreenCanvasオブジェクトのレンダリングコンテキストのcommit()メソッドを呼び出すことによって、プレースホルダcanvas要素にプッシュされます。 OffscreenCanvasオブジェクトによって作成できるすべてのレンダリングコンテキストタイプは、commit()メソッドを実装する必要があります。コミット方法の正確な振る舞い(例えば、ビットマップをコピーまたは転送するかどうか)は、レンダリングコンテキストのそれぞれの仕様によって定義されるように、変動し得る。この仕様では、オフスクリーンキャンバスの2Dコンテキストのみを定義しています。

これは実験的な機能なので、フラグの後ろに隠されています。これはFirefoxでサポートされています:

この機能は、機能の優先設定の背後にあります。 about:configでは、gfx.offscreencanvas.enabledをtrueに設定します。

とChrome:

この機能は、フラグの後ろにあります。 // flagsは、労働者のユースケースについて実験キャンバス機能

の下で有効にする]をクリックし、DOMには依存関係がありません:Chromeで

ウェブ労働者はDOMに依存しません。彼らは純粋なデータを扱うので、実行に時間がかかるJavaScriptコードに特に適しています。

FirefoxのみがImageData操作をサポートしています。

Canvas Web Worker Support

参照

関連する問題