Get Clipped Line Visible Area Length d3

I'm trying to clip a line with circle using ClipPath and successfully done it with dragging as well. Here is my working Code;

function clipData(svg, cx, cy) {

    var clip = svg.append("defs")
        .append("clipPath") // define a clip path
        .attr("id", "clip") // give the clipPath an ID
        .append("circle") // shape it as an ellipse
        .attr("id", "my-circle")
        .attr("cx", 100) // position the x-centre
        .attr("cy", 80) // position the y-centre
        .attr("r", 80) // set the x radius
        .attr("fill", "yellow")

    svg.append("circle") // shape it as an ellipse
        .attr("cx", 100) // position the x-centre
        .attr("cy", 80) // position the y-centre
        .attr("r", 80) // set the x radius
        .attr("fill", "red")


    var g = svg.append("g")
        .datum({
            x: 0,
            y: 0
        })
        .attr("id", "child")
        //.attr("transform", function(d) { return 'translate(' + d.x + ' '+ d.y + ')'; })

        .call(d3.drag()
            .on("start", function(d) {
                d3.select(this).raise().classed("active", true);

            })
            .on("drag", function(d) {
                d3.select(this).attr("transform", "translate(" + (d3.event.x) + "," + (d3.event.y) + ")");
                d3.select("#svgGreen").selectAll("*").remove();
                clipData(svg, d3.event.x + cx, d3.event.y + cy);

            })
            .on("end", function(d) {
                d3.select(this).classed("active", false);
            }));


    g.append("line")
        .attr("clip-path", "url(#clip)")
        .attr("x1", cx)
        .attr("y1", cy)
        .attr("x2", cx + 100)
        .attr("y2", cy + 100)
        .style("stroke", "purple")
        .style("stroke-width", 12)

}

var svg = d3.select("#svgGreen");
var cx = 100,
    cy = 80,
    x = 0,
    y = 0;

clipData(svg, cx, cy);

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.5.0/d3.min.js"></script>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"  className="clip-path" id="svgGreen">
</svg>

Now I'm trying to get length of Visible part of Line after clipping. But when I try to get it from line's x-y points, I always get same length as before clipping,

Is there any way that I can get only visible Line length after clipping??

from Get Clipped Line Visible Area Length d3