1

パスを描画してから、このようなglobalCompositeOperation = "destination-out"とまったく同じパスを描く:デスティネーションアウトからレフトオーバーを削除するには?

function drawPath(ctx){ 
    ctx.beginPath(); 
    ctx.moveTo(0, 0); 
    ctx.lineTo(120, 120); 
    ctx.bezierCurveTo(30, 40, 30, 40, 40, 120); 
    ctx.lineTo(0, 0); 
    ctx.fill(); 
} 

drawPath(ctx); 
ctx.globalCompositeOperation = "destination-out"; 
drawPath(ctx); 

はその後抗alisedエッジ上の残り物があります。これはFirefoxとChromeの両方で発生します。

削除する(または表示させない)方法はありますか?そうでない場合は、これが起こると思われますか?

答えて

2

*(1 (あろう1アンチエイリアス画素がのアルファチャンネル/不透明度とを描かなければならない描かれた後に、あなたは、最終的な不透明度、同じ不透明度とそのピクセルを除去すると仮定 - ,))。

は、間、または0%と100%であれば、最終的な不透明度の最大値は、 = 50%で25%となります。

したがって、これらのアーチファクトはと予想されます。です。

しかし、N回再び同じ不透明度とそのピクセルを除去した場合、最終的な不透明度は次のようになり( *(1からN)とその最大値減少し続けます。 destination-outで描画を続けると、おそらくすべてのアーティファクトが削除されます。私は8回で十分だと思う。試してみてください:http://jsfiddle.net/dXVR7/

+0

ありがとうございます、なぜそれは 'a - a'ですか?すでに描いているのと同じアルファ値を取り除くように求めているからです。またはそれはどのように行き先が機能するのでしょうか? – Shedokan

+1

それはそれが動作する方法です。あなたが何かに50%を追加すると、そこから何が入っているものの50%が削除されます。その中に25%が残っています。 – Thai

+0

ああ、それははるかに明確な説明です。ありがとうございました :) – Shedokan

関連する問題