canvas模拟圆盘划痕

最近接了个模拟划痕的项目：
两个有接触的圆盘顺着逆时针运动，此时若下方的圆盘有凸起，那么会在上面的圆盘上留下怎样的划痕。
参数不同，结果不同，：

计算（x,y）的值用到了大量三角函数，许久不用，通通还回去了=_=,
至于绘制直线则是最简单的canvas,我之前没有系统的看过这块，这次也算学习了。

var query=(function (name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]); return '800|600|75';
        })('v');
        window.LS= null;
    window.LS = {
    'pad': +query.split('|')[0],
    'wafer': +query.split('|')[1],
    'e': +query.split('|')[2]
    }

    var rule = {
        'rule0': [[6], 'Awesome! You\'re an expert at wafer thinning process!', 'pass'],
        'rule1': [[2, 5], 'Oops! You crack my die!', 'fail'],
        'rule2': [[2, 5], 'Oops! You crack my die!', 'fail'],
        'rule3': [[1], 'Oops! You burn my wafer!', 'fail'],
        'rule4': [[1, 3], 'Oops! You burn my wafer!', 'fail'],
        'rule5': [[1, 3, 4], 'Oops! You burn my wafer!', 'fail'],
        'rule6': [[1, 2, 3, 5], 'You burn my wafer and crack my die!', 'fail']
    }

    var times = 2, ctx, R = 225 * times, //pad 半径
        r = 150 * times, //wafer半径
        e = LS.e * times, //圆心距
        w1 = LS.pad, //pad 转速
        w2 = LS.wafer, //wafer转速
        point;
    w1 = (w1 * 2 * Math.PI) / 60; //pad 弧度
    w2 = (w2 * 2 * Math.PI) / 60; //wafer弧度
    Ri_arr = (function () {
        arr = []; for (i = e; i < R; i = i + 5*times) { arr.push(i); }; return arr;
    })(), //线长集合
    //Ri_arr = [200,250,300,350,400];
        Ri_angle = [],
        Ri_arr_len = Ri_arr.length, //点数目
        ctx_arr = [], //划痕集合
         origin = [r-(e-(R-r)), r], //原点

         moveTo = [], //当前点集合


        cols = (function () { arr = []; for (i = 0; i < Ri_arr.length; i++) { arr.push('rgba(0,0,255,0.4)'); }; return arr; })();        //颜色集合
    

    period = 600;

    ///
    function ret_rule(a,b,c) {
        //        Rule 1    e=75, W1/W2 不等于整笔比，W1> =1200            6   Awesome! You're an expert at wafer thinning process!
        //Rule 2    e=75, W1/W2 不等于整笔比，W1<1200          2,5 Oops! You crack my die!
        //Rule 3    e=75, W1/W2 等于整数比, any W1           2,5 Oops! You crack my die!
        //Rule 4    e=80,85,90, W1/W2 不等于整数比, W1<1100,          1;  Oops! You burn my wafer!
        //Rule 5    e=80,85,90, W1/W2 不等于整数比, 1100<=W1=<1300，           1;3;    Oops! You burn my wafer!
        //Rule 6    e=80,85,90, W1/W2 不等于整数比, W1>1300           1,3,4   Oops! You burn my wafer!
        //Rule 7    e=80,85,90;  W1/W2 等于整数比, any W1            1,2,3,5 Oops! You burn my wafer and crack my die!

        var rule_index = 0;
        if ((c==75)&&(!!(a % b)) && (a >= 1200)) {rule_index = 0; };
        if ((c == 75) && (!!(a % b)) && (a < 1200)) { rule_index = 1; };
        if ((c == 75) && (!(a % b))) { rule_index = 2; };
        if ((c == 80 || c == 85 || c == 90) && (!!(a % b)) && (a < 1100)) { rule_index = 3; };
        if ((c == 80 || c == 85 || c == 90) && (!!(a % b)) && (a >= 1100) && (a <= 1300)) { rule_index = 4; };
        if ((c == 80 || c == 85 || c == 90) && (!!(a % b))&&(a > 1300)) { rule_index = 5; };
        if ((c == 80 || c == 85 || c == 90) && (!(a % b))) { rule_index = 5; };
        return rule_index;
    }
    window.onload = function () {
        $('.dash>b').eq(0).html(LS.pad);
        $('.dash>b').eq(1).html(LS.wafer);
        $('.dash>b').eq(2).html(LS.e);
        $('.container').height($(window).height());
        $('#myCanvas').attr("width", r * 2);

        $('#myCanvas').attr("height", r * 2);

        //
        var ind = ret_rule(LS.pad, LS.wafer, LS.e);
        for (i = 0; i < rule['rule' + ind][0].length; i++) {
            $('.img_p').eq(i).find('img').attr('src', 'doc/list/' + (i + 1) + '.png');
        }
        var dd = new Date();
        var nn=dd.getFullYear()+' '+('0'+(dd.getMonth()+1)).slice(-2)+' '+('0'+dd.getDate()).slice(-2);
        if (rule['rule' + ind][2] === 'fail') {
            $('.img_box').addClass('issue');
            $('.img_p').last().html('<span class=\'yinzhang yzfail\'>YET TO OPTIMIZE</span>')
        } else {
            $('.img_p').last().html('<span class=\'yinzhang yzpass\'>PASS</span>')
          };
        $('.img_box td[colspan] h4').html(rule['rule' + ind][1]);
        //
        ctxcyc = document.getElementById('myCanvas').getContext('2d');
        ctxcyc.beginPath();

        ctxcyc.strokeStyle = 'rgba(0,0,225,1)';
        ctxcyc.arc(150 * times, 150 * times, 150 * times, 0, 2 * Math.PI);
        ctxcyc.stroke();
        ctxcyc.closePath();
        for (i = 0; i < Ri_arr_len; i++) {
            ctx_arr.push(document.getElementById('myCanvas').getContext('2d'));
            Ri_angle.push(Ret_angle(Ri_arr[i]));
        }

        for (arrs in ctx_arr) {

            var arr = Wix(Ri_arr[arrs], Ri_angle[arrs], w1, w2, 1 / 1000);
            moveTo.push([origin[0] - arr[0], origin[1] + arr[1]]);



        }


    }
    var precent = 0.0;
    function exp() {
        $('.previous').hide();

        for (i = 0; i < period; i++) {

            (function (a, x, y) {
                setTimeout(function () {
                    precent = a * 100 / (period - 1);
                    $('.dash>i').eq(0).html(precent.toFixed(2));
                    $('.bar').width(precent + '%');

                    (a > 2) && (moveTo = moveTo.slice(0 - Ri_arr_len));
                    if (a == period - 1) {
                        $('.dash').slideUp(1300);
                        $("#myCanvas,.shade").animate({ left: "350px" }, 1500, function () {

                            $(".img_box").slideDown(1200, function () {

                            });
                        });

                    };
                    for (x in y) {

                        var arr = Wix(Ri_arr[x], Ri_angle[x], w1, w2, a / 1000);
                        // (point === arr[0].toFixed(6)) && console.log(a);
                        //if (Math.pow(origin[0] - arr[0], 2) + Math.pow(origin[1] + arr[1], 2) < Math.pow(r, 2)) {
                        moveTo.push([origin[0] - arr[0], origin[1] + arr[1]]);
                        //}
                        //   if (Math.pow(arr[0], 2) + Math.pow(arr[1], 2) < Math.pow(r, 2)) {

                        y[x].beginPath();
                        y[x].strokeStyle = cols[x];

                        y[x].moveTo(moveTo[x][0], moveTo[x][1]);
                        y[x].lineTo(origin[0] - arr[0], origin[1] + arr[1]);
                        y[x].stroke();
                        y[x].closePath();


                        // }


                    }



                }, a * 50)

            })(i, arrs, ctx_arr)

        }


    }
    function Ret_angle(Ri) {
        return Math.PI - Math.acos((Math.pow(Ri, 2) + Math.pow(e, 2) - Math.pow(r, 2)) / (2 * e * Ri));
    }
    function Wix(Ri, Riang, w1, w2, t) {

        return [Ri * Math.cos(Riang + w1 * t - w2 * t) + e * Math.cos(w2 * t), Ri * Math.sin(Riang + w1 * t - w2 * t) - e * Math.sin(w2 * t)];
    }