点が曲線の外側にあるかどうか確認してください

これは数学フォーラムに属している場合は申し訳ありません。私はHTML5のキャンバス要素内に角を丸めたイメージを持っています。丸みのあるコーナーを透明にしたいと思います。私は、次のコードを持っている：点が曲線の外側にあるかどうか確認してください

var cornersImgData = tempContext.getImageData(0, 0, img.width, img.height); 
    var topLeft = getPixel(cornersImgData, 0, 0); 
    var topRight = getPixel(cornersImgData, cornersImgData.width - 1, 0); 
    var bottomLeft = getPixel(cornersImgData, 0, cornersImgData.height - 1); 
    // Check that the rounded corners have actually been applied (e.g. make sure the user hasn't just clicked the button and then undo) 
    var bottomRight = getPixel(cornersImgData, cornersImgData.width - 1, cornersImgData.height - 1); 
    if (('rgb(' + topLeft[0] + ', ' + topLeft[1] + ', ' + topLeft[2] + ')' == _roundedCornersColour) || 
     ('rgb(' + topRight[0] + ', ' + topRight[1] + ', ' + topRight[2] + ')' == _roundedCornersColour) || 
     ('rgb(' + bottomLeft[0] + ', ' + bottomLeft[1] + ', ' + bottomLeft[2] + ')' == _roundedCornersColour) || 
     ('rgb(' + bottomRight[0] + ', ' + bottomRight[1] + ', ' + bottomRight[2] + ')' == _roundedCornersColour)) 
    { 
     for (var x = 0; x < cornersImgData.width; x++) 
     { 
      for (var y = 0; y < cornersImgData.height; y++) 
      { 
       var colour = getPixel(cornersImgData, x, y); 
       if ('rgb(' + colour[0] + ', ' + colour[1] + ', ' + colour[2] + ')' == _roundedCornersColour) 
       { 
        setPixel(cornersImgData, x, y, colour[0], colour[1], colour[2], 0); 
       } 
      } 
     } 
    }

私は時々、画像自体の中にいくつかのピクセルを置き換える終わる_roundedCornersColourのすべてのインスタンスを置き換えていますので、これはしかし、動作します。私の高校の数学は少し錆びているので、xとyがコーナーのどこにあるべきかを判断する最良の方法を理解できません。誰でも助けてくれますか？

ジョー

出典

2012-04-08 JoeS

P.私はコーナーの半径を知っている – JoeS

半径がrの場合は、左上の角が丸いの円の中心は、限り、私はあなたのコードから言うことができるように、(xc1, yc1) = (r, r)である円弧でいます。同様に他の3つの円の中心の座標を計算することもできます(xc2, yc2)、(xc3, yc3)および(xc4, yc4)

次に、最初の角の近くで、(x-xc1)*(x-xc1) + (y-yc1)*(y-yc1) > r*rとx < xc1とy < yc1の場合にテストできます。これは、円の外にあり、関連コーナーにあるポイントによって満たされます。他のコーナーでは、最初のテストでサークル中心を関連円中心に変更し、他の2つの不等式を適切に変更して円の正しい象限を選択する必要があります。

これは基本的な計算です。 4つのコーナーがすべて対称である（各コーナーは対角線について反射対称性を持ち、すべてのコーナーは互いに回転コピーされています）、見つかったらサークルの外側にある1つのポイントを直接テストすることなく、外にある多くの他のポイントをすぐに識別することができます。

出典

2012-04-09 15:12:13 jmhl