hello I develop a web application in ASP.net core and I faced a challenge. in this project I have image that I must able zoom and add marker and between two markers draw line. markers are draggable. I want the line to change accordingly when I change the markers But I do not know how to do this? enter image description here

<div id="zoom-marker-div" class="zoom-marker-div">
 <img class="zoom-marker-img" id="zoom-marker-img" alt="zoom-marker-img" name="zoom-marker-img" draggable="false" style="width:auto;height:auto" />
</div>




  // init item
var initImg = function (item) {
    // handle "TAP" event and add marker to image
    item.on("zoom_marker_mouse_click", function (event, position) {
        console.log("Mouse click on: " + $(this).width() + "   " + JSON.stringify(position));// JSON.stringify(position)
        var rateZoom = $(this).width() / 500
        if (tagNumber <= 25) {
            const marker = item.zoomMarker_AddMarker({
                src: "/Image-Zoom/img/marker5.svg",
                x: position.x,
                y: position.y + 20 / rateZoom,
                size: 20,
                dialog: {},
                hint: { value: tagNumber, style: { color: "#ffffff", left: "10px" } }
            });
            console.log(typeof position.x);
            // Configure dialog manually
            marker.param.dialog = {
                value: "<h4>" + pointList[tagNumber] + "</h4>",
                offsetX: 20,
                style: {
                    "border-color": "#86df5f"
                }
            };

            // Draw a line
            const context = item.zoomMarker_Canvas();
            if (context !== null && counter == 2) {
                context.strokeStyle = 'aqua';
                context.moveTo(position.x, position.y);
                context.lineTo(listUndo[tagNumber - 2].x, listUndo[tagNumber - 2].y);
                context.stroke();
                counter = 1;
            }
            else {
                counter = 2;
            }
            console.log("Mouse click on: " + JSON.stringify(context));
            listUndo.push(position)
            listmarkerId.push(markerId)
            ++markerId;
            ++tagNumber;
        }
        
    });