Question

我的三角函数不仅仅是弱，因此我不知道如何绘制比全行起点和终点更短的线段。

我试过的是，从起点减去目标点的一小部分，但是它导致错误的线。

/* 
 * this is an excerpt from fiddle, that shows
 * the actual calculation functions I have implemented
 */
var target = {
    x : width / 2 + 60,
    y : 20
};

var start = {
    x : width / 2,
    y : height
};

var current = {
    x : 0,
    y : 0
};

var growth = 0.5;

current.x = start.x - (target.x * growth);
current.y = start.y - (target.y * growth);

我敢打赌，我必须使用sin / cos或三角测量分支中的其他东西才能使其正确。但是，由于我的三角学甚至没有生锈，但总的来说很弱，我被卡住了。

如何绘制正确的目标线？

Answer 1

如果我理解正确，那么这应该会给你你想要的东西：

current.x = start.x + (target.x - start.x) * growth;
current.y = start.y + (target.y - start.y) * growth;

Answer 2

该方程是线性插值，与线性缓动相同。取开始和结束的增量（最小值和最大值），将其乘以沿增量的距离的百分比（法线），然后将其加回到起始值。不可思议的必要算法：）

画布，绘制线段

2 个答案: