Skip to content

Instantly share code, notes, and snippets.

@darshit-shah

darshit-shah/README.md

Last active June 26, 2016 09:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save darshit-shah/1f3e4a0e591680ee92e5985f0f7345c2 to your computer and use it in GitHub Desktop.
Save darshit-shah/1f3e4a0e591680ee92e5985f0f7345c2 to your computer and use it in GitHub Desktop.
Download ZIP
Line intersection
Raw
index.html
<html>
<head>
<style>
div {
margin-bottom: 10px;
}
span {
margin: 5px;
}
input {
margin: 5px;
padding: 5px;
}
</style>
<script src="intersection.js"></script>
<script>
function calculate(){
var x1 = parseInt(document.getElementById("x1").value.trim());
var x2 = parseInt(document.getElementById("x2").value.trim());
var x3 = parseInt(document.getElementById("x3").value.trim());
var x4 = parseInt(document.getElementById("x4").value.trim());
var y1 = parseInt(document.getElementById("y1").value.trim());
var y2 = parseInt(document.getElementById("y2").value.trim());
var y3 = parseInt(document.getElementById("y3").value.trim());
var y4 = parseInt(document.getElementById("y4").value.trim());
if(isFinite(x1) && isFinite(x2) && isFinite(x3) && isFinite(x4) && isFinite(y1) && isFinite(y2) && isFinite(y3) && isFinite(y4)){
var points = [[x1,y1],[x2,y2],[x3,y3],[x4,y4]]; // intersacting
document.getElementById("result").innerHTML = getIntersectionPoint(points);
}
else {
document.getElementById("result").innerHTML = "ERROR !!!";
}
}
</script>
</head>
<body>
<div>Point 1<span></span><span>x:</span><input id="x1" value="15" onChange="calculate()" /> <span>y:</span><input id="y1" value="10" onChange="calculate()" /></div>
<div>Point 2<span></span><span>x:</span><input id="x2" value="49" onChange="calculate()" /> <span>y:</span><input id="y2" value="25" onChange="calculate()" /></div>
<div>Point 3<span></span><span>x:</span><input id="x3" value="29" onChange="calculate()" /> <span>y:</span><input id="y3" value="50" onChange="calculate()" /></div>
<div>Point 4<span></span><span>x:</span><input id="x4" value="32" onChange="calculate()" /> <span>y:</span><input id="y4" value="32" onChange="calculate()" /></div>
<hr>
<div id="result" style="color:red"></div>
<script>
calculate();
</script>
</body>
</html>
Raw
intersection.js
function getMC(p) {
var m = (p[1][1] - p[0][1]) / (p[1][0] - p[0][0]);
var c1 = p[0][1]-m*p[0][0];
var c2 = p[1][1]-m*p[1][0];
//console.log("Slop", m, "C1", c1, "C2", c2)
if(Math.round(c1)!==Math.round(c2))
throw new Error("Something is not right");
return [m,c1];
}
function getIntersectionPoint(points){
var line1 = getMC([points[0],points[1]]);
var line2 = getMC([points[2],points[3]]);
if(line1[0]===line2[0] && line1[1]===line2[1]){
console.log("same line");
return ("same line");
}
else if(line1[0]===line2[0]){
console.log("parallel line");
return ("parallel line");
}
else {
var x=((line2[1]-line1[1])/(line1[0]-line2[0]));
var iX = Math.round(x);
var y1=(line1[0]*x + line1[1]);
var y2=(line2[0]*x + line2[1]);
//console.log("Intersection point", "X", Math.round(x), "y1", Math.round(y1), "y2", Math.round(y2));
if(Math.round(y1)!==Math.round(y2))
throw new Error("Something is not right");
var iY=Math.round(y1);
var l1Status="";
var l2Status="";
if(iX>=points[0][0]){
if(iX<=points[1][0]){
l1Status="on L1 line segment";
}
else{
l1Status="on L1 line forward side";
}
} else {
l1Status="on L1 line back side";
}
if(iX>=points[2][0]){
if(iX<=points[3][0]){
l2Status="on L2 line segment";
}
else{
l2Status="on L2 line forward side";
}
} else {
l2Status="on L2 line back side";
}
console.log("Intersection point ("+ iX+", "+ iY+") is "+l1Status+" and "+l2Status);
return ("Intersection point ("+ iX+", "+ iY+") is "+l1Status+" and "+l2Status);
}
}
/*
var points = [[15,10],[49,25],[29,5],[32,32]]; // intersacting
getIntersectionPoint(points);
var points = [[30,15],[50,25],[30,10],[50,20]] // parallel line
getIntersectionPoint(points);
var points = [[20,10],[30,15],[40,20],[50,25]] // same line
getIntersectionPoint(points);
var points = [[21,-4],[27,8],[40,20],[50,25]] // intersacting
getIntersectionPoint(points);
var points = [[21,-4],[31,8],[40,20],[50,25]] // intersacting
getIntersectionPoint(points);
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment