道路（起伏）

道路(起伏）

コーディングは、考慮が必要です。

前の単純な起伏の概念を参照ください。

「三角関数を使った坂道…」の記事を参照。

ｙにサインの値を加算して表現しています。

 

 

function make_course(){
    for(i=0; i <CMAX; i++){
        updown[i] =  parseInt(5*Math.sin(i*(Math.PI/180)));
    }
//Math.sin((180*i)/23*(Math.PI/180));

}

 

    for(i=0; i <BOARD; i++){
        BOARD_W[i] = 10+(BOARD-i)*(BOARD-i)/12;
        BOARD_H[i] = 3.4*(BOARD-i)/BOARD;
        BOARD_UD[i] = 2*Math.sin(i*1.5*(Math.PI/180));
    }

    for(i=0; i <BOARD; i++){
        di += curve[(car_y+i)%CMAX];
        ud += updown[(car_y+i)%CMAX];
        board_x[i] = 400 -BOARD_W[i]/2 + di/2;
        board_ud[i] = ud/30;
    }

    horizon = 400 + parseInt(ud/3);
    sy = horizon;

    vertical = vertical - di*keyup/30;
    if(vertical < 0) vertical += 800;
    if(vertical >= 800) vertical -= 800;

     ctx.fillStyle = "rgb(0, 56, 255)";
     ctx.fillRect(0, 0, WIDTH, HEIGHT);

    ctx.drawImage(img_bg, vertical-800, horizon-400);
    ctx.drawImage(img_bg, vertical, horizon-400);

 

 

   for (i=BOARD-1; i >0; i--){
        ux = board_x[i];
        uy = sy - BOARD_UD[i]*board_ud[i];
        uw = BOARD_W[i];
        sy = sy + BOARD_H[i]*(600-horizon)/200;
        bx = board_x[i-1];
        by = sy - BOARD_UD[i-1]*board_ud[i-1];
        bw = BOARD_W[i-1];
        colr = 160;
        colb = 160;
        colg = 160;
        wkcolor = "#" + colr.toString(16) + colb.toString(16) + colg.toString(16);
        if((car_y+i)%12 === 0){
            wkcolor = "#FFFFFF";
        }

        ctx.beginPath();
        ctx.moveTo(ux,uy);
        ctx.lineTo(ux+uw,uy);
        ctx.lineTo(bx+bw,by);
        ctx.lineTo(bx,by);
//全て座標を指定 

        ctx.closePath();
        ctx.fillStyle = wkcolor;
        ctx.fill();

    }