Javascript 二维光线跟踪-填充视图

Javascript 二维光线跟踪-填充视图,javascript,canvas,trigonometry,raytracing,radians,Javascript,Canvas,Trigonometry,Raytracing,Radians,我的2d光线跟踪器一直工作良好,直到我按角度(具体为弧度)对计算出的光线进行排序为止。我想这与谭恩美的行为方式有关,但我不确定。对于碰撞和原点,用已知的x,y对角度进行排序的最佳方法是什么?我已经断断续续地研究同一个问题两周了,几乎什么都试过了 我现在可以在这里上传图片: 如果你想摆弄它,这里有一条罪状代码: function sortByAngle(pos){ for (var i = viewFeild.length - 1; i >= 0; i --) { vie

我的2d光线跟踪器一直工作良好,直到我按角度(具体为弧度)对计算出的光线进行排序为止。我想这与谭恩美的行为方式有关,但我不确定。对于碰撞和原点,用已知的x,y对角度进行排序的最佳方法是什么?我已经断断续续地研究同一个问题两周了,几乎什么都试过了

我现在可以在这里上传图片: 如果你想摆弄它,这里有一条罪状代码:

function sortByAngle(pos){
for (var i = viewFeild.length - 1; i >= 0; i --) {      
    viewFeild[i][3] = Math.atan((viewFeild[i][4]-pos.y)/(viewFeild[i][0]-pos.x));
    if(viewFeild[i][5]<pos.y)
        viewFeild[i][6] = viewFeild[i][7]*-1-4;

    if (viewFeild[i][8]<0) {viewFeild[i][9]+=2};
};

viewFeild.sort(function(a,b){return a[2]-b[2]});
}

function fillView(pos) {

for (var i = viewFeild.length - 1; i >= 0; i--) {
    //console.log(i+"     "+viewFeild[i][10] + "   " + viewFeild[(i+1)%viewFeild.length][11])
    //console.log(viewFeild.length)
    ctx.beginPath();
    ctx.moveTo(pos.x, pos.y);
    ctx.lineTo(viewFeild[i][0]+pos.x, viewFeild[i][12]+pos.y);
    ctx.lineTo(viewFeild[(i+1)%viewFeild.length][0]+pos.x, viewFeild[(i+1)%viewFeild.length][13]+pos.y);
    ctx.closePath();
    ctx.fillStyle = "rgba(100, " + 35*i  + ", 100, .6)";
    ctx.fill();
};
}
功能排序表(pos){
对于(var i=viewFeild.length-1;i>=0;i--){
viewFeild[i][3]=Math.atan((viewFeild[i][4]-pos.y)/(viewFeild[i][0]-pos.x));

if(viewFeild[i][5]首先要做的是澄清您的代码。
1) 不需要按相反顺序填充数组。
2) 使用atan2-我不明白你处理弧度的方法…
3) 缓存要重复使用的数组元素。
4) 不要在每个排序上创建一个排序函数。
5) 如果按正确的顺序排序,则不需要按相反的顺序显示

一旦情况变得更清楚,我发现奇怪的是,你用字段3、5或6表示点的y。我想说,y数据只需要一个偏移量就足够了;-)

功能分类(中){

对于(var i=0;iHmmmm,这很奇怪,因为原始代码使用[1]表示y点,如google文档中所示,可能只是没有转录,谢谢:)那么上面的代码应该解决这个问题吗(当我尝试它时,仍然存在相同的问题,我认为这是因为我们仍然在使用Math.atan2()?
function sortByAngle(center) {
    for (var i = 0 ; i<viewFeild.length ; i++) {
        var thisField = viewFeild[i] ; 
        thisField[2] = Math.atan2( thisField[3] - center.y) 
                                    , (thisField[0] - center.x));
    };
    viewFeild.sort(sortOnSecondItem);
}

function fillView(pos) {
    for (var i = 0 ; i<viewFeild.length ; i++) {
        var thisField = viewFeild[i] ; 
        var nextField = (i==viewFeild.length-1) ?
                            viewFeild[0] 
                          : viewFeild[i+1] ;
        ctx.beginPath();
        ctx.moveTo(pos.x, pos.y);
        ctx.lineTo(thisField[0] + pos.x, thisField[5] + pos.y);
        ctx.lineTo(nextField[0] + pos.x, nextField[6] + pos.y);
        ctx.closePath();
        ctx.fillStyle = "rgba(100, " + 35 * i + ", 100, .6)";
        ctx.fill();
    };
}

function sortOnSecondItem(a,b) { return a[2] - b[2] }