[Solved]-How to limit a d3 line-chart from showing the line outside of the range of the axis?-d3.js

What i did was, I divided the data values by multiples of 10 through trial and error. I think d3 would just plot data out of it's range if it's too large, because once I divided the values they were scaled perfectly.

.append("circle")
                    .attr('cx', d => xScale(d.foreign_investement/10000))
                    .attr('cy', d => yScale(d.earnings/1000))

You can limit which points are displayed using defined

Every sample gets passed through the function and where it returns false, the points aren't shown...

var line = d3.line()
    .defined(function(d) { 
       return d.x < xMax && dx > xMin && d.y > yMin && d.y< yMax; 
    })
    .x(function(d) { return x(d.x); })
    .y(function(d) { return y(d.y); });

Alternatively, you can use a clip-path like in this example.