Get coordinate by length between two points

Question

I am drawing on canvas and I want to get a point by length between two other points. I have:

let uno = {x:100, y:200};
let dos = {x: 900, y:2000};
let length = 20; //px

How can I get point between uno and dos by distance in pixels length (starting from uno)? Example image in the

attachment

Possible duplicate of [Finding a point on a line](http://stackoverflow.com/questions/1934210/finding-a-point-on-a-line) — Rafael, Jan 18 '17 at 21:41
Note there is a math site in the Stack Exchange network of sites, which has the answer to the question: http://math.stackexchange.com/q/155514 — Heretic Monkey, Jan 18 '17 at 21:44
Possible duplicate of [Finding coordinates of a point between two points?](http://stackoverflow.com/questions/2886092/finding-coordinates-of-a-point-between-two-points) This says it's about WPF, but it's basic math. — Heretic Monkey, Jan 18 '17 at 21:45

Giladd · Accepted Answer · 2017-01-18T21:50:03.347

7

Using trigonometry:

function lenpoint(x1, y1, x2, y2, len) {
  var dx = x2-x1, 
      dy = y2-y1;
  var theta = Math.atan2(dy, dx);
  var xp = len * Math.cos(theta), 
      yp = len * Math.sin(theta);
  return [xp + x1, yp + y1];
}

edited Jan 18 '17 at 21:50

answered Jan 18 '17 at 21:41

Giladd

1,351
8
9

This is almost it... just need [xp + x1, yp + y1] – D. Walsh Jan 18 '17 at 21:46

score 4 · Answer 2 · answered Jan 18 '17 at 21:51

function getCoordinateByLength(point1, point2, length){
    var dx = point2.x - point1.x;
    var dy = point2.y - point1.y;
    var distance = Math.sqrt(dx * dx + dy * dy);
    if(distance == 0)
        return {x: point1.x, y: point1.y};

    var rx = point1.x + (point2.x - point1.x) * length / distance;
    var ry = point1.y + (point2.y - point1.y) * length / distance;
    return {x: rx, y: ry};
}

score 0 · Answer 3 · edited Apr 13 '17 at 12:19

0

Try this:

let uno = {x:100, y:200};
let dos = {x: 900, y:2000};
let length = 20; //px

let point = {
  x: findPoint(length, uno.x, dos.x),
  y: findPoint(length, uno.y, dos.y),
}

console.log(point);

function findPoint(d, a, b) {
  return d * (b - a) + a;
}

Based on https://math.stackexchange.com/a/1625335; haven't tested this myself.

edited Apr 13 '17 at 12:19

Community

1
1

answered Jan 18 '17 at 21:42

RyanZim

6,609
1
27
43

Sure the result is right. You should divide by the length between `uno` and `dos` first – ibrahim mahrir Jan 18 '17 at 21:46
@ibrahimmahrir I'm not following what you're saying (sorry, not real good at math). If you can make the code smarter, feel free to edit. – RyanZim Jan 18 '17 at 21:49

Get coordinate by length between two points

3 Answers3