檢查座標是否位於扇區內

我正在嘗試突出顯示屬於圓的扇區內的像素。我正在寫一個着色器來做到這一點，但我正在JavaScript中實現邏輯，直到我理解正確。檢查座標是否位於扇區內

本質上，每個像素在畫布座標被縮放爲0和1之間，並與畫布上下文一起傳遞到下面的代碼：

function isWithinSector(ctx, x, y) { 
    let startAngle = degToRad(135), endAngle = degToRad(205); 

    // Distance of pixel from the circle origin (0.5, 0.5). 
    let dx = scaledX - 0.5; 
    let dy = scaledY - 0.5; 

    let angle = Math.atan2(dy, dx); 

    if (angle >= startAngle && angle <= endAngle) { 
    ctx.fillStyle = "rgba(255, 255, 0, .5)"; 
    ctx.fillRect(x, y, 1, 1); 
    } 
}

此工作正常的某些角度，但不爲他人。像素高亮度135和205之間出現這樣的（即只有135到180度高亮）：

注意突出顯示的像素不符合我的黑弧（真理的來源）。我一直在嘗試谷歌的各種東西，但我被卡住了。

我有一個CodePen，顯示問題：https://codepen.io/chrisparton1991/pen/XRpqXb。任何人都可以引導我在我的算法中做錯了什麼？

謝謝！

來源

2017-04-27 Chris Parton

可能重複[this]（http://stackoverflow.com/questions/14120015/check-if-coordinate-in-selected-area） – Torben

如果角度大於180°，則會出現問題，因爲atan2函數將返回小於360°的負角度。這可以通過

let angle = Math.atan2(dy, dx); 
if (angle<0) angle += 2*Math.PI;

糾正但這仍然是不夠的，如果你想從350°的扇形突出至10°，也就是包含0°射線小部門。然後下面的擴展標準化程序有所幫助。

let angle = Math.atan2(dy, dx); 
let before = angle-startAngle; 
if(before < -Math.PI) 
    before += 2*Math.PI; 
let after = angle-endAngle; 
if(after < -Math.PI) 
    after += 2*Math.PI;

請注意，您的圖像是顛倒的，因爲屏幕原點是右上角，放置座標（0,1）。

來源

2017-04-27 12:04:01 LutzL

非常感謝您的幫助。我之前一直在擺弄2 * pi，但並沒有解決我所有的問題。也就是說，我需要能夠有0度朝上。我發現以各種組合翻轉和反轉atan2（）的參數會爲我做到這一點，並添加2 * pi。 –

檢查座標是否位於扇區內

回答

相關問題