Экз_1

<html>
    <head>
        <meta charset="UTF-8"/>
        <title>Определение точки пересечения отрезков</title>
    </head>
     <body>
        <br><br><br><br>
        <button onclick="update_all()">    Обновить      </button>
        <canvas id="canvas" width="500" height="500"></canvas>
        <style>

            body
            {
                background: #C5D0E6
            }

            canvas
            {
                display: block;
                margin: auto auto;
                border: 1px solid #04112F;
                background: #CBB6CE;
            }
            button{
                display: block;
                margin: auto auto;
                width: 100px;
                height: 30px;
                background: #FFCC00
            }
        </style>

        <script>
            let c = document.getElementById('canvas');
            let ctx = c.getContext('2d');

            let idA;
            let x, y;
            let points = [];
            let A, B, C;
            let point_X, point_Y;

            window.onload=function(){
                document.getElementById('canvas').addEventListener('click', (e) => {
                    if(points.length < 4)
                        points.push({x: e.offsetX, y: e.offsetY});
                    Main();
                });
            }

            function Main()
            {
                ctx.strokeStyle = "#000";
                ctx.fillStyle = "#2e49cd";
                for(let i = 0; i < points.length; i++)
                    ctx.fillRect(points[i].x - 2, points[i].y - 2, 3, 3);

                if(points.length > 1)
                {
                    ctx.beginPath();
                    ctx.moveTo(points[0].x, points[0].y);
                    ctx.lineTo(points[1].x, points[1].y);
                    if(points.length > 3)
                    {
                        ctx.moveTo(points[2].x, points[2].y);
                        ctx.lineTo(points[3].x, points[3].y);
                    }
                    ctx.stroke();
                    ctx.closePath();
                    TempCheck();
                }
            }

            function cross(ax, ay, bx, by)    //Векторное произведение
            {
                return ax * by - bx * ay;
            }

            function CrossingCheck(p1,p2,p3,p4) //Проверка пересечения
            {
                let v1, v2, v3, v4;

                v1 = cross(p4.x - p3.x,  p4.y - p3.y,  p1.x - p3.x,  p1.y - p3.y);
                v2 = cross(p4.x - p3.x,  p4.y - p3.y,  p2.x - p3.x,  p2.y - p3.y);
                v3 = cross(p2.x - p1.x,  p2.y - p1.y,  p3.x - p1.x,  p3.y - p1.y);
                v4 = cross(p2.x - p1.x,  p2.y - p1.y,  p4.x - p1.x,  p4.y - p1.y);

                if ((v1 * v2 < 0) && (v3 * v4 < 0))
                    return true;
                else
                    return false;
            }

            function equation_line(p1,p2)  //Построение уравнения прямой Ax+By+C
            {
                A = p2.y - p1.y;
                B = p1.x - p2.x;
                C =- p1.x * (p2.y-p1.y) + p1.y * (p2.x - p1.x);

            }

             function IntersectionX(a1,b1,c1,a2,b2,c2)  //Поиск точки пересечения по Х
             {
                let d, dx, pointx;

                d = a1 * b2 - b1 * a2;
                dx =- c1 * b2 + b1 * c2;

                pointx = dx / d;

                return pointx;
             }

            function IntersectionY(a1,b1,c1,a2,b2,c2) //Поиск точки пересечения по Y
            {
                let d ,dy, pointy;

                d = a1 * b2 - b1 * a2;
                dy =- a1 * c2 + c1 * a2;

                pointy = dy / d;

                return pointy;
            }

            function TempCheck()    //Проверка отрезков на пересечение
            {
                ctx.fillStyle = "red";

                if(CrossingCheck(points[0], points[1], points[2], points[3]))
                {
                    let a1, b1, c1, a2, b2, c2;

                    equation_line(points[0], points[1]);
                    a1 = A;
                    b1 = B;
                    c1 = C;

                    equation_line(points[2], points[3]);
                    a2 = A;
                    b2 = B;
                    c2 = C;

                    point_X = IntersectionX(a1, b1, c1, a2, b2, c2);
                    point_Y = IntersectionY(a1, b1, c1, a2, b2, c2);

                    ctx.fillRect(point_X - 2, point_Y - 2, 4, 4);

                    setTimeout(function() {
                        alert('Х=' + point_X + ',   Y=' + point_Y);}, 100);
                }
                else
                    setTimeout(function() { alert("Отрезки Не пересекаются");}, 100);
            }

            function update_all()
            {
                idA = undefined;
                x = undefined;
                y = undefined;
                A = undefined;
                B = undefined;
                C = undefined;
                point_X = undefined;
                point_Y = undefined;
                points = [];

                ctx.clearRect(0, 0, 500, 500);
            }
        </script>
    </body>
</html>