Q:

Calculates the Distance Between Two Points X1, Y1, and X2, Y2 in Javascript

YasminRadwan26
Save to bookmark
|
2022-06-01
|
  528 
0

Javascript Program to calculate the distance between two points, write a javascript function distance that calculates the distance between two points (x1, y1) and (x2, y2). All numbers and return values should be floating-point values. Incorporate this function into a script that enables the user to enter the coordinates of the points through an HTML form or compute the distance between two points taking input from the user in javascript. Follow the step to get a distance between two points.

Step 1: First we create a form that can hold up to 4 values each point have 2 values x1 and y1 or x2 and y2.

Step 2: After that, we will perform some mathematics operations on those value and store the result in another variable.

Step 3: Now we have a result or distance of two points, now the next step is to display the result.

Step 4: Display the result of the two-point distance in javascript popup, and according to the question requirements we have to use float number to display a value.

As we all know that to calculate any equation e need the formula to find the result so for finding a distance of two number we are using the following formula that can help to calculate a distance between two points of two objects.

The formula of Calculating Distance between two point 

Formula to calculate a distance between two points X1, Y1, and X2, Y2
Html programming, JavaScript programming, examples, Html programming examples, JavaScript programming examples,
login and add your own answer to this question

All Answers

YasminRadwan26
2022-06-01
need an explanation for this answer? contact us directly to get an explanation for this answer 

<!DOCTYPE html>
 <head>
<title>javascript get distance between two points</title>
//Javascript script start from here.
 <script>
 function find_distance()
 {
 var x1=parseInt(document.getElementById("x1").value);
 var y1=parseInt(document.getElementById("y1").value);
 var x2=parseInt(document.getElementById("x2").value);
 var y2=parseInt(document.getElementById("y2").value);
 var distance=Math.sqrt(Math.pow((x1-x2),2)+Math.pow((y1-y2),2));
 alert("Distance: "+distance);
 }
 </script>

 </head>
 <body>
 <form name="f1" method="post">
 <label>Enter the co-ordinate of point p:</label><br>
 x1:<input type="text" id="x1" size="30"/>&nbsp;y1:<input type="text" id="y1" size="30"/><br>
 <label>Enter the co-ordinate of point q:</label><br>
 x2:<input type="text" id="x2" size="30"/>&nbsp;y2:<input type="text" id="y2" size="30"/><br>
 <button onclick="find_distance()">Find Distance</button>
 </form>
 </body>
</html

 

Output:

//Javascript script start from here.


x1: y1:

x2: y2:

need an explanation for this answer? contact us directly to get an explanation for this answer

total answers (1)

This question belongs to these collections

Similar questions

need a help?

find thousands of online teachers now