Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <script>
- function Point(x,y)
- {
- this.x=x;
- this.y=y;
- }
- var mouse={down:1,pos:new Point(-1,-1)};
- var docVals = false;
- function Distance(a,b)
- {
- return Math.pow(a.x-b.x,2)+Math.pow(a.y-b.y, 2);
- }
- function project(pStart,angle,size)
- {
- return{x:pStart.x+Math.cos(angle)*size,y:pStart.y+Math.sin(angle)*size};
- }
- function getAngle(line)
- {
- var dx = line.end.x-line.start.x;
- var dy = line.end.y-line.start.y;
- return Math.atan2(dy,dx);
- }
- function Intersects(lineA,lineB)
- {
- var denom = ((lineA.end.x - lineA.start.x) * (lineB.end.y - lineB.start.y)) - ((lineA.end.y - lineA.start.y) * (lineB.end.x - lineB.start.x));
- if (denom == 0) return false;
- var numer = ((lineA.start.y - lineB.start.y) * (lineB.end.x - lineB.start.x)) - ((lineA.start.x - lineB.start.x) * (lineB.end.y - lineB.start.y));
- var r = numer / denom;
- var numer2 = ((lineA.start.y - lineB.start.y) * (lineA.end.x - lineA.start.x)) - ((lineA.start.x - lineB.start.x) * (lineA.end.y - lineA.start.y));
- var s = numer2 / denom;
- if ((r < 0 || r > 1) || (s < 0 || s > 1)) return false;
- return {x:(lineA.start.x - -(r * (lineA.end.x - lineA.start.x))),y:lineA.start.y - - (r * (lineA.end.y - lineA.start.y)),numer:[numer/denom,numer2/denom]};
- }
- function drawCircle(G,x,y,rad)
- {
- G.arc(x, y, rad, 0, Math.PI*2, true);
- }
- function drawLines()
- {
- if(!docVals)docVals =
- [document.getElementById("lineasx"),document.getElementById("lineasy"),
- document.getElementById("lineaex"),document.getElementById("lineaey"),
- document.getElementById("linebsx"),document.getElementById("linebsy"),
- document.getElementById("linebex"),document.getElementById("linebey")];
- var lineA = {start:new Point(docVals[0].value,docVals[1].value),end:new Point(docVals[2].value,docVals[3].value),angle:false,dist:false};
- var lineB = {start:new Point(docVals[4].value,docVals[5].value),end:new Point(docVals[6].value,docVals[7].value),angle:false,dist:false};
- lineA.angle = getAngle(lineA);
- lineB.angle = getAngle(lineB);
- lineA.dist = Math.sqrt(Distance(lineA.start,lineA.end));
- lineB.dist = Math.sqrt(Distance(lineB.start,lineB.end));
- var i = Intersects(lineA,lineB);
- var angle = false;
- var canvas = document.getElementById("canvas");
- var Graphics = canvas.getContext("2d");
- Graphics.strokeStyle="#F00";
- Graphics.beginPath();
- Graphics.fillStyle="#FFF";
- Graphics.clearRect(0,0,600,400);
- Graphics.beginPath();
- Graphics.stroke();
- Graphics.beginPath();
- Graphics.moveTo(lineB.start.x,lineB.start.y);
- Graphics.lineTo(lineB.end.x,lineB.end.y);
- Graphics.stroke();
- Graphics.beginPath();
- Graphics.moveTo(lineA.start.x,lineA.start.y);
- Graphics.lineTo(lineA.end.x,lineA.end.y);
- Graphics.stroke();
- if(i)
- {
- Graphics.beginPath();
- drawCircle(Graphics,i.x,i.y,7);
- Graphics.stroke();
- Graphics.beginPath();
- Graphics.moveTo(i.x,i.y);
- Graphics.lineTo(lineA.end.x,lineA.end.y);
- Graphics.stroke();
- }
- var distances =
- [{dist:Distance(mouse.pos,lineA.start),pos:lineA.start,id:"lineas"},
- {dist:Distance(mouse.pos,lineA.end),pos:lineA.end,id:"lineae"},
- {dist:Distance(mouse.pos,lineB.start),pos:lineB.start,id:"linebs"},
- {dist:Distance(mouse.pos,lineB.end),pos:lineB.end,id:"linebe"}];
- distances.sort(function(a,b){return a.dist>b.dist});
- if(distances[0].dist<2500)
- {
- Graphics.beginPath();
- Graphics.moveTo(mouse.pos.x,mouse.pos.y);
- Graphics.lineTo(distances[0].pos.x,distances[0].pos.y);
- Graphics.stroke();
- if(mouse.down==0)
- {
- document.getElementById(distances[0].id+"x").value=mouse.pos.x;
- document.getElementById(distances[0].id+"y").value=mouse.pos.y;
- }
- }
- if(i)
- {
- var P = project(i,lineB.angle-(lineA.angle-lineB.angle)+Math.PI,(i.numer[0])*lineA.dist);
- Graphics.beginPath();
- Graphics.moveTo(i.x,i.y);
- Graphics.lineTo(P.x,P.y);
- Graphics.stroke();
- }
- }
- function mouseDown(b)
- {
- mouse.down = b;
- drawLines();
- }
- function mouseMove(event)
- {
- mouseDown(mouse.down*2);
- mouse.pos.x = event.offsetX;
- mouse.pos.y = event.offsetY;
- drawLines();
- }
- </script>
- <body onmouseup="mouseDown(1)">
- <canvas width="600" height="400" style="border:1px #000 solid"
- id="canvas" onmousemove="mouseMove(event)"
- onmousedown="mouseDown(0)"></canvas><br>
- <input id="lineasx" type="number" value="10" oninput="drawLines()"></input>,
- <input id="lineasy" type="number" value="10" oninput="drawLines()"></input> to
- <input id="lineaex" type="number" value="390" oninput="drawLines()"></input>,
- <input id="lineaey" type="number"value="390" oninput="drawLines()"></input>
- <br>
- <br>
- <input id="linebsx" type="number" value="10" oninput="drawLines()"></input>,
- <input id="linebsy" type="number" value="390" oninput="drawLines()"></input> to
- <input id="linebex" type="number" value="390" oninput="drawLines()"></input>,
- <input id="linebey" type="number" value="10" oninput="drawLines()"></input>
- <br>
- <br>
- <div id="res"></div>
- <script>
- drawLines();
- </script>
- </body>
- function Distance(a,b)
- {
- return Math.pow(a.x-b.x,2)+Math.pow(a.y-b.y, 2);
- }
- function project(pStart,angle,size)
- {
- return{x:pStart.x+Math.cos(angle)*size,y:pStart.y+Math.sin(angle)*size};
- }
- function getAngle(line)
- {
- var dx = line.end.x-line.start.x;
- var dy = line.end.y-line.start.y;
- return Math.atan2(dy,dx);
- }
- function Intersects(line,mesh)
- {
- for(var i in mesh)
- {
- var denom = ((line.end.x - line.start.x) * (mesh[i].end.y - mesh[i].start.y)) - ((line.end.y - line.start.y) * (mesh[i].end.x - mesh[i].start.x));
- if (denom == 0) return false;
- var numer = ((line.start.y - mesh[i].start.y) * (mesh[i].end.x - mesh[i].start.x)) - ((line.start.x - mesh[i].start.x) * (mesh[i].end.y - mesh[i].start.y));
- var r = numer / denom;
- var numer2 = ((line.start.y - mesh[i].start.y) * (line.end.x - line.start.x)) - ((line.start.x - mesh[i].start.x) * (line.end.y - line.start.y));
- var s = numer2 / denom;
- if (!((r < 0 || r > 1) || (s < 0 || s > 1)))
- {
- var thisOne = {start:false,end:false};
- thisOne.start = project(i,mesh[i].angle-(line.angle-mesh[i].angle)+Math.PI,r*line.dist);
- thisOne.end = {x:(line.start.x - -(r * (line.end.x - line.start.x))),y:line.start.y - - (r * (line.end.y - line.start.y)),numer:[numer/denom,numer2/denom]};
- }
- }
- return {end:line.start,path:[]};
- }
- <script>
- var abc = [1,2,3];
- </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement