Last active
February 23, 2018 09:29
-
-
Save Caldis/f7105c7552fbe9ee6731cb97648159de to your computer and use it in GitHub Desktop.
Lerp curve by echart
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var transition = 0.14 | |
var threshold = 0.001 | |
var y = [], x = [] | |
var current = 0.01 | |
var target = 1 | |
// Demo Curve | |
// Lerp Curve | |
var lx = Array.from(new Array(1000), (v, i) => i/1000) | |
var ly = lx.map((v, i) => { | |
var x = v | |
return x * x * x * (x * (x * 6 - 15) + 10) | |
}) | |
// SmoothStep Curve (3rd-order equation) | |
var sx3 = Array.from(new Array(1000), (v, i) => i/1000) | |
var sy3 = sx3.map((v, i) => { | |
var x = v | |
return 1 - x * x * x * (x * (x * 6 - 15) + 10) | |
}) | |
// SmoothStep Curve (2rd-order equation) | |
var sx2 = Array.from(new Array(1000), (v, i) => i/1000) | |
var sy2 = sx2.map((v, i) => { | |
var x = v | |
return 1 - x * x * (3 - 2 * x) | |
}) | |
// Interpolation Curve | |
var interpolation = { | |
lerp: (curr, target, transition) => { | |
var x = target - curr | |
return x * transition | |
}, | |
smoothStep2: (curr, target) => { | |
var x = (target - curr)/target | |
return x * x * (3 - 2 * x) | |
}, | |
smoothStep3: (curr, target) => { | |
var x = (target - curr)/target | |
return x * x * x * (x * (x * 6 - 15) + 10) | |
} | |
} | |
function iterator() { | |
var step = interpolation.lerp(current, target, transition) | |
y.push(step) | |
current += step | |
if (target-current < threshold) { | |
x = Array.from(new Array(y.length), (v, i) => i) | |
} else { | |
iterator() | |
} | |
} | |
iterator() | |
// Render Curve | |
option = { | |
xAxis: { | |
type: 'category', | |
data: x | |
}, | |
yAxis: { | |
type: 'value' | |
}, | |
series: [{ | |
data: y, | |
type: 'line', | |
smooth: true | |
}] | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment