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)];    }