Преобразование линейных значений слайдера в экспоненту

Question

Преобразование линейных значений слайдера в экспоненту

У меня есть слайдер:

min val. = 0

max val. = 20'000

step = 0.1

min, max значения и step являются constants.
На каждом шаге (например, изменение положения большого пальца) ползунок возвращает текущее значение и положение большого пальца в %.

Как я могу преобразовать текущее возвращаемое значение, чтобы оно росло экспоненциально, как на 2-м графике-где 0-8 ' 000-занимает 80% ширины слайдера.

Красная графика:

На каждом шаге (изменение положения большого пальца) ползунок возвращает текущее значение
и положение большого пальца в % - текущее значение растет линейно в зависимости от
положение большого пальца.

Зеленая графика:

Это то, что мне нужно. Я могу использовать только текущее положение большого пальца и текущий
значение ползунка в качестве аргументов функции.

550 1

javascript math

1 ответ:

Comments

Ничего не найдено.

Nina Scholz · Accepted Answer · 2017-05-23 15:32:35

Можно использовать функцию ослабления.

Формулы ослабления: http://easings.net/
описание: Что такое функция ослабления?

// formula     http://easings.net/
// description https://stackoverflow.com/questions/8316882/what-is-an-easing-function
// x: percent
// t: current time,
// b: beginning value,
// c: change in value,
// d: duration

function easeOutQuart(x, t, b, c, d) {
    return -c * ((t = t / d - 1) * t * t * t - 1) + b;
}

var i;
for (i = 0; i <= 20000; i += 1000) {
    console.log(i, i * 100 / 20000, easeOutQuart(null, i * 100 / 20000, 0, 100, 100));
}

.as-console-wrapper { max-height: 100% !important; top: 0; }