Skip to content

Commit c7cf6e2

Browse files
committed
Easing.generateExponential()
Given a value of 300, this is very close Easing.Exponential, but it will hit 0 when amount is 0, therefore being an alternative to Exponential to avoid the jump issue mentioned in #116.
1 parent e99549b commit c7cf6e2

File tree

2 files changed

+60
-1
lines changed

2 files changed

+60
-1
lines changed

package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@
2323
"tween",
2424
"interpolation"
2525
],
26-
"dependencies": {},
2726
"scripts": {
2827
"dev": "(npm run tsc-watch -- --preserveWatchOutput & p1=$!; npm run rollup-build -- --watch & p2=$!; wait $p1 $p2)",
2928
"build": "rimraf dist .tmp && node scripts/write-version.js && npm run tsc && npm run rollup-build",

src/Easing.ts

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -219,6 +219,66 @@ const Easing = {
219219
},
220220
}
221221
},
222+
generateExponential: function (
223+
// A value of 300 is makes the curve very close to Exponential with its value of 1024.
224+
base = 300,
225+
): {
226+
In(amount: number): number
227+
Out(amount: number): number
228+
InOut(amount: number): number
229+
} {
230+
// https://www.desmos.com/calculator/pioplwo3zq
231+
232+
if (base <= 0) {
233+
console.warn(
234+
'base should be larger than 0. You might like to try between 20 and 400, maybe more. Setting a default value of 300.',
235+
)
236+
base = 300
237+
}
238+
239+
function In(amount: number): number {
240+
// Start similar to Exponential
241+
let expo = base ** (amount - 1)
242+
243+
// adjust so it hits 0 when amount is 0
244+
expo = expo - expo * (1 - amount)
245+
246+
return expo
247+
}
248+
249+
function Out(amount: number): number {
250+
// translate X by 1
251+
amount = amount + 1
252+
253+
// Similar to In, but negate power to make the graph have a negative slope instead of positive.
254+
let expo = base ** -(amount - 1)
255+
256+
// adjust so it hits 1 when amount is 1
257+
expo = expo - expo * -(1 - amount)
258+
259+
// Flip it upside down, move it up by 1.
260+
return -expo + 1
261+
}
262+
263+
function InOut(amount: number): number {
264+
amount *= 2
265+
266+
if (amount < 1) return In(amount) / 2
267+
268+
// Similar to In, but negate power to make the graph have a negative slope instead of positive.
269+
let expo = base ** -(amount - 1)
270+
271+
// adjust so it hits 1 when amount is 1
272+
expo = expo - expo * -(1 - amount)
273+
274+
// Flip it upside down, move it up by 2.
275+
expo = -expo + 2
276+
277+
return expo / 2
278+
}
279+
280+
return {In, Out, InOut}
281+
},
222282
}
223283

224284
export default Easing

0 commit comments

Comments
 (0)