知道点和渐变

Question

我写了一个计算机程序来支持我对微积分的了解。您可以看到网页here

我想要做的下一件事是当用户将鼠标悬停在曲线上时显示曲线的切线。

当发生这种情况时，我确切地知道了鼠标的坐标，我可以得到导数，在这种情况下是2x -2，所以如果该点在（1,1）那么渐变将是0。

如果我用笔和纸画这个，那么我会把方程重新排列成y2-y1 = m（x2 -x1）。

我不完全确定如何使用代码执行此操作。

我尝试得到y截距和x截距，但切线看起来不对：

function getYIntercept(vertex, slope) {
  return vertex.y - (slope * vertex.x);
}

const yIntercept = getYIntercept(point, gradient);
const xIntercept =  - yIntercept / (gradient);

g.append('line')
    .style('stroke', 'red')
    .attr('class', 'tangent')
    .attr('x1', xScale(point.x))
    .attr('y1', yScale(point.y))
    .attr('x2', xScale(xIntercept))
    .attr('y2', yScale(yIntercept));
};

我可以用我的信息绘制这一行吗？

Answer 1

查找切线

• 让我们从函数 f（x）开始。
• 计算 f＆＃39;（x）（衍生物）以供将来参考。
• 然后用户指出某点（x1，y1）。
• 使用 f＆＃39;（x），此时的斜率为 m = f＆＃39;（x1）。
• 利用Point-Slope公式，切线方程为 y-y1 = m（x-x1）
• 解决 y ：
  • y = m（x-x1）+ y1

查找拦截

对于x和y截距[此处分别表示为 x0 和 y0 ]，只需使用切线方程。可能有用的是要注意截距是（x0,0）和（0，y0），因此为正确的变量插入零可以让您找到截距。

• 找到y截距，因此 x = 0
• 因此 y = m（0-x1）+ y1
• 分发 m 会离开 y = -m * x1 + y1
• 所以 y0 = -m * x1 + y1 ，y截距为（0，-m * x1 + y1）

这是绘制切线图形所需的全部内容。但是如果你对x拦截也感到好奇。

• 找到x截距，因此 y = 0
• 因此 0 = m（x-x1）+ y1
• 分发 m 离开 0 = m * x - m * x1 + y1
• 减去 x1 和 y1 术语会产生 m * x1-y1 = m * x
• 现在除以 m ，以便 [m * x1-y1] / m = x
• 所以 x0 = [m * x1-y1] / m ，x截距为（[m * x1-y1] / m，0）

此案例的具体内容

以下是一些问题：

• （1,1）不是函数的一个点 f（x）= x ^ 2 - 2 * x + 1
  • 要解决此问题，您只需使用用户悬停的点的x值
  即可
  • 或者，您可以考虑绘制slope field
  的图表
• x截距和y截距是两个不同的点，而不是一个点的x和y值

一旦解决了这些问题，您就可以正确地绘制您知道一阶导数的任何函数的正切值！