javascript - 根据 x 距离增加行高

Question

我有 4 条线，想要将高度增加 5 像素，但基于 x 距离。如果 x 距离具有相同的值，那就很简单，但在我的情况下，它可以不同。例如，如果 x 距离是这样:

line.x: 50, 80, 110, 130
line.y: 20, 20, 20, 20

我可以做到

line.x: 50, 80, 110, 130
line.height: 20, 25, 30, 35

但是当 x 距离是这样时我该如何进行数学计算:

line.x: 50, 80, 95, 130

编辑:这是一个示例图像:

Answer 1

我认为您需要一个在 line.x[0] 和 line.x[3] 之间上升 15 个单位的直线方程。如果是这样，则以下操作应该有效:

let line_x = [50,80,95,130];
let m = 15/(line_x[3]-line_x[0]);
line_y = line_x.map(x => m*(x-line_x[0]) + 20);
console.log(line_y);
//[ 20, 25.625, 28.4375, 35 ]

用简化的表示法来说，关键步骤是将y计算为y = m(x-x[0]) + 20，其中m = 15/(x[ 3]-x[0])(这是一个简单的slope =rise/run计算)。