JavaScript 二次函数模拟抛物线

Question

我想用一个数组（可以是任何大小）生成一个反二次函数。例如，我不想使用线性计算来确定完成百分比（例如 3 / 10 * 100 = 30%），而是使用二次曲线，以便随着更多问题的回答百分比变平，直到所有问题都得到回答（一次所有问题的回答都应该 100% 完成）。根据定义，二次函数的指数为 2，并且在反转形状时前导系数为负。

注意下面抛物线图中直到顶点的漂亮曲线：

这是我试过的：

const questions = ['q1', 'q2', 'q3', 'q4', 'q5', 'q6', 'q7', 'q8','q9','q10'];

function inverseQuad(x, len) {
 return ((x)**2) * 100;
}

inverseQuad(.1, 10); // 1%
inverseQuad(.2, 10); // 4%
inverseQuad(.3, 10); // 9%
...
inverseQuad(.9, 10); // 81%
inverseQuad(1, 10); //  100%

它正在朝着错误的方向前进。它没有倒置。我怎样才能清理这个二次函数？

Answer 1

如果你正在寻找二次曲面，它看起来有点不同。大多数时候，这些曲线用于补间、开始、结束和速度。

例如，您在这里看到一些图表：https://sole.github.io/tween.js/examples/03_graphs.html

幸运的是，他们已经为这些曲线编写了脚本：https://github.com/tweenjs/tween.js/blob/master/src/Tween.js

寻找 Quadratic，您会发现以下内容：

Quadratic: {
    In: function (k) {
        return k * k;
    },

    Out: function (k) {
        return k * (2 - k);
    },

    InOut: function (k) {
        if ((k *= 2) < 1) {
            return 0.5 * k * k;
        }
        return - 0.5 * (--k * (k - 2) - 1);

    }

},

我认为这个公式就是你要找的，如果没有，请查看其他图表之一并找到相应的公式。

注意：您需要具有标准化值
注意：要反转输出只需执行 1 - output

Answer 2

一种编写二次方程的简单方法：

const completion = (qs, total) => Math .round (100 * qs / total *  (2 - qs / total));

[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10] .forEach (x => {
  console .log (`${x} => ${completion (x, 10)}`)
})

这本质上是 100 * (1 - (1 - x)**2)，其中 x 是实际完成分数。显然，如果输入是那个分数会更简单：const completion = (x) => 100 * x * (2 - x).

但我不得不说，用这个来让人们对他们的完成率感觉更好似乎是一个非常不友好的谎言。

JavaScript 二次函数模拟抛物线

A JavaScript Quadratic Function to Simulate a Parabolic Curve

javascript

algorithm

math

trigonometry