EaseFunction svg graphs in doc (#17461)

# Objective

The docs of `EaseFunction` don't visualize the different functions,
requiring you to check out the Bevy repo and running the
`easing_function` example.

## Solution

- Add tool to generate suitable svg graphs. This only needs to be re-run
when adding new ease functions.
- works with all themes
- also add missing easing functions to example.

---

## Showcase

![Graphs](https://i.imgur.com/V2oTEUq.png)

---------

Co-authored-by: François Mockers <mockersf@gmail.com>
This commit is contained in:
SpecificProtagonist 2025-02-08 10:52:39 +01:00 committed by GitHub
parent bcfc086f3d
commit 7c2d54c93f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
44 changed files with 430 additions and 2 deletions

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.1799718" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>BackIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 1.0001708 0.02020202 1.0006722 0.030303031 1.0014874 0.04040404 1.0025996 0.05050505 1.0039923 0.060606062 1.0056486 0.07070707 1.007552 0.08080808 1.0096856 0.09090909 1.0120329 0.1010101 1.014577 0.11111111 1.0173013 0.121212125 1.020189 0.13131313 1.0232235 0.14141414 1.026388 0.15151516 1.029666 0.16161616 1.0330405 0.17171717 1.036495 0.18181819 1.0400127 0.1919192 1.043577 0.2020202 1.047171 0.21212122 1.0507782 0.22222222 1.0543817 0.23232323 1.0579649 0.24242425 1.0615112 0.25252524 1.0650038 0.26262626 1.0684259 0.27272728 1.0717609 0.28282827 1.0749921 0.2929293 1.0781027 0.3030303 1.0810761 0.3131313 1.0838957 0.32323232 1.0865445 0.33333334 1.089006 0.34343433 1.0912633 0.35353535 1.0933 0.36363637 1.0950992 0.37373737 1.0966442 0.3838384 1.0979183 0.3939394 1.0989048 0.4040404 1.099587 0.41414142 1.0999482 0.42424244 1.0999718 0.43434343 1.0996408 0.44444445 1.0989388 0.45454547 1.097849 0.46464646 1.0963547 0.47474748 1.094439 0.4848485 1.0920855 0.4949495 1.0892773 0.5050505 1.0859978 0.5151515 1.0822302 0.5252525 1.0779579 0.53535354 1.073164 0.54545456 1.067832 0.5555556 1.0619452 0.56565654 1.0554867 0.57575756 1.04844 0.5858586 1.0407882 0.5959596 1.0325147 0.6060606 1.0236028 0.61616164 1.0140359 0.6262626 1.003797 0.6363636 0.99286985 0.64646465 0.98123723 0.65656567 0.96888274 0.6666667 0.95578957 0.67676765 0.9419412 0.68686867 0.92732066 0.6969697 0.91191137 0.7070707 0.89569664 0.7171717 0.87865967 0.72727275 0.8607839 0.7373737 0.84205264 0.74747473 0.8224489 0.75757575 0.80195624 0.7676768 0.7805579 0.7777778 0.758237 0.7878788 0.73497725 0.7979798 0.71076155 0.8080808 0.68557334 0.8181818 0.6593958 0.82828283 0.6322125 0.83838385 0.6040065 0.8484849 0.57476115 0.85858583 0.5444598 0.86868685 0.5130856 0.8787879 0.48062217 0.8888889 0.44705236 0.8989899 0.4123596 0.90909094 0.37652743 0.9191919 0.33953905 0.9292929 0.30137765 0.93939394 0.2620262 0.94949496 0.22146857 0.959596 0.17968786 0.969697 0.13666725 0.97979796 0.09239054 0.989899 0.04684031 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.17926434 1.08 1.3585287" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>BackInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 1.000641 0.02020202 1.0024943 0.030303031 1.0054554 0.04040404 1.0094196 0.05050505 1.0142825 0.060606062 1.0199395 0.07070707 1.0262861 0.08080808 1.0332178 0.09090909 1.04063 0.1010101 1.048418 0.11111111 1.0564775 0.121212125 1.064704 0.13131313 1.0729926 0.14141414 1.0812391 0.15151516 1.0893388 0.16161616 1.0971872 0.17171717 1.1046797 0.18181819 1.1117119 0.1919192 1.1181791 0.2020202 1.1239768 0.21212122 1.1290005 0.22222222 1.1331457 0.23232323 1.1363077 0.24242425 1.1383821 0.25252524 1.1392643 0.26262626 1.1388497 0.27272728 1.1370339 0.28282827 1.1337123 0.2929293 1.1287804 0.3030303 1.1221334 0.3131313 1.113667 0.32323232 1.1032767 0.33333334 1.0908577 0.34343433 1.0763059 0.35353535 1.0595162 0.36363637 1.0403844 0.37373737 1.018806 0.3838384 0.99467623 0.3939394 0.96789074 0.4040404 0.9383449 0.41414142 0.9059341 0.42424244 0.8705539 0.43434343 0.83209985 0.44444445 0.79046714 0.45454547 0.7455514 0.46464646 0.6972482 0.47474748 0.6454528 0.4848485 0.5900605 0.4949495 0.53096724 0.5050505 0.46903276 0.5151515 0.40993953 0.5252525 0.3545472 0.53535354 0.30275178 0.54545456 0.25444847 0.5555556 0.20953274 0.56565654 0.16790026 0.57575756 0.12944609 0.5858586 0.094065905 0.5959596 0.061655104 0.6060606 0.0321092 0.61616164 0.0053236485 0.6262626 -0.018805861 0.6363636 -0.04038441 0.64646465 -0.05951619 0.65656567 -0.076305866 0.6666667 -0.09085786 0.67676765 -0.10327661 0.68686867 -0.11366701 0.6969697 -0.122133374 0.7070707 -0.12878036 0.7171717 -0.13371229 0.72727275 -0.13703394 0.7373737 -0.13884974 0.74747473 -0.13926435 0.75757575 -0.13838208 0.7676768 -0.13630772 0.7777778 -0.13314569 0.7878788 -0.12900054 0.7979798 -0.12397683 0.8080808 -0.11817908 0.8181818 -0.11171186 0.82828283 -0.1046797 0.83838385 -0.09718716 0.8484849 -0.08933878 0.85858583 -0.081239104 0.86868685 -0.07299256 0.8787879 -0.06470394 0.8888889 -0.056477547 0.8989899 -0.048418045 0.90909094 -0.040629864 0.9191919 -0.033217788 0.9292929 -0.026286125 0.93939394 -0.019939542 0.94949496 -0.014282465 0.959596 -0.00941956 0.969697 -0.0054552555 0.97979796 -0.0024943352 0.989899 -0.00064098835 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.13997176 1.08 1.1799718" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>BackOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9531597 0.02020202 0.90760946 0.030303031 0.86333275 0.04040404 0.82031214 0.05050505 0.77853143 0.060606062 0.7379738 0.07070707 0.69862235 0.08080808 0.66046095 0.09090909 0.6234726 0.1010101 0.5876404 0.11111111 0.55294764 0.121212125 0.5193778 0.13131313 0.4869144 0.14141414 0.45554018 0.15151516 0.42523885 0.16161616 0.39599347 0.17171717 0.36778748 0.18181819 0.3406042 0.1919192 0.31442666 0.2020202 0.28923845 0.21212122 0.26502264 0.22222222 0.241763 0.23232323 0.21944213 0.24242425 0.19804376 0.25252524 0.17755127 0.26262626 0.15794736 0.27272728 0.13921613 0.28282827 0.121340334 0.2929293 0.10430336 0.3030303 0.08808863 0.3131313 0.07267934 0.32323232 0.058058858 0.33333334 0.044210315 0.34343433 0.03111726 0.35353535 0.018762767 0.36363637 0.007130146 0.37373737 -0.0037970543 0.3838384 -0.01403594 0.3939394 -0.023602843 0.4040404 -0.03251469 0.41414142 -0.040788174 0.42424244 -0.04843998 0.43434343 -0.05548668 0.44444445 -0.0619452 0.45454547 -0.06783199 0.46464646 -0.073163986 0.47474748 -0.07795787 0.4848485 -0.08223021 0.4949495 -0.08599782 0.5050505 -0.08927727 0.5151515 -0.09208548 0.5252525 -0.09443903 0.53535354 -0.096354604 0.54545456 -0.09784901 0.5555556 -0.09893882 0.56565654 -0.099640846 0.57575756 -0.09997177 0.5858586 -0.09994817 0.5959596 -0.09958696 0.6060606 -0.09890485 0.61616164 -0.09791827 0.6262626 -0.09664416 0.6363636 -0.09509909 0.64646465 -0.093299985 0.65656567 -0.091263294 0.6666667 -0.08900595 0.67676765 -0.08654451 0.68686867 -0.08389568 0.6969697 -0.081076145 0.7070707 -0.07810271 0.7171717 -0.07499218 0.72727275 -0.07176089 0.7373737 -0.068425894 0.74747473 -0.06500375 0.75757575 -0.06151128 0.7676768 -0.05796492 0.7777778 -0.05438161 0.7878788 -0.05077815 0.7979798 -0.047170997 0.8080808 -0.043576956 0.8181818 -0.040012717 0.82828283 -0.03649497 0.83838385 -0.033040524 0.8484849 -0.029665947 0.85858583 -0.02638805 0.86868685 -0.02322352 0.8787879 -0.020189047 0.8888889 -0.017301321 0.8989899 -0.014577031 0.90909094 -0.0120328665 0.9191919 -0.009685636 0.9292929 -0.0075520277 0.93939394 -0.005648613 0.94949496 -0.003992319 0.959596 -0.002599597 0.969697 -0.0014873743 0.97979796 -0.000672102 0.989899 -0.00017082691 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.0800003" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>BounceIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99019337 0.02020202 0.98258877 0.030303031 0.977191 0.04040404 0.97399426 0.05050505 0.9730034 0.060606062 0.9742155 0.07070707 0.9776306 0.08080808 0.9832506 0.09090909 0.99107456 0.1010101 0.99790573 0.11111111 0.97832966 0.121212125 0.9612179 0.13131313 0.94656754 0.14141414 0.9343777 0.15151516 0.92465305 0.16161616 0.91738796 0.17171717 0.9125881 0.18181819 0.91024876 0.1919192 0.9103708 0.2020202 0.9129567 0.21212122 0.918005 0.22222222 0.9255142 0.23232323 0.9354873 0.24242425 0.9479213 0.25252524 0.9628186 0.26262626 0.98017836 0.27272728 0.99999905 0.28282827 0.9675927 0.2929293 0.93703747 0.3030303 0.9083333 0.3131313 0.88148165 0.32323232 0.856482 0.33333334 0.8333335 0.34343433 0.812037 0.35353535 0.792593 0.36363637 0.7750001 0.37373737 0.7592592 0.3838384 0.7453706 0.3939394 0.7333336 0.4040404 0.7231486 0.41414142 0.71481514 0.42424244 0.7083335 0.43434343 0.7037041 0.44444445 0.7009263 0.45454547 0.7000005 0.46464646 0.7009263 0.47474748 0.7037039 0.4848485 0.70833373 0.4949495 0.71481514 0.5050505 0.72314835 0.5151515 0.73333335 0.5252525 0.7453706 0.53535354 0.75925946 0.54545456 0.7750006 0.5555556 0.79259276 0.56565654 0.812037 0.57575756 0.83333373 0.5858586 0.85648155 0.5959596 0.88148165 0.6060606 0.9083338 0.61616164 0.93703747 0.6262626 0.9675927 0.6363636 1.0000002 0.64646465 0.94521606 0.65656567 0.8919752 0.6666667 0.8402777 0.67676765 0.79012364 0.68686867 0.7415124 0.6969697 0.6944445 0.7070707 0.64891976 0.7171717 0.6049382 0.72727275 0.5624999 0.7373737 0.521605 0.74747473 0.4822532 0.75757575 0.44444448 0.7676768 0.40817904 0.7777778 0.37345672 0.7878788 0.34027767 0.7979798 0.30864203 0.8080808 0.27854943 0.8181818 0.25 0.82828283 0.22299379 0.83838385 0.1975308 0.8484849 0.17361104 0.85858583 0.15123463 0.86868685 0.13040125 0.8787879 0.111111104 0.8888889 0.09336418 0.8989899 0.07716048 0.90909094 0.06249994 0.9191919 0.049382746 0.9292929 0.037808657 0.93939394 0.027777791 0.94949496 0.01929009 0.959596 0.012345672 0.969697 0.006944418 0.97979796 0.0030864477 0.989899 0.0007715821 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>BounceInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9912944 0.02020202 0.9869971 0.030303031 0.98710775 0.04040404 0.9916253 0.05050505 0.99895287 0.060606062 0.98060894 0.07070707 0.96718884 0.08080808 0.958694 0.09090909 0.9551244 0.1010101 0.95647836 0.11111111 0.9627571 0.121212125 0.97396064 0.13131313 0.9900892 0.14141414 0.98379636 0.15151516 0.95416665 0.16161616 0.928241 0.17171717 0.9060185 0.18181819 0.88750005 0.1919192 0.8726853 0.2020202 0.8615743 0.21212122 0.85416675 0.22222222 0.85046315 0.23232323 0.85046315 0.24242425 0.85416687 0.25252524 0.8615742 0.26262626 0.8726853 0.27272728 0.8875003 0.28282827 0.9060185 0.2929293 0.9282408 0.3030303 0.9541669 0.3131313 0.98379636 0.32323232 0.97260803 0.33333334 0.92013884 0.34343433 0.8707562 0.35353535 0.8244599 0.36363637 0.78124994 0.37373737 0.7411266 0.3838384 0.7040895 0.3939394 0.67013884 0.4040404 0.6392747 0.41414142 0.6114969 0.42424244 0.5868055 0.43434343 0.5652006 0.44444445 0.5466821 0.45454547 0.53125 0.46464646 0.5189043 0.47474748 0.50964504 0.4848485 0.5034722 0.4949495 0.50038576 0.5050505 0.49961418 0.5151515 0.4965278 0.5252525 0.49035496 0.53535354 0.48109567 0.54545456 0.46875 0.5555556 0.45331788 0.56565654 0.43479943 0.57575756 0.41319448 0.5858586 0.38850307 0.5959596 0.36072528 0.6060606 0.32986104 0.61616164 0.29591036 0.6262626 0.25887352 0.6363636 0.21875006 0.64646465 0.17554009 0.65656567 0.12924379 0.6666667 0.079861045 0.67676765 0.027392149 0.68686867 0.016203642 0.6969697 0.04583311 0.7070707 0.071759224 0.7171717 0.093981504 0.72727275 0.11250007 0.7373737 0.12731469 0.74747473 0.13842583 0.75757575 0.14583313 0.7676768 0.14953685 0.7777778 0.14953685 0.7878788 0.14583325 0.7979798 0.13842583 0.8080808 0.12731469 0.8181818 0.11249995 0.82828283 0.093981504 0.83838385 0.071758986 0.8484849 0.04583311 0.85858583 0.016203642 0.86868685 0.009910822 0.8787879 0.026039362 0.8888889 0.03724289 0.8989899 0.043521643 0.90909094 0.0448761 0.9191919 0.041305542 0.9292929 0.032811165 0.93939394 0.01939106 0.94949496 0.0010471344 0.959596 0.008375168 0.969697 0.012892723 0.97979796 0.013002396 0.989899 0.008705616 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.040000238 1.08 1.0800003" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>BounceOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9992284 0.02020202 0.99691355 0.030303031 0.9930556 0.04040404 0.9876543 0.05050505 0.98070985 0.060606062 0.9722222 0.07070707 0.96219134 0.08080808 0.9506173 0.09090909 0.9375 0.1010101 0.9228395 0.11111111 0.9066358 0.121212125 0.8888889 0.13131313 0.86959875 0.14141414 0.84876543 0.15151516 0.8263889 0.16161616 0.80246913 0.17171717 0.7770062 0.18181819 0.75 0.1919192 0.72145057 0.2020202 0.69135803 0.21212122 0.6597222 0.22222222 0.62654316 0.23232323 0.59182096 0.24242425 0.5555555 0.25252524 0.5177469 0.26262626 0.4783951 0.27272728 0.4375 0.28282827 0.3950618 0.2929293 0.35108024 0.3030303 0.30555552 0.3131313 0.2584877 0.32323232 0.20987654 0.33333334 0.15972215 0.34343433 0.108024776 0.35353535 0.05478394 0.36363637 -0.00000023841858 0.37373737 0.032407284 0.3838384 0.06296277 0.3939394 0.09166622 0.4040404 0.11851835 0.41414142 0.14351845 0.42424244 0.16666627 0.43434343 0.18796253 0.44444445 0.20740747 0.45454547 0.2249999 0.46464646 0.24074054 0.47474748 0.25462937 0.4848485 0.26666665 0.4949495 0.27685142 0.5050505 0.28518486 0.5151515 0.29166627 0.5252525 0.29629612 0.53535354 0.2990737 0.54545456 0.29999995 0.5555556 0.2990737 0.56565654 0.29629588 0.57575756 0.2916665 0.5858586 0.28518486 0.5959596 0.27685142 0.6060606 0.2666664 0.61616164 0.25462914 0.6262626 0.2407403 0.6363636 0.2249999 0.64646465 0.207407 0.65656567 0.18796301 0.6666667 0.16666603 0.67676765 0.14351797 0.68686867 0.11851835 0.6969697 0.0916667 0.7070707 0.06296253 0.7171717 0.032407284 0.72727275 0.0000009536743 0.7373737 0.019821644 0.74747473 0.037181854 0.75757575 0.052078724 0.7676768 0.06451273 0.7777778 0.07448578 0.7878788 0.08199549 0.7979798 0.087043285 0.8080808 0.08962917 0.8181818 0.08975124 0.82828283 0.08741188 0.83838385 0.08261204 0.8484849 0.07534695 0.85858583 0.06562233 0.86868685 0.053432465 0.8787879 0.03878212 0.8888889 0.021670341 0.8989899 0.0020942688 0.90909094 0.008925438 0.9191919 0.016749382 0.9292929 0.022369385 0.93939394 0.025784492 0.94949496 0.026996613 0.959596 0.026005745 0.969697 0.022809029 0.97979796 0.017411232 0.989899 0.009806633 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>CircularIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.999949 0.02020202 0.9997959 0.030303031 0.99954075 0.04040404 0.9991834 0.05050505 0.9987238 0.060606062 0.9981618 0.07070707 0.9974971 0.08080808 0.9967297 0.09090909 0.9958592 0.1010101 0.9948854 0.11111111 0.993808 0.121212125 0.9926266 0.13131313 0.99134094 0.14141414 0.98995054 0.15151516 0.98845494 0.16161616 0.9868537 0.17171717 0.9851463 0.18181819 0.98333216 0.1919192 0.98141074 0.2020202 0.9793814 0.21212122 0.97724336 0.22222222 0.97499603 0.23232323 0.9726386 0.24242425 0.9701703 0.25252524 0.96759033 0.26262626 0.96489763 0.27272728 0.9620914 0.28282827 0.9591706 0.2929293 0.95613414 0.3030303 0.95298094 0.3131313 0.94970983 0.32323232 0.94631964 0.33333334 0.94280905 0.34343433 0.9391767 0.35353535 0.93542117 0.36363637 0.93154097 0.37373737 0.9275346 0.3838384 0.9234003 0.3939394 0.9191364 0.4040404 0.91474116 0.41414142 0.9102126 0.42424244 0.90554863 0.43434343 0.90074736 0.44444445 0.89580643 0.45454547 0.8907235 0.46464646 0.88549626 0.47474748 0.88012207 0.4848485 0.87459815 0.4949495 0.86892176 0.5050505 0.8630898 0.5151515 0.8570991 0.5252525 0.85094637 0.53535354 0.84462804 0.54545456 0.8381404 0.5555556 0.8314794 0.56565654 0.8246409 0.57575756 0.81762046 0.5858586 0.8104133 0.5959596 0.8030144 0.6060606 0.7954185 0.61616164 0.7876197 0.6262626 0.7796122 0.6363636 0.77138925 0.64646465 0.7629439 0.65656567 0.7542689 0.6666667 0.74535596 0.67676765 0.73619664 0.68686867 0.7267816 0.6969697 0.71710056 0.7070707 0.70714283 0.7171717 0.6968965 0.72727275 0.68634856 0.7373737 0.675485 0.74747473 0.66429025 0.75757575 0.6527473 0.7676768 0.64083725 0.7777778 0.6285394 0.7878788 0.6158303 0.7979798 0.6026842 0.8080808 0.5890717 0.8181818 0.5749596 0.82828283 0.56031024 0.83838385 0.5450803 0.8484849 0.5292196 0.85858583 0.51266986 0.86868685 0.49536163 0.8787879 0.4772126 0.8888889 0.45812285 0.8989899 0.43796933 0.90909094 0.41659772 0.9191919 0.3938099 0.9292929 0.36934352 0.93939394 0.34283972 0.94949496 0.31378222 0.959596 0.2813815 0.969697 0.24431074 0.97979796 0.19998991 0.989899 0.14177448 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>CircularInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99989796 0.02020202 0.9995917 0.030303031 0.9990809 0.04040404 0.9983648 0.05050505 0.9974427 0.060606062 0.99631333 0.07070707 0.99497527 0.08080808 0.99342686 0.09090909 0.9916661 0.1010101 0.98969066 0.11111111 0.98749804 0.121212125 0.9850851 0.13131313 0.9824488 0.14141414 0.9795853 0.15151516 0.9764905 0.16161616 0.9731598 0.17171717 0.96958834 0.18181819 0.9657705 0.1919192 0.96170014 0.2020202 0.9573706 0.21212122 0.9527743 0.22222222 0.9479032 0.23232323 0.9427481 0.24242425 0.9372991 0.25252524 0.9315449 0.26262626 0.9254732 0.27272728 0.91907024 0.28282827 0.9123205 0.2929293 0.9052067 0.3030303 0.89770925 0.3131313 0.8898061 0.32323232 0.881472 0.33333334 0.872678 0.34343433 0.8633908 0.35353535 0.8535714 0.36363637 0.8431743 0.37373737 0.8321451 0.3838384 0.8204186 0.3939394 0.80791515 0.4040404 0.7945359 0.41414142 0.7801551 0.42424244 0.7646098 0.43434343 0.7476808 0.44444445 0.7290614 0.45454547 0.70829886 0.46464646 0.68467176 0.47474748 0.6568911 0.4848485 0.62215537 0.4949495 0.5708872 0.5050505 0.42911297 0.5151515 0.37784463 0.5252525 0.3431089 0.53535354 0.31532824 0.54545456 0.29170108 0.5555556 0.27093852 0.56565654 0.25231922 0.57575756 0.23539019 0.5858586 0.21984488 0.5959596 0.20546412 0.6060606 0.19208479 0.61616164 0.17958134 0.6262626 0.1678549 0.6363636 0.15682572 0.64646465 0.14642859 0.65656567 0.1366092 0.6666667 0.12732196 0.67676765 0.11852807 0.68686867 0.11019391 0.6969697 0.10229075 0.7070707 0.09479332 0.7171717 0.087679505 0.72727275 0.080929756 0.7373737 0.07452679 0.74747473 0.0684551 0.75757575 0.06270093 0.7676768 0.05725187 0.7777778 0.052096784 0.7878788 0.047225654 0.7979798 0.04262942 0.8080808 0.03829986 0.8181818 0.034229517 0.82828283 0.03041166 0.83838385 0.02684021 0.8484849 0.023509502 0.85858583 0.02041471 0.86868685 0.017551184 0.8787879 0.01491487 0.8888889 0.012501955 0.8989899 0.010309339 0.90909094 0.008333921 0.9191919 0.0065732 0.9292929 0.005024731 0.93939394 0.0036866665 0.94949496 0.0025572777 0.959596 0.0016351938 0.969697 0.0009191036 0.97979796 0.00040829182 0.989899 0.00010204315 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>CircularOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.8582255 0.02020202 0.8000101 0.030303031 0.75568926 0.04040404 0.7186185 0.05050505 0.6862178 0.060606062 0.6571603 0.07070707 0.6306565 0.08080808 0.6061901 0.09090909 0.58340216 0.1010101 0.5620307 0.11111111 0.54187715 0.121212125 0.5227874 0.13131313 0.5046384 0.14141414 0.48733014 0.15151516 0.47078037 0.16161616 0.4549197 0.17171717 0.43968976 0.18181819 0.42504042 0.1919192 0.4109283 0.2020202 0.39731586 0.21212122 0.38416964 0.22222222 0.37146062 0.23232323 0.35916275 0.24242425 0.34725273 0.25252524 0.3357098 0.26262626 0.32451499 0.27272728 0.31365144 0.28282827 0.3031035 0.2929293 0.29285717 0.3030303 0.28289944 0.3131313 0.2732184 0.32323232 0.26380336 0.33333334 0.25464398 0.34343433 0.24573112 0.35353535 0.23705608 0.36363637 0.22861075 0.37373737 0.22038782 0.3838384 0.21238023 0.3939394 0.2045815 0.4040404 0.1969856 0.41414142 0.1895867 0.42424244 0.18237954 0.43434343 0.17535907 0.44444445 0.16852063 0.45454547 0.16185957 0.46464646 0.15537196 0.47474748 0.14905363 0.4848485 0.14290088 0.4949495 0.13691026 0.5050505 0.13107824 0.5151515 0.12540185 0.5252525 0.119877934 0.53535354 0.11450374 0.54545456 0.10927647 0.5555556 0.10419357 0.56565654 0.09925264 0.57575756 0.09445137 0.5858586 0.08978742 0.5959596 0.08525884 0.6060606 0.080863535 0.61616164 0.07659972 0.6262626 0.07246548 0.6363636 0.068459034 0.64646465 0.06457883 0.65656567 0.06082332 0.6666667 0.057190955 0.67676765 0.05368036 0.68686867 0.050290167 0.6969697 0.047019064 0.7070707 0.04386586 0.7171717 0.04082942 0.72727275 0.037908614 0.7373737 0.035102367 0.74747473 0.032409668 0.75757575 0.02982968 0.7676768 0.027361393 0.7777778 0.02500397 0.7878788 0.022756636 0.7979798 0.020618677 0.8080808 0.018589258 0.8181818 0.016667843 0.82828283 0.014853716 0.83838385 0.013146281 0.8484849 0.011545062 0.85858583 0.010049462 0.86868685 0.008659065 0.8787879 0.0073733926 0.8888889 0.0061920285 0.8989899 0.005114615 0.90909094 0.0041407943 0.9191919 0.003270328 0.9292929 0.0025029182 0.93939394 0.0018382072 0.94949496 0.001276195 0.959596 0.00081658363 0.969697 0.0004592538 0.97979796 0.0002040863 0.989899 0.000051021576 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>CubicIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.999999 0.02020202 0.9999918 0.030303031 0.99997216 0.04040404 0.999934 0.05050505 0.9998712 0.060606062 0.9997774 0.07070707 0.9996465 0.08080808 0.9994723 0.09090909 0.9992487 0.1010101 0.9989694 0.11111111 0.99862826 0.121212125 0.99821913 0.13131313 0.99773574 0.14141414 0.997172 0.15151516 0.9965217 0.16161616 0.9957786 0.17171717 0.9949366 0.18181819 0.99398947 0.1919192 0.99293107 0.2020202 0.9917551 0.21212122 0.9904555 0.22222222 0.98902607 0.23232323 0.98746055 0.24242425 0.9857528 0.25252524 0.98389673 0.26262626 0.98188597 0.27272728 0.9797145 0.28282827 0.97737604 0.2929293 0.9748644 0.3030303 0.9721735 0.3131313 0.9692971 0.32323232 0.96622896 0.33333334 0.962963 0.34343433 0.9594929 0.35353535 0.9558126 0.36363637 0.95191586 0.37373737 0.9477965 0.3838384 0.94344836 0.3939394 0.93886524 0.4040404 0.93404096 0.41414142 0.9289693 0.42424244 0.9236441 0.43434343 0.9180593 0.44444445 0.9122085 0.45454547 0.9060856 0.46464646 0.89968455 0.47474748 0.89299893 0.4848485 0.88602275 0.4949495 0.8787497 0.5050505 0.87117374 0.5151515 0.8632885 0.5252525 0.855088 0.53535354 0.84656584 0.54545456 0.837716 0.5555556 0.8285322 0.56565654 0.81900835 0.57575756 0.80913824 0.5858586 0.7989156 0.5959596 0.7883343 0.6060606 0.7773882 0.61616164 0.766071 0.6262626 0.75437677 0.6363636 0.7422991 0.64646465 0.7298317 0.65656567 0.71696866 0.6666667 0.70370364 0.67676765 0.69003063 0.68686867 0.67594326 0.6969697 0.6614353 0.7070707 0.6465007 0.7171717 0.6311333 0.72727275 0.61532676 0.7373737 0.5990752 0.74747473 0.58237207 0.75757575 0.56521136 0.7676768 0.54758686 0.7777778 0.52949244 0.7878788 0.51092184 0.7979798 0.49186903 0.8080808 0.47232765 0.8181818 0.4522915 0.82828283 0.43175453 0.83838385 0.4107105 0.8484849 0.38915318 0.85858583 0.36707658 0.86868685 0.34447426 0.8787879 0.32134014 0.8888889 0.29766804 0.8989899 0.27345175 0.90909094 0.24868512 0.9191919 0.22336215 0.9292929 0.19747627 0.93939394 0.17102152 0.94949496 0.14399165 0.959596 0.11638057 0.969697 0.08818203 0.97979796 0.05939001 0.989899 0.029998004 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>CubicInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9999959 0.02020202 0.99996704 0.030303031 0.9998887 0.04040404 0.9997362 0.05050505 0.9994847 0.060606062 0.99910957 0.07070707 0.998586 0.08080808 0.99788934 0.09090909 0.99699473 0.1010101 0.99587756 0.11111111 0.99451303 0.121212125 0.9928764 0.13131313 0.990943 0.14141414 0.98868805 0.15151516 0.9860868 0.16161616 0.9831145 0.17171717 0.97974646 0.18181819 0.97595793 0.1919192 0.97172415 0.2020202 0.96702045 0.21212122 0.9618221 0.22222222 0.9561043 0.23232323 0.9498423 0.24242425 0.9430114 0.25252524 0.93558687 0.26262626 0.927544 0.27272728 0.918858 0.28282827 0.9095042 0.2929293 0.8994578 0.3030303 0.8886941 0.3131313 0.8771884 0.32323232 0.86491585 0.33333334 0.8518518 0.34343433 0.8379716 0.35353535 0.82325035 0.36363637 0.8076634 0.37373737 0.79118603 0.3838384 0.77379346 0.3939394 0.7554609 0.4040404 0.73616385 0.41414142 0.7158773 0.42424244 0.6945766 0.43434343 0.67223716 0.44444445 0.648834 0.45454547 0.62434256 0.46464646 0.59873813 0.47474748 0.57199585 0.4848485 0.544091 0.4949495 0.51499903 0.5050505 0.4850011 0.5151515 0.455909 0.5252525 0.42800415 0.53535354 0.40126187 0.54545456 0.37565738 0.5555556 0.3511659 0.56565654 0.32776296 0.57575756 0.30542338 0.5858586 0.2841227 0.5959596 0.26383615 0.6060606 0.24453902 0.61616164 0.22620654 0.6262626 0.20881402 0.6363636 0.19233662 0.64646465 0.17674965 0.65656567 0.16202837 0.6666667 0.14814812 0.67676765 0.13508415 0.68686867 0.122811675 0.6969697 0.11130589 0.7070707 0.10054219 0.7171717 0.090495825 0.72727275 0.08114195 0.7373737 0.07245606 0.74747473 0.06441313 0.75757575 0.056988597 0.7676768 0.050157726 0.7777778 0.04389572 0.7878788 0.038177907 0.7979798 0.032979548 0.8080808 0.028275847 0.8181818 0.02404207 0.82828283 0.02025354 0.83838385 0.016885519 0.8484849 0.013913214 0.85858583 0.011312008 0.86868685 0.009056985 0.8787879 0.0071235895 0.8888889 0.005486965 0.8989899 0.004122436 0.90909094 0.0030052662 0.9191919 0.0021107197 0.9292929 0.001414001 0.93939394 0.0008904338 0.94949496 0.00051528215 0.959596 0.00026381016 0.969697 0.00011128187 0.97979796 0.00003296137 0.989899 0.0000041127205 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>CubicOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.970002 0.02020202 0.94061 0.030303031 0.91181797 0.04040404 0.8836194 0.05050505 0.85600835 0.060606062 0.8289785 0.07070707 0.80252373 0.08080808 0.77663785 0.09090909 0.75131476 0.1010101 0.72654825 0.11111111 0.70233196 0.121212125 0.67865986 0.13131313 0.65552574 0.14141414 0.6329234 0.15151516 0.6108468 0.16161616 0.5892895 0.17171717 0.5682455 0.18181819 0.5477085 0.1919192 0.52767235 0.2020202 0.508131 0.21212122 0.48907804 0.22222222 0.47050756 0.23232323 0.45241314 0.24242425 0.43478864 0.25252524 0.41762805 0.26262626 0.4009248 0.27272728 0.38467324 0.28282827 0.36886668 0.2929293 0.3534993 0.3030303 0.3385647 0.3131313 0.32405674 0.32323232 0.30996943 0.33333334 0.29629624 0.34343433 0.28303134 0.35353535 0.2701683 0.36363637 0.25770092 0.37373737 0.24562329 0.3838384 0.23392892 0.3939394 0.22261178 0.4040404 0.21166569 0.41414142 0.20108438 0.42424244 0.19086176 0.43434343 0.18099165 0.44444445 0.17146778 0.45454547 0.16228396 0.46464646 0.15343416 0.47474748 0.144912 0.4848485 0.13671148 0.4949495 0.12882626 0.5050505 0.12125027 0.5151515 0.11397725 0.5252525 0.107001066 0.53535354 0.10031545 0.54545456 0.09391433 0.5555556 0.0877915 0.56565654 0.08194071 0.57575756 0.076355875 0.5858586 0.07103068 0.5959596 0.06595904 0.6060606 0.061134756 0.61616164 0.056551635 0.6262626 0.052203536 0.6363636 0.04808414 0.64646465 0.044187427 0.65656567 0.04050708 0.6666667 0.037037015 0.67676765 0.033771038 0.68686867 0.030702889 0.6969697 0.027826488 0.7070707 0.025135577 0.7171717 0.022623956 0.72727275 0.020285487 0.7373737 0.01811403 0.74747473 0.016103268 0.75757575 0.014247179 0.7676768 0.012539446 0.7777778 0.01097393 0.7878788 0.009544492 0.7979798 0.008244872 0.8080808 0.007068932 0.8181818 0.0060105324 0.82828283 0.0050634146 0.83838385 0.0042213798 0.8484849 0.0034782887 0.85858583 0.002828002 0.86868685 0.0022642612 0.8787879 0.0017808676 0.8888889 0.0013717413 0.8989899 0.0010306239 0.90909094 0.00075131655 0.9191919 0.0005276799 0.9292929 0.00035351515 0.93939394 0.00022262335 0.94949496 0.00012880564 0.959596 0.00006598234 0.969697 0.00002783537 0.97979796 0.000008225441 0.989899 0.000001013279 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.9130816 1.08 1.9530816" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>Elastic(50.0)</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.87652457 0.02020202 0.5430269 0.030303031 0.08985078 0.04040404 -0.36685824 0.05050505 -0.7148113 0.060606062 -0.87308156 0.07070707 -0.8107506 0.08080808 -0.55244195 0.09090909 -0.1699208 0.1010101 0.23758578 0.11111111 0.5690067 0.121212125 0.74639827 0.13131313 0.7331244 0.14141414 0.5410442 0.15151516 0.22541612 0.16161616 -0.13067424 0.17171717 -0.43805146 0.18181819 -0.62368226 0.1919192 -0.64789987 0.2020202 -0.51258254 0.21212122 -0.2586938 0.22222222 0.045701385 0.23232323 0.323524 0.24242425 0.50810283 0.25252524 0.5590545 0.26262626 0.47088003 0.27272728 0.27251196 0.28282827 0.018388987 0.2929293 -0.22629714 0.3030303 -0.40221977 0.3131313 -0.470196 0.32323232 -0.4197166 0.33333334 -0.26991928 0.34343433 -0.063200235 0.35353535 0.14656717 0.36363637 0.30795324 0.37373737 0.384485 0.3838384 0.3627196 0.3939394 0.25414383 0.4040404 0.09079921 0.41414142 -0.08389914 0.42424244 -0.22657609 0.43434343 -0.30457044 0.44444445 -0.30326605 0.45454547 -0.22847569 0.46464646 -0.10361636 0.47474748 0.03728491 0.4848485 0.15871769 0.4949495 0.23254418 0.5050505 0.2443906 0.5151515 0.19616282 0.5252525 0.10433936 0.53535354 -0.0052199364 0.54545456 -0.10439193 0.5555556 -0.16991067 0.56565654 -0.18871152 0.57575756 -0.1603024 0.5858586 -0.095810294 0.5959596 -0.014217138 0.6060606 0.06303555 0.61616164 0.11757636 0.6262626 0.13836896 0.6363636 0.12374747 0.64646465 0.080914974 0.65656567 0.023267984 0.6666667 -0.03356588 0.67676765 -0.07585454 0.68686867 -0.094979525 0.6969697 -0.089021325 0.7070707 -0.062480092 0.7171717 -0.024399519 0.72727275 0.014448881 0.7373737 0.044489622 0.74747473 0.059607744 0.75757575 0.058243513 0.7676768 0.043173373 0.7777778 0.020197451 0.7878788 -0.0037806034 0.7979798 -0.022693872 0.8080808 -0.032753825 0.8181818 -0.033070922 0.82828283 -0.025409937 0.83838385 -0.013266563 0.8484849 -0.00062561035 0.85858583 0.009203136 0.86868685 0.014359295 0.8787879 0.014653623 0.8888889 0.0112707615 0.8989899 0.006127298 0.90909094 0.0011420846 0.9191919 -0.0023419857 0.9292929 -0.00382936 0.93939394 -0.0036069155 0.94949496 -0.002430439 0.959596 -0.0011194944 0.969697 -0.0002272129 0.97979796 0.000103116035 0.989899 0.000070393085 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.4520154" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>ElasticIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1.0004883 0.01010101 1.0003215 0.02020202 1.0001127 0.030303031 0.9998665 0.04040404 0.9995903 0.05050505 0.9992944 0.060606062 0.99899143 0.07070707 0.9986965 0.08080808 0.99842644 0.09090909 0.9981993 0.1010101 0.9980336 0.11111111 0.9979474 0.121212125 0.99795717 0.13131313 0.99807686 0.14141414 0.9983166 0.15151516 0.9986817 0.16161616 0.9991718 0.17171717 0.9997794 0.18181819 1.0004901 0.1919192 1.0012816 0.2020202 1.002124 0.21212122 1.0029804 0.22222222 1.0038071 0.23232323 1.0045561 0.24242425 1.0051758 0.25252524 1.0056139 0.26262626 1.0058199 0.27272728 1.0057479 0.28282827 1.00536 0.2929293 1.0046293 0.3030303 1.0035429 0.3131313 1.0021052 0.32323232 1.0003397 0.33333334 0.9982908 0.34343433 0.9960246 0.35353535 0.9936288 0.36363637 0.9912111 0.37373737 0.9888966 0.3838384 0.98682356 0.3939394 0.9851383 0.4040404 0.9839887 0.41414142 0.9835162 0.42424244 0.98384774 0.43434343 0.98508644 0.44444445 0.987303 0.45454547 0.99052674 0.46464646 0.9947378 0.47474748 0.99986124 0.4848485 1.0057621 0.4949495 1.0122441 0.5050505 1.0190504 0.5151515 1.0258684 0.5252525 1.0323383 0.53535354 1.0380639 0.54545456 1.0426296 0.5555556 1.0456187 0.56565654 1.0466355 0.57575756 1.0453296 0.5858586 1.0414213 0.5959596 1.0347267 0.6060606 1.0251826 0.61616164 1.0128671 0.6262626 0.99801755 0.6363636 0.9810412 0.64646465 0.9625194 0.65656567 0.9432033 0.6666667 0.9239987 0.67676765 0.905942 0.68686867 0.8901639 0.6969697 0.87784463 0.7070707 0.87015796 0.7171717 0.8682082 0.72727275 0.87296134 0.7373737 0.8851723 0.74747473 0.90531397 0.75757575 0.9335094 0.7676768 0.9694723 0.7777778 1.012461 0.7878788 1.06125 0.7979798 1.1141208 0.8080808 1.1688808 0.8181818 1.2229073 0.82828283 1.273222 0.83838385 1.316596 0.8484849 1.3496838 0.85858583 1.3691826 0.86868685 1.3720154 0.8787879 1.3555263 0.8888889 1.3176868 0.8989899 1.2572964 0.90909094 1.1741706 0.9191919 1.0693046 0.9292929 0.944999 0.93939394 0.80492735 0.94949496 0.6541569 0.959596 0.49908257 0.969697 0.34728938 0.97979796 0.2073291 0.989899 0.0884071 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.15834787 1.08 1.3166958" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>ElasticInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 0.9999152 0.01010101 0.99975234 0.02020202 0.99956495 0.030303031 0.9993664 0.04040404 0.9991756 0.05050505 0.9990167 0.060606062 0.998918 0.07070707 0.9989103 0.08080808 0.99902374 0.09090909 0.9992847 0.1010101 0.9997112 0.11111111 1.0003084 0.121212125 1.0010635 0.13131313 1.0019419 0.14141414 1.0028839 0.15151516 1.0038029 0.16161616 1.0045874 0.17171717 1.0051047 0.18181819 1.0052096 0.1919192 1.0047572 0.2020202 1.0036185 0.21212122 1.001701 0.22222222 0.9989708 0.23232323 0.99547493 0.24242425 0.9913628 0.25252524 0.98690206 0.26262626 0.9824863 0.27272728 0.9786314 0.28282827 0.9759561 0.2929293 0.9751454 0.3030303 0.976894 0.3131313 0.98183054 0.32323232 0.9904251 0.33333334 1.0028844 0.34343433 1.0190431 0.35353535 1.0382628 0.36363637 1.0593514 0.37373737 1.0805187 0.3838384 1.0993878 0.3939394 1.1130737 0.4040404 1.1183479 0.41414142 1.1118927 0.42424244 1.09065 0.43434343 1.0522518 0.44444445 0.9955114 0.45454547 0.92094195 0.46464646 0.83124506 0.47474748 0.7317127 0.4848485 0.6304644 0.4949495 0.538439 0.5050505 0.46156138 0.5151515 0.36953568 0.5252525 0.26828736 0.53535354 0.16875494 0.54545456 0.07905805 0.5555556 0.0044882894 0.56565654 -0.052251697 0.57575756 -0.09064996 0.5858586 -0.1118927 0.5959596 -0.11834788 0.6060606 -0.11307371 0.61616164 -0.099387765 0.6262626 -0.08051884 0.6363636 -0.059351444 0.64646465 -0.038262963 0.65656567 -0.019043088 0.6666667 -0.0028842688 0.67676765 0.00957489 0.68686867 0.018169403 0.6969697 0.023105979 0.7070707 0.0248546 0.7171717 0.024043918 0.72727275 0.021368623 0.7373737 0.017513692 0.74747473 0.013097942 0.75757575 0.00863719 0.7676768 0.0045250654 0.7777778 0.0010291934 0.7878788 -0.0017009974 0.7979798 -0.0036184788 0.8080808 -0.004757166 0.8181818 -0.005209565 0.82828283 -0.005104661 0.83838385 -0.004587412 0.8484849 -0.0038028955 0.85858583 -0.0028839111 0.86868685 -0.0019419193 0.8787879 -0.0010634661 0.8888889 -0.00030827522 0.8989899 0.0002887845 0.90909094 0.00071531534 0.9191919 0.0009762645 0.9292929 0.0010896921 0.93939394 0.0010820031 0.94949496 0.0009832978 0.959596 0.00082439184 0.969697 0.0006335974 0.97979796 0.0004350543 0.989899 0.0002476573 1 0.00008481741" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.41201535 1.08 1.4520154" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>ElasticOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9115931 0.02020202 0.7926715 0.030303031 0.65271026 0.04040404 0.5009174 0.05050505 0.34584343 0.060606062 0.19507319 0.07070707 0.055001915 0.08080808 -0.069304705 0.09090909 -0.1741705 0.1010101 -0.2572962 0.11111111 -0.31768692 0.121212125 -0.35552645 0.13131313 -0.37201536 0.14141414 -0.3691826 0.15151516 -0.34968352 0.16161616 -0.3165959 0.17171717 -0.27322197 0.18181819 -0.22290742 0.1919192 -0.16888106 0.2020202 -0.11412096 0.21212122 -0.06124997 0.22222222 -0.012461066 0.23232323 0.03052771 0.24242425 0.06649059 0.25252524 0.09468591 0.26262626 0.11482775 0.27272728 0.12703872 0.28282827 0.13179177 0.2929293 0.12984204 0.3030303 0.12215537 0.3131313 0.1098361 0.32323232 0.09405804 0.33333334 0.07600123 0.34343433 0.05679673 0.35353535 0.037480593 0.36363637 0.018958926 0.37373737 0.0019825697 0.3838384 -0.012867093 0.3939394 -0.025182605 0.4040404 -0.03472674 0.41414142 -0.041421294 0.42424244 -0.04532957 0.43434343 -0.04663551 0.44444445 -0.045618653 0.45454547 -0.0426296 0.46464646 -0.038063884 0.47474748 -0.03233826 0.4848485 -0.025868416 0.4949495 -0.01905036 0.5050505 -0.012244105 0.5151515 -0.0057621 0.5252525 0.00013875961 0.53535354 0.005262196 0.54545456 0.009473264 0.5555556 0.012696981 0.56565654 0.014913559 0.57575756 0.016152263 0.5858586 0.016483784 0.5959596 0.016011298 0.6060606 0.014861703 0.61616164 0.013176441 0.6262626 0.011103451 0.6363636 0.008788884 0.64646465 0.0063712 0.65656567 0.0039753914 0.6666667 0.0017092228 0.67676765 -0.00033974648 0.68686867 -0.002105236 0.6969697 -0.0035429 0.7070707 -0.0046292543 0.7171717 -0.0053600073 0.72727275 -0.0057479143 0.7373737 -0.0058199167 0.74747473 -0.005613923 0.75757575 -0.005175829 0.7676768 -0.00455606 0.7777778 -0.0038070679 0.7878788 -0.0029803514 0.7979798 -0.002123952 0.8080808 -0.0012816191 0.8181818 -0.0004900694 0.82828283 0.00022059679 0.83838385 0.00082820654 0.8484849 0.0013182759 0.85858583 0.001683414 0.86868685 0.0019231439 0.8787879 0.00204283 0.8888889 0.0020526052 0.8989899 0.0019664168 0.90909094 0.0018007159 0.9191919 0.0015735626 0.9292929 0.001303494 0.93939394 0.0010085702 0.94949496 0.0007055998 0.959596 0.00040972233 0.969697 0.0001335144 0.97979796 -0.00011265278 0.989899 -0.00032150745 1 -0.00048828125" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>ExponentialIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99992913 0.02020202 0.9998531 0.030303031 0.99977154 0.04040404 0.99968404 0.05050505 0.9995903 0.060606062 0.99948967 0.07070707 0.9993817 0.08080808 0.999266 0.09090909 0.9991419 0.1010101 0.9990088 0.11111111 0.99886596 0.121212125 0.99871284 0.13131313 0.99854857 0.14141414 0.99837244 0.15151516 0.9981835 0.16161616 0.99798083 0.17171717 0.9977635 0.18181819 0.99753046 0.1919192 0.9972804 0.2020202 0.9970123 0.21212122 0.9967247 0.22222222 0.99641633 0.23232323 0.9960855 0.24242425 0.9957307 0.25252524 0.9953502 0.26262626 0.99494207 0.27272728 0.9945044 0.28282827 0.9940349 0.2929293 0.9935314 0.3030303 0.9929914 0.3131313 0.9924122 0.32323232 0.991791 0.33333334 0.99112475 0.34343433 0.9904102 0.35353535 0.9896438 0.36363637 0.98882186 0.37373737 0.98794025 0.3838384 0.98699474 0.3939394 0.9859807 0.4040404 0.984893 0.41414142 0.9837265 0.42424244 0.9824754 0.43434343 0.9811336 0.44444445 0.97969437 0.45454547 0.97815084 0.46464646 0.9764954 0.47474748 0.9747198 0.4848485 0.9728155 0.4949495 0.9707731 0.5050505 0.9685825 0.5151515 0.96623313 0.5252525 0.9637133 0.53535354 0.96101075 0.54545456 0.9581122 0.5555556 0.9550034 0.56565654 0.9516692 0.57575756 0.9480932 0.5858586 0.94425774 0.5959596 0.9401442 0.6060606 0.9357323 0.61616164 0.9310005 0.6262626 0.92592543 0.6363636 0.9204824 0.64646465 0.91464454 0.65656567 0.90838325 0.6666667 0.90166795 0.67676765 0.8944657 0.68686867 0.886741 0.6969697 0.87845606 0.7070707 0.86957026 0.7171717 0.86004007 0.72727275 0.8498187 0.7373737 0.8388561 0.74747473 0.82709837 0.75757575 0.81448793 0.7676768 0.8009629 0.7777778 0.78645706 0.7878788 0.7708991 0.7979798 0.7542129 0.8080808 0.73631656 0.8181818 0.7171222 0.82828283 0.6965358 0.83838385 0.6744564 0.8484849 0.6507757 0.85858583 0.6253778 0.86868685 0.59813774 0.8787879 0.56892204 0.8888889 0.5375875 0.8989899 0.5039808 0.90909094 0.46793646 0.9191919 0.42927808 0.9292929 0.38781637 0.93939394 0.34334725 0.94949496 0.2956531 0.959596 0.24449998 0.969697 0.18963695 0.97979796 0.13079566 0.989899 0.06768632 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>ExponentialInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9999265 0.02020202 0.99984205 0.030303031 0.99974483 0.04040404 0.999633 0.05050505 0.9995044 0.060606062 0.9993564 0.07070707 0.9991862 0.08080808 0.9989904 0.09090909 0.99876523 0.1010101 0.9985061 0.11111111 0.99820817 0.121212125 0.9978654 0.13131313 0.99747103 0.14141414 0.99701744 0.15151516 0.99649566 0.16161616 0.9958955 0.17171717 0.9952051 0.18181819 0.99441093 0.1919192 0.9934974 0.2020202 0.99244654 0.21212122 0.9912377 0.22222222 0.9898472 0.23232323 0.9882477 0.24242425 0.98640776 0.25252524 0.98429126 0.26262626 0.98185664 0.27272728 0.9790561 0.28282827 0.9758346 0.2929293 0.97212887 0.3030303 0.9678662 0.3131313 0.96296275 0.32323232 0.95732224 0.33333334 0.950834 0.34343433 0.94337046 0.35353535 0.9347851 0.36363637 0.92490935 0.37373737 0.9135492 0.3838384 0.90048146 0.3939394 0.8854495 0.4040404 0.8681583 0.41414142 0.8482679 0.42424244 0.82538784 0.43434343 0.79906887 0.44444445 0.76879376 0.45454547 0.73396826 0.46464646 0.6939082 0.47474748 0.64782655 0.4848485 0.5948185 0.4949495 0.53384316 0.5050505 0.4661572 0.5151515 0.40518153 0.5252525 0.35217345 0.53535354 0.3060918 0.54545456 0.26603174 0.5555556 0.23120606 0.56565654 0.20093113 0.57575756 0.17461216 0.5858586 0.15173209 0.5959596 0.13184172 0.6060606 0.11455047 0.61616164 0.09951854 0.6262626 0.086450815 0.6363636 0.07509065 0.64646465 0.06521487 0.65656567 0.05662954 0.6666667 0.049165964 0.67676765 0.04267776 0.68686867 0.037037313 0.6969697 0.032133818 0.7070707 0.027871132 0.7171717 0.024165392 0.72727275 0.02094388 0.7373737 0.018143356 0.74747473 0.015708745 0.75757575 0.013592243 0.7676768 0.011752307 0.7777778 0.010152817 0.7878788 0.0087623 0.7979798 0.007553458 0.8080808 0.0065026283 0.8181818 0.005589068 0.82828283 0.0047948956 0.83838385 0.004104495 0.8484849 0.0035042763 0.85858583 0.0029825568 0.86868685 0.0025289655 0.8787879 0.0021346211 0.8888889 0.0017918348 0.8989899 0.0014938712 0.90909094 0.0012347698 0.9191919 0.0010095835 0.9292929 0.0008137822 0.93939394 0.00064361095 0.94949496 0.0004956126 0.959596 0.0003669858 0.969697 0.00025516748 0.97979796 0.00015795231 0.989899 0.00007349253 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>ExponentialOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.93231386 0.02020202 0.86920464 0.030303031 0.8103629 0.04040404 0.7555 0.05050505 0.70434695 0.060606062 0.65665287 0.07070707 0.6121839 0.08080808 0.5707219 0.09090909 0.53206354 0.1010101 0.49601936 0.11111111 0.46241236 0.121212125 0.4310779 0.13131313 0.40186226 0.14141414 0.37462223 0.15151516 0.3492242 0.16161616 0.32554352 0.17171717 0.30346417 0.18181819 0.2828778 0.1919192 0.2636835 0.2020202 0.24578714 0.21212122 0.22910082 0.22222222 0.21354294 0.23232323 0.19903708 0.24242425 0.18551207 0.25252524 0.17290169 0.26262626 0.1611439 0.27272728 0.1501813 0.28282827 0.13995993 0.2929293 0.13042974 0.3030303 0.121543944 0.3131313 0.11325908 0.32323232 0.105534375 0.33333334 0.09833205 0.34343433 0.09161675 0.35353535 0.08535546 0.36363637 0.07951766 0.37373737 0.07407457 0.3838384 0.06899953 0.3939394 0.064267695 0.4040404 0.05985582 0.41414142 0.055742264 0.42424244 0.051906824 0.43434343 0.048330784 0.44444445 0.04499656 0.45454547 0.04188782 0.46464646 0.038989246 0.47474748 0.03628671 0.4848485 0.033766866 0.4949495 0.03141749 0.5050505 0.029226959 0.5151515 0.027184486 0.5252525 0.025280178 0.53535354 0.023504615 0.54545456 0.021849155 0.5555556 0.020305634 0.56565654 0.01886642 0.57575756 0.0175246 0.5858586 0.016273499 0.5959596 0.015106976 0.6060606 0.0140193105 0.61616164 0.013005257 0.6262626 0.012059748 0.6363636 0.011178136 0.64646465 0.010356188 0.65656567 0.009589791 0.6666667 0.008875251 0.67676765 0.00820899 0.68686867 0.0075877905 0.6969697 0.007008612 0.7070707 0.006468594 0.7171717 0.0059651136 0.72727275 0.005495608 0.7373737 0.005057931 0.74747473 0.004649818 0.75757575 0.004269302 0.7676768 0.0039144754 0.7777778 0.0035836697 0.7878788 0.0032752752 0.7979798 0.0029876828 0.8080808 0.0027195811 0.8181818 0.0024695396 0.82828283 0.0022364855 0.83838385 0.002019167 0.8484849 0.0018165112 0.85858583 0.0016275644 0.86868685 0.0014514327 0.8787879 0.0012871623 0.8888889 0.001134038 0.8989899 0.0009912252 0.90909094 0.00085812807 0.9191919 0.0007339716 0.9292929 0.000618279 0.93939394 0.00051033497 0.94949496 0.00040972233 0.959596 0.00031596422 0.969697 0.0002284646 0.97979796 0.00014692545 0.989899 0.00007086992 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>Linear</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.989899 0.02020202 0.97979796 0.030303031 0.969697 0.04040404 0.959596 0.05050505 0.94949496 0.060606062 0.93939394 0.07070707 0.9292929 0.08080808 0.9191919 0.09090909 0.9090909 0.1010101 0.8989899 0.11111111 0.8888889 0.121212125 0.8787879 0.13131313 0.86868685 0.14141414 0.85858583 0.15151516 0.8484849 0.16161616 0.83838385 0.17171717 0.82828283 0.18181819 0.8181818 0.1919192 0.8080808 0.2020202 0.79797983 0.21212122 0.78787875 0.22222222 0.7777778 0.23232323 0.7676768 0.24242425 0.75757575 0.25252524 0.7474748 0.26262626 0.7373737 0.27272728 0.72727275 0.28282827 0.7171717 0.2929293 0.7070707 0.3030303 0.6969697 0.3131313 0.68686867 0.32323232 0.6767677 0.33333334 0.6666666 0.34343433 0.65656567 0.35353535 0.64646465 0.36363637 0.6363636 0.37373737 0.62626266 0.3838384 0.6161616 0.3939394 0.6060606 0.4040404 0.5959596 0.41414142 0.5858586 0.42424244 0.57575756 0.43434343 0.56565654 0.44444445 0.5555556 0.45454547 0.5454545 0.46464646 0.53535354 0.47474748 0.5252525 0.4848485 0.5151515 0.4949495 0.50505054 0.5050505 0.49494952 0.5151515 0.4848485 0.5252525 0.47474748 0.53535354 0.46464646 0.54545456 0.45454544 0.5555556 0.44444442 0.56565654 0.43434346 0.57575756 0.42424244 0.5858586 0.41414142 0.5959596 0.4040404 0.6060606 0.39393938 0.61616164 0.38383836 0.6262626 0.3737374 0.6363636 0.36363637 0.64646465 0.35353535 0.65656567 0.34343433 0.6666667 0.3333333 0.67676765 0.32323235 0.68686867 0.31313133 0.6969697 0.3030303 0.7070707 0.2929293 0.7171717 0.28282827 0.72727275 0.27272725 0.7373737 0.2626263 0.74747473 0.25252527 0.75757575 0.24242425 0.7676768 0.23232323 0.7777778 0.22222221 0.7878788 0.21212119 0.7979798 0.20202023 0.8080808 0.19191921 0.8181818 0.18181819 0.82828283 0.17171717 0.83838385 0.16161615 0.8484849 0.15151513 0.85858583 0.14141417 0.86868685 0.13131315 0.8787879 0.121212125 0.8888889 0.111111104 0.8989899 0.101010084 0.90909094 0.090909064 0.9191919 0.0808081 0.9292929 0.07070708 0.93939394 0.060606062 0.94949496 0.050505042 0.959596 0.04040402 0.969697 0.030303001 0.97979796 0.02020204 0.989899 0.01010102 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuadraticIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99989796 0.02020202 0.9995919 0.030303031 0.99908173 0.04040404 0.9983675 0.05050505 0.9974492 0.060606062 0.9963269 0.07070707 0.9950005 0.08080808 0.9934701 0.09090909 0.9917355 0.1010101 0.98979694 0.11111111 0.9876543 0.121212125 0.98530763 0.13131313 0.98275685 0.14141414 0.98000205 0.15151516 0.97704315 0.16161616 0.97388023 0.17171717 0.9705132 0.18181819 0.96694213 0.1919192 0.963167 0.2020202 0.95918787 0.21212122 0.9550046 0.22222222 0.9506173 0.23232323 0.9460259 0.24242425 0.9412305 0.25252524 0.936231 0.26262626 0.9310275 0.27272728 0.92561984 0.28282827 0.9200082 0.2929293 0.91419244 0.3030303 0.9081726 0.3131313 0.9019488 0.32323232 0.89552087 0.33333334 0.8888889 0.34343433 0.88205284 0.35353535 0.87501276 0.36363637 0.8677686 0.37373737 0.8603204 0.3838384 0.8526681 0.3939394 0.84481174 0.4040404 0.83675134 0.41414142 0.8284869 0.42424244 0.82001835 0.43434343 0.8113458 0.44444445 0.80246913 0.45454547 0.7933884 0.46464646 0.78410363 0.47474748 0.7746148 0.4848485 0.7649219 0.4949495 0.755025 0.5050505 0.744924 0.5151515 0.7346189 0.5252525 0.72410977 0.53535354 0.71339655 0.54545456 0.70247936 0.5555556 0.691358 0.56565654 0.6800327 0.57575756 0.6685032 0.5858586 0.65676975 0.5959596 0.64483213 0.6060606 0.63269055 0.61616164 0.6203448 0.6262626 0.6077951 0.6363636 0.59504133 0.64646465 0.58208346 0.65656567 0.56892157 0.6666667 0.5555555 0.67676765 0.5419855 0.68686867 0.5282115 0.6969697 0.51423323 0.7070707 0.500051 0.7171717 0.48566473 0.72727275 0.47107434 0.7373737 0.45628 0.74747473 0.44128156 0.75757575 0.42607898 0.7676768 0.41067237 0.7777778 0.39506173 0.7878788 0.37924695 0.7979798 0.36322826 0.8080808 0.34700543 0.8181818 0.3305785 0.82828283 0.31394756 0.83838385 0.29711252 0.8484849 0.2800734 0.85858583 0.26283038 0.86868685 0.24538314 0.8787879 0.22773188 0.8888889 0.20987654 0.8989899 0.1918171 0.90909094 0.17355365 0.9191919 0.15508628 0.9292929 0.13641465 0.93939394 0.11753905 0.94949496 0.0984593 0.959596 0.07917553 0.969697 0.059687734 0.97979796 0.03999597 0.989899 0.020099998 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuadraticInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9997959 0.02020202 0.9991838 0.030303031 0.99816346 0.04040404 0.99673504 0.05050505 0.9948985 0.060606062 0.9926538 0.07070707 0.990001 0.08080808 0.9869401 0.09090909 0.9834711 0.1010101 0.97959393 0.11111111 0.97530866 0.121212125 0.97061527 0.13131313 0.9655137 0.14141414 0.9600041 0.15151516 0.9540863 0.16161616 0.94776046 0.17171717 0.94102645 0.18181819 0.93388426 0.1919192 0.926334 0.2020202 0.9183757 0.21212122 0.91000915 0.22222222 0.90123457 0.23232323 0.8920518 0.24242425 0.88246095 0.25252524 0.87246203 0.26262626 0.8620549 0.27272728 0.8512397 0.28282827 0.84001637 0.2929293 0.8283849 0.3030303 0.8163453 0.3131313 0.80389756 0.32323232 0.79104173 0.33333334 0.7777778 0.34343433 0.76410574 0.35353535 0.7500255 0.36363637 0.7355372 0.37373737 0.7206408 0.3838384 0.7053362 0.3939394 0.6896235 0.4040404 0.6735027 0.41414142 0.6569738 0.42424244 0.6400367 0.43434343 0.6226916 0.44444445 0.60493827 0.45454547 0.58677685 0.46464646 0.5682073 0.47474748 0.5492296 0.4848485 0.52984387 0.4949495 0.51005 0.5050505 0.48995006 0.5151515 0.47015613 0.5252525 0.45077038 0.53535354 0.43179268 0.54545456 0.41322315 0.5555556 0.39506167 0.56565654 0.3773085 0.57575756 0.3599633 0.5858586 0.34302622 0.5959596 0.32649732 0.6060606 0.31037647 0.61616164 0.2946638 0.6262626 0.27935928 0.6363636 0.26446283 0.64646465 0.24997449 0.65656567 0.23589426 0.6666667 0.22222221 0.67676765 0.20895833 0.68686867 0.19610244 0.6969697 0.18365473 0.7070707 0.17161512 0.7171717 0.15998363 0.72727275 0.14876032 0.7373737 0.13794512 0.74747473 0.12753803 0.75757575 0.11753905 0.7676768 0.107948184 0.7777778 0.09876543 0.7878788 0.089990795 0.7979798 0.08162433 0.8080808 0.07366598 0.8181818 0.06611574 0.82828283 0.05897355 0.83838385 0.052239537 0.8484849 0.045913696 0.85858583 0.03999591 0.86868685 0.034486294 0.8787879 0.029384732 0.8888889 0.024691343 0.8989899 0.020406067 0.90909094 0.016528904 0.9191919 0.013059914 0.9292929 0.009998977 0.93939394 0.007346213 0.94949496 0.005101502 0.959596 0.0032649636 0.969697 0.0018365383 0.97979796 0.000816226 0.989899 0.0002040863 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuadraticOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9799 0.02020202 0.96000403 0.030303031 0.94031227 0.04040404 0.92082447 0.05050505 0.9015407 0.060606062 0.88246095 0.07070707 0.86358535 0.08080808 0.8449137 0.09090909 0.82644624 0.1010101 0.8081829 0.11111111 0.79012346 0.121212125 0.7722681 0.13131313 0.75461686 0.14141414 0.7371696 0.15151516 0.7199266 0.16161616 0.7028875 0.17171717 0.68605244 0.18181819 0.6694215 0.1919192 0.6529946 0.2020202 0.6367718 0.21212122 0.62075293 0.22222222 0.60493827 0.23232323 0.58932763 0.24242425 0.573921 0.25252524 0.55871856 0.26262626 0.54372 0.27272728 0.52892566 0.28282827 0.5143353 0.2929293 0.49994898 0.3030303 0.48576677 0.3131313 0.47178853 0.32323232 0.4580145 0.33333334 0.44444442 0.34343433 0.43107843 0.35353535 0.41791654 0.36363637 0.40495867 0.37373737 0.39220488 0.3838384 0.37965512 0.3939394 0.36730945 0.4040404 0.35516787 0.41414142 0.34323025 0.42424244 0.33149678 0.43434343 0.31996733 0.44444445 0.30864203 0.45454547 0.29752064 0.46464646 0.28660345 0.47474748 0.27589023 0.4848485 0.2653811 0.4949495 0.25507605 0.5050505 0.24497503 0.5151515 0.2350781 0.5252525 0.22538519 0.53535354 0.21589637 0.54545456 0.20661157 0.5555556 0.19753087 0.56565654 0.18865424 0.57575756 0.17998165 0.5858586 0.17151308 0.5959596 0.16324866 0.6060606 0.1551882 0.61616164 0.1473319 0.6262626 0.13967967 0.6363636 0.13223141 0.64646465 0.124987245 0.65656567 0.11794716 0.6666667 0.111111104 0.67676765 0.104479134 0.68686867 0.09805125 0.6969697 0.09182739 0.7070707 0.08580756 0.7171717 0.07999182 0.72727275 0.07438016 0.7373737 0.06897259 0.74747473 0.06376898 0.75757575 0.058769524 0.7676768 0.053974092 0.7777778 0.049382687 0.7878788 0.044995427 0.7979798 0.040812194 0.8080808 0.03683299 0.8181818 0.03305787 0.82828283 0.029486775 0.83838385 0.026119769 0.8484849 0.022956848 0.85858583 0.019997954 0.86868685 0.017243147 0.8787879 0.014692366 0.8888889 0.012345672 0.8989899 0.0102030635 0.90909094 0.008264482 0.9191919 0.0065299273 0.9292929 0.0049995184 0.93939394 0.0036730766 0.94949496 0.0025507808 0.959596 0.0016325116 0.969697 0.00091826916 0.97979796 0.000408113 0.989899 0.00010204315 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuarticIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 1 0.02020202 0.9999998 0.030303031 0.99999917 0.04040404 0.9999973 0.05050505 0.9999935 0.060606062 0.9999865 0.07070707 0.999975 0.08080808 0.9999574 0.09090909 0.9999317 0.1010101 0.9998959 0.11111111 0.9998476 0.121212125 0.9997841 0.13131313 0.9997027 0.14141414 0.99960005 0.15151516 0.999473 0.16161616 0.99931777 0.17171717 0.99913055 0.18181819 0.99890715 0.1919192 0.99864334 0.2020202 0.99833435 0.21212122 0.9979754 0.22222222 0.99756134 0.23232323 0.9970868 0.24242425 0.99654615 0.25252524 0.99593353 0.26262626 0.9952428 0.27272728 0.9944676 0.28282827 0.9936013 0.2929293 0.99263704 0.3030303 0.99156773 0.3131313 0.99038595 0.32323232 0.9890841 0.33333334 0.9876543 0.34343433 0.98608845 0.35353535 0.9843782 0.36363637 0.98251486 0.37373737 0.9804896 0.3838384 0.9782933 0.3939394 0.9759166 0.4040404 0.97334987 0.41414142 0.97058326 0.42424244 0.9676066 0.43434343 0.9644096 0.44444445 0.96098155 0.45454547 0.95731163 0.46464646 0.95338875 0.47474748 0.9492015 0.4848485 0.9447383 0.4949495 0.93998724 0.5050505 0.9349362 0.5151515 0.9295729 0.5252525 0.9238846 0.53535354 0.9178585 0.54545456 0.91148144 0.5555556 0.9047401 0.56565654 0.8976209 0.57575756 0.8901099 0.5858586 0.88219297 0.5959596 0.8738558 0.6060606 0.86508375 0.61616164 0.85586196 0.6262626 0.8461754 0.6363636 0.8360085 0.64646465 0.82534575 0.65656567 0.8141714 0.6666667 0.80246913 0.67676765 0.79022276 0.68686867 0.7774156 0.6969697 0.7640307 0.7070707 0.750051 0.7171717 0.7354592 0.72727275 0.7202377 0.7373737 0.7043686 0.74747473 0.68783367 0.75757575 0.67061466 0.7676768 0.6526929 0.7777778 0.63404965 0.7878788 0.6146657 0.7979798 0.59452176 0.8080808 0.57359815 0.8181818 0.5518749 0.82828283 0.52933204 0.83838385 0.5059492 0.8484849 0.48170573 0.85858583 0.45658094 0.86868685 0.43055338 0.8787879 0.40360194 0.8888889 0.37570494 0.8989899 0.34684044 0.90909094 0.31698644 0.9191919 0.28612077 0.9292929 0.25422037 0.93939394 0.22126263 0.94949496 0.18722439 0.959596 0.15208232 0.969697 0.11581284 0.97979796 0.07839227 0.989899 0.039795995 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuarticInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99999994 0.02020202 0.9999987 0.030303031 0.99999326 0.04040404 0.99997866 0.05050505 0.99994797 0.060606062 0.99989206 0.07070707 0.9998 0.08080808 0.9996589 0.09090909 0.9994536 0.1010101 0.9991672 0.11111111 0.99878067 0.121212125 0.9982731 0.13131313 0.9976214 0.14141414 0.99680066 0.15151516 0.99578387 0.16161616 0.99454206 0.17171717 0.99304426 0.18181819 0.9912574 0.1919192 0.98914665 0.2020202 0.98667496 0.21212122 0.98380333 0.22222222 0.9804908 0.23232323 0.9766944 0.24242425 0.97236913 0.25252524 0.96746814 0.26262626 0.9619423 0.27272728 0.95574075 0.28282827 0.94881046 0.2929293 0.9410965 0.3030303 0.93254185 0.3131313 0.92308766 0.32323232 0.9126729 0.33333334 0.90123457 0.34343433 0.88870776 0.35353535 0.8750255 0.36363637 0.86011887 0.37373737 0.84391683 0.3838384 0.82634646 0.3939394 0.8073329 0.4040404 0.7867991 0.41414142 0.764666 0.42424244 0.74085283 0.43434343 0.7152767 0.44444445 0.6878525 0.45454547 0.6584932 0.46464646 0.6271102 0.47474748 0.5936122 0.4848485 0.5579064 0.4949495 0.519898 0.5050505 0.48010212 0.5151515 0.4420936 0.5252525 0.4063878 0.53535354 0.37288982 0.54545456 0.34150672 0.5555556 0.3121475 0.56565654 0.2847234 0.57575756 0.25914717 0.5858586 0.23533398 0.5959596 0.21320093 0.6060606 0.19266713 0.61616164 0.17365348 0.6262626 0.15608323 0.6363636 0.13988113 0.64646465 0.12497449 0.65656567 0.11129224 0.6666667 0.09876543 0.67676765 0.08732712 0.68686867 0.07691234 0.6969697 0.06745815 0.7070707 0.058903515 0.7171717 0.05118954 0.72727275 0.04425925 0.7373737 0.038057745 0.74747473 0.032531917 0.75757575 0.027630866 0.7676768 0.023305595 0.7777778 0.019509196 0.7878788 0.016196668 0.7979798 0.013325095 0.8080808 0.01085335 0.8181818 0.008742571 0.82828283 0.006955743 0.83838385 0.0054579377 0.8484849 0.0042161345 0.85858583 0.003199339 0.86868685 0.002378583 0.8787879 0.0017269254 0.8888889 0.0012193322 0.8989899 0.0008327961 0.90909094 0.0005463958 0.9191919 0.00034111738 0.9292929 0.00019997358 0.93939394 0.00010794401 0.94949496 0.000052034855 0.959596 0.000021338463 0.969697 0.000006735325 0.97979796 0.0000013113022 0.989899 0.000000059604645 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuarticOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.960204 0.02020202 0.92160773 0.030303031 0.88418716 0.04040404 0.8479177 0.05050505 0.8127756 0.060606062 0.77873737 0.07070707 0.74577963 0.08080808 0.7138792 0.09090909 0.6830134 0.1010101 0.65315956 0.11111111 0.62429506 0.121212125 0.59639806 0.13131313 0.5694466 0.14141414 0.54341906 0.15151516 0.5182943 0.16161616 0.4940508 0.17171717 0.47066796 0.18181819 0.44812512 0.1919192 0.42640185 0.2020202 0.4054783 0.21212122 0.3853342 0.22222222 0.36595035 0.23232323 0.3473071 0.24242425 0.32938534 0.25252524 0.31216645 0.26262626 0.2956314 0.27272728 0.27976233 0.28282827 0.2645408 0.2929293 0.24994898 0.3030303 0.2359693 0.3131313 0.22258443 0.32323232 0.2097773 0.33333334 0.1975308 0.34343433 0.18582863 0.35353535 0.17465425 0.36363637 0.16399151 0.37373737 0.15382469 0.3838384 0.14413798 0.3939394 0.13491625 0.4040404 0.12614417 0.41414142 0.11780703 0.42424244 0.1098901 0.43434343 0.10237908 0.44444445 0.095259905 0.45454547 0.0885185 0.46464646 0.08214152 0.47474748 0.07611543 0.4848485 0.07042712 0.4949495 0.065063775 0.5050505 0.060012758 0.5151515 0.05526167 0.5252525 0.050798476 0.53535354 0.04661125 0.54545456 0.04268831 0.5555556 0.039018452 0.56565654 0.03559041 0.57575756 0.032393396 0.5858586 0.02941674 0.5959596 0.02665013 0.6060606 0.024083376 0.61616164 0.0217067 0.6262626 0.019510388 0.6363636 0.017485142 0.64646465 0.015621781 0.65656567 0.013911545 0.6666667 0.012345672 0.67676765 0.010915875 0.68686867 0.00961405 0.6969697 0.008432269 0.7070707 0.007362962 0.7171717 0.006398678 0.72727275 0.005532384 0.7373737 0.0047572255 0.74747473 0.0040664673 0.75757575 0.0034538507 0.7676768 0.002913177 0.7777778 0.0024386644 0.7878788 0.002024591 0.7979798 0.0016656518 0.8080808 0.0013566613 0.8181818 0.0010928512 0.82828283 0.00086945295 0.83838385 0.00068223476 0.8484849 0.00052702427 0.85858583 0.00039994717 0.86868685 0.00029730797 0.8787879 0.00021588802 0.8888889 0.00015240908 0.8989899 0.000104129314 0.90909094 0.00006830692 0.9191919 0.00004261732 0.9292929 0.000024974346 0.93939394 0.00001347065 0.94949496 0.0000064969063 0.959596 0.000002682209 0.969697 0.000000834465 0.97979796 0.00000017881393 0.989899 0 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuinticIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 1 0.02020202 1 0.030303031 1 0.04040404 0.9999999 0.05050505 0.99999964 0.060606062 0.99999917 0.07070707 0.9999982 0.08080808 0.99999654 0.09090909 0.9999938 0.1010101 0.9999895 0.11111111 0.9999831 0.121212125 0.99997383 0.13131313 0.99996096 0.14141414 0.99994344 0.15151516 0.9999201 0.16161616 0.99988973 0.17171717 0.9998507 0.18181819 0.9998013 0.1919192 0.99973965 0.2020202 0.99966353 0.21212122 0.99957055 0.22222222 0.9994581 0.23232323 0.9993232 0.24242425 0.9991627 0.25252524 0.99897313 0.26262626 0.9987506 0.27272728 0.99849117 0.28282827 0.9981903 0.2929293 0.9978432 0.3030303 0.99744475 0.3131313 0.99698955 0.32323232 0.99647164 0.33333334 0.9958848 0.34343433 0.99522233 0.35353535 0.99447715 0.36363637 0.9936418 0.37373737 0.9927082 0.3838384 0.99166816 0.3939394 0.9905126 0.4040404 0.9892323 0.41414142 0.9878173 0.42424244 0.9862574 0.43434343 0.98454154 0.44444445 0.98265845 0.45454547 0.9805962 0.46464646 0.97834224 0.47474748 0.97588354 0.4848485 0.97320646 0.4949495 0.97029674 0.5050505 0.96713954 0.5151515 0.96371937 0.5252525 0.9600202 0.53535354 0.95602524 0.54545456 0.95171714 0.5555556 0.9470779 0.56565654 0.9420886 0.57575756 0.9367299 0.5858586 0.93098176 0.5959596 0.92482316 0.6060606 0.91823256 0.61616164 0.91118765 0.6262626 0.90366536 0.6363636 0.89564174 0.64646465 0.88709223 0.65656567 0.8779913 0.6666667 0.8683127 0.67676765 0.85802954 0.68686867 0.8471137 0.6969697 0.83553654 0.7070707 0.8232684 0.7171717 0.81027883 0.72727275 0.7965365 0.7373737 0.7820091 0.74747473 0.76666355 0.75757575 0.75046563 0.7676768 0.73338044 0.7777778 0.71537197 0.7878788 0.69640326 0.7979798 0.67643654 0.8080808 0.6554328 0.8181818 0.63335216 0.82828283 0.6101538 0.83838385 0.58579576 0.8484849 0.56023514 0.85858583 0.5334281 0.86868685 0.5053292 0.8787879 0.4758926 0.8888889 0.44507104 0.8989899 0.41281617 0.90909094 0.37907857 0.9191919 0.343808 0.9292929 0.3069523 0.93939394 0.26845884 0.94949496 0.22827363 0.959596 0.18634158 0.969697 0.14260638 0.97979796 0.09701061 0.989899 0.04949504 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuinticInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 1 0.02020202 0.99999994 0.030303031 0.9999996 0.04040404 0.9999983 0.05050505 0.99999475 0.060606062 0.99998695 0.07070707 0.99997175 0.08080808 0.99994487 0.09090909 0.99990064 0.1010101 0.99983174 0.11111111 0.99972904 0.121212125 0.99958134 0.13131313 0.99937534 0.14141414 0.99909514 0.15151516 0.9987224 0.16161616 0.9982358 0.17171717 0.99761117 0.18181819 0.99682087 0.1919192 0.99583405 0.2020202 0.99461615 0.21212122 0.99312866 0.22222222 0.99132925 0.23232323 0.98917115 0.24242425 0.9866032 0.25252524 0.98356974 0.26262626 0.9800101 0.27272728 0.97585857 0.28282827 0.9710443 0.2929293 0.9654909 0.3030303 0.9591163 0.3131313 0.9518327 0.32323232 0.9435461 0.33333334 0.93415636 0.34343433 0.92355686 0.35353535 0.9116342 0.36363637 0.8982682 0.37373737 0.8833318 0.3838384 0.8666902 0.3939394 0.84820163 0.4040404 0.8277164 0.41414142 0.8050769 0.42424244 0.7801176 0.43434343 0.75266457 0.44444445 0.7225355 0.45454547 0.6895393 0.46464646 0.6534761 0.47474748 0.6141368 0.4848485 0.5713032 0.4949495 0.5247475 0.5050505 0.47525263 0.5151515 0.4286968 0.5252525 0.38586318 0.53535354 0.34652388 0.54545456 0.31046063 0.5555556 0.2774644 0.56565654 0.24733543 0.57575756 0.21988243 0.5858586 0.1949231 0.5959596 0.17228359 0.6060606 0.15179831 0.61616164 0.13330972 0.6262626 0.116668284 0.6363636 0.10173178 0.64646465 0.08836579 0.65656567 0.076443136 0.6666667 0.06584358 0.67676765 0.056453943 0.68686867 0.048167348 0.6969697 0.04088372 0.7070707 0.034509122 0.7171717 0.028955698 0.72727275 0.02414143 0.7373737 0.019989908 0.74747473 0.016430259 0.75757575 0.0133968 0.7676768 0.010828853 0.7777778 0.008670747 0.7878788 0.0068713427 0.7979798 0.005383849 0.8080808 0.0041659474 0.8181818 0.003179133 0.82828283 0.002388835 0.83838385 0.0017641783 0.8484849 0.0012776256 0.85858583 0.0009048581 0.86868685 0.0006246567 0.8787879 0.00041866302 0.8888889 0.00027096272 0.8989899 0.00016826391 0.90909094 0.00009936094 0.9191919 0.000055134296 0.9292929 0.000028252602 0.93939394 0.000013053417 0.94949496 0.0000052452087 0.959596 0.0000017285347 0.969697 0.0000004172325 0.97979796 0.000000059604645 0.989899 0 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>QuinticOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.95050496 0.02020202 0.9029894 0.030303031 0.8573936 0.04040404 0.8136584 0.05050505 0.77172637 0.060606062 0.73154116 0.07070707 0.6930477 0.08080808 0.656192 0.09090909 0.62092125 0.1010101 0.58718383 0.11111111 0.55492896 0.121212125 0.5241074 0.13131313 0.4946708 0.14141414 0.46657193 0.15151516 0.43976486 0.16161616 0.41420424 0.17171717 0.3898462 0.18181819 0.36664784 0.1919192 0.34456718 0.2020202 0.32356352 0.21212122 0.30359662 0.22222222 0.28462803 0.23232323 0.26661956 0.24242425 0.24953437 0.25252524 0.23333657 0.26262626 0.21799088 0.27272728 0.2034635 0.28282827 0.18972117 0.2929293 0.17673159 0.3030303 0.16446346 0.3131313 0.15288627 0.32323232 0.14197052 0.33333334 0.13168722 0.34343433 0.12200868 0.35353535 0.11290777 0.36363637 0.104358256 0.37373737 0.096334696 0.3838384 0.08881229 0.3939394 0.08176744 0.4040404 0.075176835 0.41414142 0.069018245 0.42424244 0.06327009 0.43434343 0.057911396 0.44444445 0.05292213 0.45454547 0.048282802 0.46464646 0.043974757 0.47474748 0.039979815 0.4848485 0.036280632 0.4949495 0.032860518 0.5050505 0.02970326 0.5151515 0.02679354 0.5252525 0.024116457 0.53535354 0.021657765 0.54545456 0.019403815 0.5555556 0.017341495 0.56565654 0.015458465 0.57575756 0.013742626 0.5858586 0.012182713 0.5959596 0.010767698 0.6060606 0.0094873905 0.61616164 0.008331835 0.6262626 0.007291794 0.6363636 0.0063582063 0.64646465 0.005522847 0.65656567 0.00477767 0.6666667 0.004115224 0.67676765 0.0035283566 0.68686867 0.0030104518 0.6969697 0.0025552511 0.7070707 0.002156794 0.7171717 0.0018097162 0.72727275 0.001508832 0.7373737 0.001249373 0.74747473 0.0010268688 0.75757575 0.00083732605 0.7676768 0.00067681074 0.7777778 0.00054192543 0.7878788 0.00042945147 0.7979798 0.00033646822 0.8080808 0.0002603531 0.8181818 0.00019872189 0.82828283 0.00014930964 0.83838385 0.00011026859 0.8484849 0.000079870224 0.85858583 0.000056564808 0.86868685 0.000039041042 0.8787879 0.000026166439 0.8888889 0.00001692772 0.8989899 0.0000104904175 0.90909094 0.000006198883 0.9191919 0.0000034570694 0.9292929 0.0000017881393 0.93939394 0.000000834465 0.94949496 0.00000035762787 0.959596 0.00000011920929 0.969697 0 0.97979796 0 0.989899 0 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,3 @@
# EaseFunction
These graphs are auto-generated via `tools/build-easefunction-graphs`.

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SineIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9998741 0.02020202 0.9994965 0.030303031 0.99886733 0.04040404 0.9979867 0.05050505 0.9968548 0.060606062 0.9954719 0.07070707 0.9938385 0.08080808 0.9919548 0.09090909 0.98982143 0.1010101 0.9874389 0.11111111 0.9848077 0.121212125 0.9819287 0.13131313 0.97880244 0.14141414 0.9754298 0.15151516 0.9718116 0.16161616 0.9679487 0.17171717 0.96384215 0.18181819 0.959493 0.1919192 0.95490223 0.2020202 0.9500711 0.21212122 0.9450008 0.22222222 0.9396926 0.23232323 0.93414783 0.24242425 0.9283679 0.25252524 0.9223543 0.26262626 0.9161084 0.27272728 0.90963197 0.28282827 0.90292656 0.2929293 0.89599377 0.3030303 0.88883543 0.3131313 0.88145334 0.32323232 0.8738494 0.33333334 0.8660254 0.34343433 0.8579834 0.35353535 0.8497254 0.36363637 0.8412535 0.37373737 0.83256984 0.3838384 0.8236766 0.3939394 0.8145759 0.4040404 0.80527025 0.41414142 0.7957618 0.42424244 0.78605306 0.43434343 0.7761465 0.44444445 0.76604444 0.45454547 0.7557495 0.46464646 0.7452645 0.47474748 0.7345917 0.4848485 0.72373396 0.4949495 0.71269417 0.5050505 0.7014749 0.5151515 0.69007903 0.5252525 0.67850935 0.53535354 0.66676897 0.54545456 0.6548607 0.5555556 0.6427876 0.56565654 0.63055265 0.57575756 0.618159 0.5858586 0.60560966 0.5959596 0.5929079 0.6060606 0.58005685 0.61616164 0.5670598 0.6262626 0.5539201 0.6363636 0.54064083 0.64646465 0.52722543 0.65656567 0.51367736 0.6666667 0.5 0.67676765 0.4861967 0.68686867 0.47227103 0.6969697 0.45822644 0.7070707 0.44406652 0.7171717 0.42979485 0.72727275 0.41541493 0.7373737 0.40093058 0.74747473 0.38634515 0.75757575 0.3716625 0.7676768 0.35688627 0.7777778 0.34202003 0.7878788 0.32706785 0.7979798 0.3120334 0.8080808 0.29692036 0.8181818 0.28173256 0.82828283 0.26647377 0.83838385 0.251148 0.8484849 0.2357589 0.85858583 0.22031045 0.86868685 0.20480663 0.8787879 0.18925118 0.8888889 0.17364812 0.8989899 0.1580013 0.90909094 0.14231473 0.9191919 0.12659246 0.9292929 0.110838234 0.93939394 0.09505606 0.94949496 0.07924998 0.959596 0.06342393 0.969697 0.047581792 0.97979796 0.03172791 0.989899 0.015865922 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SineInOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99974823 0.02020202 0.99899334 0.030303031 0.997736 0.04040404 0.9959774 0.05050505 0.99371946 0.060606062 0.99096435 0.07070707 0.9877149 0.08080808 0.98397434 0.09090909 0.97974646 0.1010101 0.97503555 0.11111111 0.9698463 0.121212125 0.9641839 0.13131313 0.9580542 0.14141414 0.9514633 0.15151516 0.9444177 0.16161616 0.9369247 0.17171717 0.9289917 0.18181819 0.92062676 0.1919192 0.9118383 0.2020202 0.9026351 0.21212122 0.89302653 0.22222222 0.8830222 0.23232323 0.87263227 0.24242425 0.86186695 0.25252524 0.85073745 0.26262626 0.8392547 0.27272728 0.82743037 0.28282827 0.8152763 0.2929293 0.8028048 0.3030303 0.79002845 0.3131313 0.77696 0.32323232 0.76361275 0.33333334 0.75 0.34343433 0.7361355 0.35353535 0.72203326 0.36363637 0.70770746 0.37373737 0.6931726 0.3838384 0.67844313 0.3939394 0.6635339 0.4040404 0.64846015 0.41414142 0.6332369 0.42424244 0.61787945 0.43434343 0.6024033 0.44444445 0.58682406 0.45454547 0.57115734 0.46464646 0.5554191 0.47474748 0.539625 0.4848485 0.5237909 0.4949495 0.50793296 0.5050505 0.49206704 0.5151515 0.47620904 0.5252525 0.46037495 0.53535354 0.44458085 0.54545456 0.42884254 0.5555556 0.41317582 0.56565654 0.39759666 0.57575756 0.3821205 0.5858586 0.36676306 0.5959596 0.3515398 0.6060606 0.33646595 0.61616164 0.3215568 0.6262626 0.30682743 0.6363636 0.29229248 0.64646465 0.27796668 0.65656567 0.26386446 0.6666667 0.25 0.67676765 0.23638725 0.68686867 0.22303993 0.6969697 0.20997155 0.7070707 0.19719511 0.7171717 0.18472362 0.72727275 0.17256957 0.7373737 0.16074532 0.74747473 0.14926255 0.75757575 0.13813299 0.7676768 0.1273678 0.7777778 0.11697769 0.7878788 0.10697341 0.7979798 0.0973649 0.8080808 0.08816171 0.8181818 0.07937324 0.82828283 0.071008265 0.83838385 0.063075304 0.8484849 0.055582285 0.85858583 0.048536718 0.86868685 0.041945755 0.8787879 0.035816014 0.8888889 0.030153632 0.8989899 0.024964452 0.90909094 0.02025348 0.9191919 0.016025662 0.9292929 0.012285113 0.93939394 0.009035647 0.94949496 0.0062805414 0.959596 0.0040225983 0.969697 0.0022640228 0.97979796 0.0010066628 0.989899 0.00025177002 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SineOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.984134 0.02020202 0.9682721 0.030303031 0.9524181 0.04040404 0.93657607 0.05050505 0.92075 0.060606062 0.90494394 0.07070707 0.8891618 0.08080808 0.87340754 0.09090909 0.85768515 0.1010101 0.8419986 0.11111111 0.8263518 0.121212125 0.81074876 0.13131313 0.7951933 0.14141414 0.77968943 0.15151516 0.76424104 0.16161616 0.748852 0.17171717 0.7335262 0.18181819 0.71826744 0.1919192 0.70307964 0.2020202 0.6879666 0.21212122 0.672932 0.22222222 0.65797985 0.23232323 0.6431138 0.24242425 0.6283375 0.25252524 0.61365485 0.26262626 0.5990695 0.27272728 0.58458495 0.28282827 0.5702051 0.2929293 0.55593336 0.3030303 0.54177344 0.3131313 0.5277289 0.32323232 0.51380324 0.33333334 0.5 0.34343433 0.48632258 0.35353535 0.4727745 0.36363637 0.45935917 0.37373737 0.44607997 0.3838384 0.43294013 0.3939394 0.41994303 0.4040404 0.40709203 0.41414142 0.39439029 0.42424244 0.381841 0.43434343 0.3694473 0.44444445 0.35721236 0.45454547 0.3451392 0.46464646 0.33323097 0.47474748 0.3214906 0.4848485 0.30992097 0.4949495 0.2985251 0.5050505 0.28730583 0.5151515 0.27626598 0.5252525 0.26540828 0.53535354 0.25473553 0.54545456 0.24425042 0.5555556 0.2339555 0.56565654 0.22385353 0.57575756 0.21394688 0.5858586 0.20423812 0.5959596 0.19472975 0.6060606 0.18542403 0.61616164 0.17632341 0.6262626 0.16743016 0.6363636 0.15874648 0.64646465 0.15027457 0.65656567 0.14201659 0.6666667 0.13397455 0.67676765 0.12615061 0.68686867 0.118546605 0.6969697 0.11116451 0.7070707 0.10400617 0.7171717 0.097073436 0.72727275 0.09036797 0.7373737 0.08389157 0.74747473 0.07764572 0.75757575 0.07163209 0.7676768 0.065852165 0.7777778 0.060307324 0.7878788 0.054999113 0.7979798 0.049928904 0.8080808 0.04509777 0.8181818 0.04050702 0.82828283 0.036157846 0.83838385 0.032051265 0.8484849 0.028188407 0.85858583 0.024570227 0.86868685 0.021197557 0.8787879 0.018071294 0.8888889 0.015192211 0.8989899 0.012561083 0.90909094 0.010178566 0.9191919 0.0080451965 0.9292929 0.006161511 0.93939394 0.0045281053 0.94949496 0.003145218 0.959596 0.0020133257 0.969697 0.0011326671 0.97979796 0.00050348043 0.989899 0.00012588501 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SmoothStep</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99969596 0.02020202 0.9987921 0.030303031 0.9973008 0.04040404 0.99523443 0.05050505 0.9926054 0.060606062 0.98942596 0.07070707 0.98570853 0.08080808 0.9814655 0.09090909 0.97670925 0.1010101 0.9714521 0.11111111 0.96570647 0.121212125 0.95948464 0.13131313 0.9527991 0.14141414 0.94566214 0.15151516 0.9380861 0.16161616 0.9300834 0.17171717 0.92166644 0.18181819 0.91284746 0.1919192 0.90363896 0.2020202 0.8940533 0.21212122 0.8841027 0.22222222 0.87379974 0.23232323 0.8631566 0.24242425 0.8521858 0.25252524 0.8408996 0.26262626 0.82931036 0.27272728 0.8174305 0.28282827 0.8052724 0.2929293 0.7928484 0.3030303 0.78017086 0.3131313 0.7672522 0.32323232 0.7541047 0.33333334 0.7407407 0.34343433 0.72717273 0.35353535 0.7134131 0.36363637 0.6994741 0.37373737 0.6853681 0.3838384 0.67110753 0.3939394 0.6567048 0.4040404 0.64217216 0.41414142 0.627522 0.42424244 0.6127668 0.43434343 0.5979188 0.44444445 0.5829904 0.45454547 0.567994 0.46464646 0.5529419 0.47474748 0.53784657 0.4848485 0.52272034 0.4949495 0.5075755 0.5050505 0.4924245 0.5151515 0.47727972 0.5252525 0.46215343 0.53535354 0.44705802 0.54545456 0.432006 0.5555556 0.4170096 0.56565654 0.40208125 0.57575756 0.3872332 0.5858586 0.372478 0.5959596 0.35782784 0.6060606 0.34329516 0.61616164 0.32889235 0.6262626 0.31463194 0.6363636 0.30052596 0.64646465 0.28658694 0.65656567 0.27282727 0.6666667 0.25925922 0.67676765 0.24589539 0.68686867 0.23274791 0.6969697 0.21982914 0.7070707 0.20715159 0.7171717 0.1947276 0.72727275 0.1825695 0.7373737 0.1706897 0.74747473 0.15910047 0.75757575 0.14781427 0.7676768 0.13684332 0.7777778 0.1262002 0.7878788 0.11589724 0.7979798 0.10594672 0.8080808 0.09636104 0.8181818 0.08715248 0.82828283 0.07833356 0.83838385 0.069916606 0.8484849 0.061913908 0.85858583 0.05433786 0.86868685 0.04720086 0.8787879 0.040515304 0.8888889 0.034293592 0.8989899 0.028547943 0.90909094 0.023290753 0.9191919 0.018534541 0.9292929 0.014291525 0.93939394 0.010574102 0.94949496 0.0073946714 0.959596 0.0047655106 0.969697 0.0026991367 0.97979796 0.0012078881 0.989899 0.0003039837 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SmoothStepIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9998475 0.02020202 0.9993919 0.030303031 0.9986365 0.04040404 0.9975842 0.05050505 0.9962383 0.060606062 0.99460167 0.07070707 0.9926775 0.08080808 0.9904689 0.09090909 0.98797894 0.1010101 0.9852107 0.11111111 0.98216736 0.121212125 0.97885185 0.13131313 0.9752674 0.14141414 0.97141707 0.15151516 0.9673039 0.16161616 0.96293104 0.17171717 0.95830154 0.18181819 0.9534185 0.1919192 0.948285 0.2020202 0.9429042 0.21212122 0.9372791 0.22222222 0.9314129 0.23232323 0.9253086 0.24242425 0.9189693 0.25252524 0.91239816 0.26262626 0.90559816 0.27272728 0.8985725 0.28282827 0.8913242 0.2929293 0.8838564 0.3030303 0.8761722 0.3131313 0.8682746 0.32323232 0.8601668 0.33333334 0.8518518 0.34343433 0.8433328 0.35353535 0.83461285 0.36363637 0.825695 0.37373737 0.8165823 0.3838384 0.8072779 0.3939394 0.79778504 0.4040404 0.78810656 0.41414142 0.7782457 0.42424244 0.76820546 0.43434343 0.75798905 0.44444445 0.7475995 0.45454547 0.7370398 0.46464646 0.72631323 0.47474748 0.71542275 0.4848485 0.7043716 0.4949495 0.6931627 0.5050505 0.6817992 0.5151515 0.67028415 0.5252525 0.6586207 0.53535354 0.64681196 0.54545456 0.634861 0.5555556 0.6227709 0.56565654 0.6105448 0.57575756 0.5981857 0.5858586 0.5856968 0.5959596 0.57308114 0.6060606 0.5603417 0.61616164 0.5474817 0.6262626 0.53450435 0.6363636 0.5214125 0.64646465 0.50820935 0.65656567 0.49489796 0.6666667 0.48148143 0.67676765 0.46796298 0.68686867 0.45434552 0.6969697 0.44063228 0.7070707 0.42682618 0.7171717 0.41293043 0.72727275 0.39894813 0.7373737 0.3848825 0.74747473 0.37073624 0.75757575 0.35651278 0.7676768 0.34221512 0.7777778 0.3278463 0.7878788 0.3134095 0.7979798 0.29890794 0.8080808 0.28434432 0.8181818 0.26972198 0.82828283 0.25504404 0.83838385 0.24031359 0.8484849 0.2255336 0.85858583 0.21070725 0.86868685 0.19583762 0.8787879 0.18092775 0.8888889 0.16598076 0.8989899 0.15099978 0.90909094 0.13598794 0.9191919 0.120948255 0.9292929 0.1058839 0.93939394 0.09079778 0.94949496 0.07569307 0.959596 0.06057298 0.969697 0.045440614 0.97979796 0.030298889 0.989899 0.015150964 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SmoothStepOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.984849 0.02020202 0.9697011 0.030303031 0.9545594 0.04040404 0.9394269 0.05050505 0.92430687 0.060606062 0.9092022 0.07070707 0.89411616 0.08080808 0.87905174 0.09090909 0.864012 0.1010101 0.84900016 0.11111111 0.8340192 0.121212125 0.81907225 0.13131313 0.80416244 0.14141414 0.7892928 0.15151516 0.7744664 0.16161616 0.75968647 0.17171717 0.74495596 0.18181819 0.730278 0.1919192 0.7156557 0.2020202 0.7010921 0.21212122 0.68659043 0.22222222 0.6721536 0.23232323 0.6577849 0.24242425 0.6434872 0.25252524 0.62926376 0.26262626 0.6151176 0.27272728 0.6010518 0.28282827 0.5870696 0.2929293 0.5731739 0.3030303 0.5593678 0.3131313 0.54565454 0.32323232 0.532037 0.33333334 0.5185185 0.34343433 0.50510204 0.35353535 0.49179065 0.36363637 0.4785875 0.37373737 0.4654957 0.3838384 0.45251822 0.3939394 0.43965828 0.4040404 0.42691892 0.41414142 0.41430318 0.42424244 0.40181428 0.43434343 0.3894552 0.44444445 0.37722903 0.45454547 0.365139 0.46464646 0.35318804 0.47474748 0.34137928 0.4848485 0.3297159 0.4949495 0.3182009 0.5050505 0.30683738 0.5151515 0.2956285 0.5252525 0.2845772 0.53535354 0.27368677 0.54545456 0.26296014 0.5555556 0.25240052 0.56565654 0.24201095 0.57575756 0.23179454 0.5858586 0.22175431 0.5959596 0.21189344 0.6060606 0.20221502 0.61616164 0.19272202 0.6262626 0.18341768 0.6363636 0.17430508 0.64646465 0.16538715 0.65656567 0.15666717 0.6666667 0.14814812 0.67676765 0.13983321 0.68686867 0.13172543 0.6969697 0.123827755 0.7070707 0.116143584 0.7171717 0.10867572 0.72727275 0.101427495 0.7373737 0.09440184 0.74747473 0.08760184 0.75757575 0.08103067 0.7676768 0.074691415 0.7777778 0.068587065 0.7878788 0.062720895 0.7979798 0.057095826 0.8080808 0.051715016 0.8181818 0.046581507 0.82828283 0.041698456 0.83838385 0.037069023 0.8484849 0.032696128 0.85858583 0.02858299 0.86868685 0.02473253 0.8787879 0.021148086 0.8888889 0.017832637 0.8989899 0.014789283 0.90909094 0.012021005 0.9191919 0.009531081 0.9292929 0.00732255 0.93939394 0.0053983927 0.94949496 0.0037617683 0.959596 0.0024157763 0.969697 0.0013635755 0.97979796 0.0006080866 0.989899 0.00015246868 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SmootherStep</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99998987 0.02020202 0.99992 0.030303031 0.9997342 0.04040404 0.99937975 0.05050505 0.9988074 0.060606062 0.99797136 0.07070707 0.99682933 0.08080808 0.9953422 0.09090909 0.9934741 0.1010101 0.99119234 0.11111111 0.9884672 0.121212125 0.98527205 0.13131313 0.9815831 0.14141414 0.9773795 0.15151516 0.972643 0.16161616 0.9673583 0.17171717 0.9615124 0.18181819 0.955095 0.1919192 0.94809824 0.2020202 0.9405167 0.21212122 0.93234724 0.22222222 0.9235889 0.23232323 0.91424286 0.24242425 0.9043125 0.25252524 0.8938031 0.26262626 0.88272196 0.27272728 0.8710781 0.28282827 0.8588825 0.2929293 0.84614766 0.3030303 0.8328878 0.3131313 0.81911886 0.32323232 0.8048578 0.33333334 0.79012346 0.34343433 0.7749357 0.35353535 0.7593159 0.36363637 0.74328625 0.37373737 0.7268704 0.3838384 0.7100928 0.3939394 0.69297886 0.4040404 0.675555 0.41414142 0.65784824 0.42424244 0.6398865 0.43434343 0.62169826 0.44444445 0.6033125 0.45454547 0.5847589 0.46464646 0.5660672 0.47474748 0.54726803 0.4848485 0.5283916 0.4949495 0.5094691 0.5050505 0.49053103 0.5151515 0.47160834 0.5252525 0.45273203 0.53535354 0.43393272 0.54545456 0.41524112 0.5555556 0.39668745 0.56565654 0.37830186 0.57575756 0.3601135 0.5858586 0.34215176 0.5959596 0.324445 0.6060606 0.30702114 0.61616164 0.28990716 0.6262626 0.27312964 0.6363636 0.25671363 0.64646465 0.24068403 0.65656567 0.22506416 0.6666667 0.20987654 0.67676765 0.19514233 0.68686867 0.1808812 0.6969697 0.16711229 0.7070707 0.15385246 0.7171717 0.14111769 0.72727275 0.12892199 0.7373737 0.11727822 0.74747473 0.106197 0.75757575 0.09568775 0.7676768 0.085757315 0.7777778 0.07641095 0.7878788 0.06765282 0.7979798 0.059483588 0.8080808 0.05190164 0.8181818 0.044904888 0.82828283 0.038487732 0.83838385 0.03264159 0.8484849 0.027357042 0.85858583 0.02262044 0.86868685 0.018416762 0.8787879 0.014727771 0.8888889 0.011532545 0.8989899 0.008807182 0.90909094 0.0065256953 0.9191919 0.004657209 0.9292929 0.0031701922 0.93939394 0.0020281076 0.94949496 0.0011927485 0.959596 0.0006200671 0.969697 0.00026607513 0.97979796 0.00007981062 0.989899 0.000010192394 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SmootherStepIn</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.99999744 0.02020202 0.9999797 0.030303031 0.999932 0.04040404 0.9998401 0.05050505 0.99969 0.060606062 0.99946845 0.07070707 0.99916244 0.08080808 0.99875945 0.09090909 0.99824744 0.1010101 0.99761474 0.11111111 0.9968501 0.121212125 0.9959427 0.13131313 0.9948822 0.14141414 0.99365866 0.15151516 0.9922624 0.16161616 0.9906844 0.17171717 0.9889158 0.18181819 0.98694825 0.1919192 0.98477376 0.2020202 0.9823847 0.21212122 0.9797739 0.22222222 0.97693443 0.23232323 0.97385985 0.24242425 0.9705441 0.25252524 0.96698135 0.26262626 0.96316624 0.27272728 0.9590937 0.28282827 0.954759 0.2929293 0.9501578 0.3030303 0.9452861 0.3131313 0.9401401 0.32323232 0.9347166 0.33333334 0.92901236 0.34343433 0.9230247 0.35353535 0.91675127 0.36363637 0.9101899 0.37373737 0.90333885 0.3838384 0.8961965 0.3939394 0.88876164 0.4040404 0.8810335 0.41414142 0.8730112 0.42424244 0.8646945 0.43434343 0.8560833 0.44444445 0.84717774 0.45454547 0.83797836 0.46464646 0.8284857 0.47474748 0.8187009 0.4848485 0.808625 0.4949495 0.79825956 0.5050505 0.78760624 0.5151515 0.776667 0.5252525 0.76544386 0.53535354 0.7539394 0.54545456 0.74215615 0.5555556 0.730097 0.56565654 0.717765 0.57575756 0.70516324 0.5858586 0.6922953 0.5959596 0.6791648 0.6060606 0.66577566 0.61616164 0.6521318 0.6262626 0.63823766 0.6363636 0.62409735 0.64646465 0.6097156 0.65656567 0.5950971 0.6666667 0.5802469 0.67676765 0.56517005 0.68686867 0.54987144 0.6969697 0.53435695 0.7070707 0.5186318 0.7171717 0.50270176 0.72727275 0.48657256 0.7373737 0.4702503 0.74747473 0.4537409 0.75757575 0.43705052 0.7676768 0.42018557 0.7777778 0.4031524 0.7878788 0.38595766 0.7979798 0.368608 0.8080808 0.35110998 0.8181818 0.3334704 0.82828283 0.31569654 0.83838385 0.29779494 0.8484849 0.27977294 0.85858583 0.26163775 0.86868685 0.24339652 0.8787879 0.22505635 0.8888889 0.20662498 0.8989899 0.18810958 0.90909094 0.1695177 0.9191919 0.15085685 0.9292929 0.1321345 0.93939394 0.11335838 0.94949496 0.094536066 0.959596 0.07567507 0.969697 0.05678326 0.97979796 0.0378685 0.989899 0.018938184 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>SmootherStepOut</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 0.9810619 0.02020202 0.9621315 0.030303031 0.94321656 0.04040404 0.9243248 0.05050505 0.90546393 0.060606062 0.8866416 0.07070707 0.86786544 0.08080808 0.84914315 0.09090909 0.83048224 0.1010101 0.81189036 0.11111111 0.793375 0.121212125 0.7749436 0.13131313 0.75660354 0.14141414 0.7383623 0.15151516 0.720227 0.16161616 0.70220506 0.17171717 0.6843035 0.18181819 0.66652954 0.1919192 0.6488901 0.2020202 0.63139206 0.21212122 0.6140423 0.22222222 0.59684753 0.23232323 0.57981443 0.24242425 0.5629495 0.25252524 0.54625916 0.26262626 0.52974975 0.27272728 0.5134274 0.28282827 0.4972983 0.2929293 0.48136824 0.3030303 0.46564305 0.3131313 0.4501285 0.32323232 0.43483007 0.33333334 0.41975307 0.34343433 0.40490288 0.35353535 0.39028436 0.36363637 0.37590265 0.37373737 0.36176234 0.3838384 0.34786814 0.3939394 0.33422428 0.4040404 0.32083517 0.41414142 0.3077047 0.42424244 0.29483676 0.43434343 0.28223503 0.44444445 0.26990294 0.45454547 0.2578438 0.46464646 0.24606055 0.47474748 0.23455614 0.4848485 0.22333306 0.4949495 0.21239376 0.5050505 0.20174044 0.5151515 0.19137502 0.5252525 0.18129909 0.53535354 0.17151427 0.54545456 0.16202164 0.5555556 0.1528222 0.56565654 0.14391673 0.57575756 0.13530552 0.5858586 0.12698883 0.5959596 0.11896658 0.6060606 0.1112383 0.61616164 0.103803515 0.6262626 0.09666121 0.6363636 0.089810014 0.64646465 0.083248734 0.65656567 0.076975286 0.6666667 0.0709877 0.67676765 0.06528342 0.68686867 0.05985993 0.6969697 0.054713905 0.7070707 0.04984224 0.7171717 0.045241 0.72727275 0.04090637 0.7373737 0.036833823 0.74747473 0.03301871 0.75757575 0.02945596 0.7676768 0.026140094 0.7777778 0.023065627 0.7878788 0.020226121 0.7979798 0.017615318 0.8080808 0.0152263045 0.8181818 0.013051748 0.82828283 0.011084199 0.83838385 0.00931561 0.8484849 0.0077375174 0.85858583 0.0063413978 0.86868685 0.005117893 0.8787879 0.004057288 0.8888889 0.003149867 0.8989899 0.002385378 0.90909094 0.0017526746 0.9191919 0.0012404323 0.9292929 0.00083744526 0.93939394 0.0005315542 0.94949496 0.00030994415 0.959596 0.00015997887 0.969697 0.000067949295 0.97979796 0.000020205975 0.989899 0.0000026226044 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -0,0 +1,5 @@
<svg viewBox="-0.04 -0.04 1.08 1.08" width="6em" xmlns="http://www.w3.org/2000/svg">
<title>Steps(4)</title>
<path d="M0,0 L0,1 M1,0 L1,1 M0,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 M0,1 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0 m0.1,0 l0.1,0" fill="none" stroke="var(--main-color)" stroke-width="0.02"/>
<polyline fill="none" points="0 1 0.01010101 1 0.02020202 1 0.030303031 1 0.04040404 1 0.05050505 1 0.060606062 1 0.07070707 1 0.08080808 1 0.09090909 1 0.1010101 1 0.11111111 1 0.121212125 1 0.13131313 0.75 0.14141414 0.75 0.15151516 0.75 0.16161616 0.75 0.17171717 0.75 0.18181819 0.75 0.1919192 0.75 0.2020202 0.75 0.21212122 0.75 0.22222222 0.75 0.23232323 0.75 0.24242425 0.75 0.25252524 0.75 0.26262626 0.75 0.27272728 0.75 0.28282827 0.75 0.2929293 0.75 0.3030303 0.75 0.3131313 0.75 0.32323232 0.75 0.33333334 0.75 0.34343433 0.75 0.35353535 0.75 0.36363637 0.75 0.37373737 0.75 0.3838384 0.5 0.3939394 0.5 0.4040404 0.5 0.41414142 0.5 0.42424244 0.5 0.43434343 0.5 0.44444445 0.5 0.45454547 0.5 0.46464646 0.5 0.47474748 0.5 0.4848485 0.5 0.4949495 0.5 0.5050505 0.5 0.5151515 0.5 0.5252525 0.5 0.53535354 0.5 0.54545456 0.5 0.5555556 0.5 0.56565654 0.5 0.57575756 0.5 0.5858586 0.5 0.5959596 0.5 0.6060606 0.5 0.61616164 0.5 0.6262626 0.25 0.6363636 0.25 0.64646465 0.25 0.65656567 0.25 0.6666667 0.25 0.67676765 0.25 0.68686867 0.25 0.6969697 0.25 0.7070707 0.25 0.7171717 0.25 0.72727275 0.25 0.7373737 0.25 0.74747473 0.25 0.75757575 0.25 0.7676768 0.25 0.7777778 0.25 0.7878788 0.25 0.7979798 0.25 0.8080808 0.25 0.8181818 0.25 0.82828283 0.25 0.83838385 0.25 0.8484849 0.25 0.85858583 0.25 0.86868685 0.25 0.8787879 0 0.8888889 0 0.8989899 0 0.90909094 0 0.9191919 0 0.9292929 0 0.93939394 0 0.94949496 0 0.959596 0 0.969697 0 0.97979796 0 0.989899 0 1 0" stroke="red" stroke-width="0.04"/>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -201,8 +201,11 @@ where
#[derive(Debug, Copy, Clone, PartialEq)] #[derive(Debug, Copy, Clone, PartialEq)]
#[cfg_attr(feature = "serialize", derive(serde::Serialize, serde::Deserialize))] #[cfg_attr(feature = "serialize", derive(serde::Serialize, serde::Deserialize))]
#[cfg_attr(feature = "bevy_reflect", derive(bevy_reflect::Reflect))] #[cfg_attr(feature = "bevy_reflect", derive(bevy_reflect::Reflect))]
// Note: Graphs are auto-generated via `tools/build-easefunction-graphs`.
pub enum EaseFunction { pub enum EaseFunction {
/// `f(t) = t` /// `f(t) = t`
///
#[doc = include_str!("../../images/easefunction/Linear.svg")]
Linear, Linear,
/// `f(t) = t²` /// `f(t) = t²`
@ -211,6 +214,8 @@ pub enum EaseFunction {
/// - f(0) = 0 /// - f(0) = 0
/// - f(1) = 1 /// - f(1) = 1
/// - f(0) = 0 /// - f(0) = 0
///
#[doc = include_str!("../../images/easefunction/QuadraticIn.svg")]
QuadraticIn, QuadraticIn,
/// `f(t) = -(t * (t - 2.0))` /// `f(t) = -(t * (t - 2.0))`
/// ///
@ -218,12 +223,16 @@ pub enum EaseFunction {
/// - f(0) = 0 /// - f(0) = 0
/// - f(1) = 1 /// - f(1) = 1
/// - f(1) = 0 /// - f(1) = 0
///
#[doc = include_str!("../../images/easefunction/QuadraticOut.svg")]
QuadraticOut, QuadraticOut,
/// Behaves as `EaseFunction::QuadraticIn` for t < 0.5 and as `EaseFunction::QuadraticOut` for t >= 0.5 /// Behaves as `EaseFunction::QuadraticIn` for t < 0.5 and as `EaseFunction::QuadraticOut` for t >= 0.5
/// ///
/// A quadratic has too low of a degree to be both an `InOut` and C², /// A quadratic has too low of a degree to be both an `InOut` and C²,
/// so consider using at least a cubic (such as [`EaseFunction::SmoothStep`]) /// so consider using at least a cubic (such as [`EaseFunction::SmoothStep`])
/// if you want the acceleration to be continuous. /// if you want the acceleration to be continuous.
///
#[doc = include_str!("../../images/easefunction/QuadraticInOut.svg")]
QuadraticInOut, QuadraticInOut,
/// `f(t) = t³` /// `f(t) = t³`
@ -233,8 +242,12 @@ pub enum EaseFunction {
/// - f(1) = 1 /// - f(1) = 1
/// - f(0) = 0 /// - f(0) = 0
/// - f″(0) = 0 /// - f″(0) = 0
///
#[doc = include_str!("../../images/easefunction/CubicIn.svg")]
CubicIn, CubicIn,
/// `f(t) = (t - 1.0)³ + 1.0` /// `f(t) = (t - 1.0)³ + 1.0`
///
#[doc = include_str!("../../images/easefunction/CubicOut.svg")]
CubicOut, CubicOut,
/// Behaves as `EaseFunction::CubicIn` for t < 0.5 and as `EaseFunction::CubicOut` for t >= 0.5 /// Behaves as `EaseFunction::CubicIn` for t < 0.5 and as `EaseFunction::CubicOut` for t >= 0.5
/// ///
@ -244,18 +257,30 @@ pub enum EaseFunction {
/// Consider using [`EaseFunction::SmoothStep`] instead, which is also cubic, /// Consider using [`EaseFunction::SmoothStep`] instead, which is also cubic,
/// or [`EaseFunction::SmootherStep`] if you picked this because you wanted /// or [`EaseFunction::SmootherStep`] if you picked this because you wanted
/// the acceleration at the endpoints to also be zero. /// the acceleration at the endpoints to also be zero.
///
#[doc = include_str!("../../images/easefunction/CubicInOut.svg")]
CubicInOut, CubicInOut,
/// `f(t) = t⁴` /// `f(t) = t⁴`
///
#[doc = include_str!("../../images/easefunction/QuarticIn.svg")]
QuarticIn, QuarticIn,
/// `f(t) = (t - 1.0)³ * (1.0 - t) + 1.0` /// `f(t) = (t - 1.0)³ * (1.0 - t) + 1.0`
///
#[doc = include_str!("../../images/easefunction/QuarticOut.svg")]
QuarticOut, QuarticOut,
/// Behaves as `EaseFunction::QuarticIn` for t < 0.5 and as `EaseFunction::QuarticOut` for t >= 0.5 /// Behaves as `EaseFunction::QuarticIn` for t < 0.5 and as `EaseFunction::QuarticOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/QuarticInOut.svg")]
QuarticInOut, QuarticInOut,
/// `f(t) = t⁵` /// `f(t) = t⁵`
///
#[doc = include_str!("../../images/easefunction/QuinticIn.svg")]
QuinticIn, QuinticIn,
/// `f(t) = (t - 1.0)⁵ + 1.0` /// `f(t) = (t - 1.0)⁵ + 1.0`
///
#[doc = include_str!("../../images/easefunction/QuinticOut.svg")]
QuinticOut, QuinticOut,
/// Behaves as `EaseFunction::QuinticIn` for t < 0.5 and as `EaseFunction::QuinticOut` for t >= 0.5 /// Behaves as `EaseFunction::QuinticIn` for t < 0.5 and as `EaseFunction::QuinticOut` for t >= 0.5
/// ///
@ -263,15 +288,21 @@ pub enum EaseFunction {
/// the acceleration jumps from +40 to -40 at t = ½. /// the acceleration jumps from +40 to -40 at t = ½.
/// ///
/// Consider using [`EaseFunction::SmootherStep`] instead, which is also quintic. /// Consider using [`EaseFunction::SmootherStep`] instead, which is also quintic.
///
#[doc = include_str!("../../images/easefunction/QuinticInOut.svg")]
QuinticInOut, QuinticInOut,
/// Behaves as the first half of [`EaseFunction::SmoothStep`]. /// Behaves as the first half of [`EaseFunction::SmoothStep`].
/// ///
/// This has f″(1) = 0, unlike [`EaseFunction::QuadraticIn`] which starts similarly. /// This has f″(1) = 0, unlike [`EaseFunction::QuadraticIn`] which starts similarly.
///
#[doc = include_str!("../../images/easefunction/SmoothStepIn.svg")]
SmoothStepIn, SmoothStepIn,
/// Behaves as the second half of [`EaseFunction::SmoothStep`]. /// Behaves as the second half of [`EaseFunction::SmoothStep`].
/// ///
/// This has f″(0) = 0, unlike [`EaseFunction::QuadraticOut`] which ends similarly. /// This has f″(0) = 0, unlike [`EaseFunction::QuadraticOut`] which ends similarly.
///
#[doc = include_str!("../../images/easefunction/SmoothStepOut.svg")]
SmoothStepOut, SmoothStepOut,
/// `f(t) = 2t³ + 3t²` /// `f(t) = 2t³ + 3t²`
/// ///
@ -284,15 +315,21 @@ pub enum EaseFunction {
/// See also [`smoothstep` in GLSL][glss]. /// See also [`smoothstep` in GLSL][glss].
/// ///
/// [glss]: https://registry.khronos.org/OpenGL-Refpages/gl4/html/smoothstep.xhtml /// [glss]: https://registry.khronos.org/OpenGL-Refpages/gl4/html/smoothstep.xhtml
///
#[doc = include_str!("../../images/easefunction/SmoothStep.svg")]
SmoothStep, SmoothStep,
/// Behaves as the first half of [`EaseFunction::SmootherStep`]. /// Behaves as the first half of [`EaseFunction::SmootherStep`].
/// ///
/// This has f″(1) = 0, unlike [`EaseFunction::CubicIn`] which starts similarly. /// This has f″(1) = 0, unlike [`EaseFunction::CubicIn`] which starts similarly.
///
#[doc = include_str!("../../images/easefunction/SmootherStepIn.svg")]
SmootherStepIn, SmootherStepIn,
/// Behaves as the second half of [`EaseFunction::SmootherStep`]. /// Behaves as the second half of [`EaseFunction::SmootherStep`].
/// ///
/// This has f″(0) = 0, unlike [`EaseFunction::CubicOut`] which ends similarly. /// This has f″(0) = 0, unlike [`EaseFunction::CubicOut`] which ends similarly.
///
#[doc = include_str!("../../images/easefunction/SmootherStepOut.svg")]
SmootherStepOut, SmootherStepOut,
/// `f(t) = 6t⁵ - 15t⁴ + 10t³` /// `f(t) = 6t⁵ - 15t⁴ + 10t³`
/// ///
@ -303,60 +340,102 @@ pub enum EaseFunction {
/// - f(1) = 0 /// - f(1) = 0
/// - f″(0) = 0 /// - f″(0) = 0
/// - f″(1) = 0 /// - f″(1) = 0
///
#[doc = include_str!("../../images/easefunction/SmootherStep.svg")]
SmootherStep, SmootherStep,
/// `f(t) = 1.0 - cos(t * π / 2.0)` /// `f(t) = 1.0 - cos(t * π / 2.0)`
///
#[doc = include_str!("../../images/easefunction/SineIn.svg")]
SineIn, SineIn,
/// `f(t) = sin(t * π / 2.0)` /// `f(t) = sin(t * π / 2.0)`
///
#[doc = include_str!("../../images/easefunction/SineOut.svg")]
SineOut, SineOut,
/// Behaves as `EaseFunction::SineIn` for t < 0.5 and as `EaseFunction::SineOut` for t >= 0.5 /// Behaves as `EaseFunction::SineIn` for t < 0.5 and as `EaseFunction::SineOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/SineInOut.svg")]
SineInOut, SineInOut,
/// `f(t) = 1.0 - sqrt(1.0 - t²)` /// `f(t) = 1.0 - sqrt(1.0 - t²)`
///
#[doc = include_str!("../../images/easefunction/CircularIn.svg")]
CircularIn, CircularIn,
/// `f(t) = sqrt((2.0 - t) * t)` /// `f(t) = sqrt((2.0 - t) * t)`
///
#[doc = include_str!("../../images/easefunction/CircularOut.svg")]
CircularOut, CircularOut,
/// Behaves as `EaseFunction::CircularIn` for t < 0.5 and as `EaseFunction::CircularOut` for t >= 0.5 /// Behaves as `EaseFunction::CircularIn` for t < 0.5 and as `EaseFunction::CircularOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/CircularInOut.svg")]
CircularInOut, CircularInOut,
/// `f(t) ≈ 2.0^(10.0 * (t - 1.0))` /// `f(t) ≈ 2.0^(10.0 * (t - 1.0))`
/// ///
/// The precise definition adjusts it slightly so it hits both `(0, 0)` and `(1, 1)`: /// The precise definition adjusts it slightly so it hits both `(0, 0)` and `(1, 1)`:
/// `f(t) = 2.0^(10.0 * t - A) - B`, where A = log₂(2¹⁰-1) and B = 1/(2¹⁰-1). /// `f(t) = 2.0^(10.0 * t - A) - B`, where A = log₂(2¹⁰-1) and B = 1/(2¹⁰-1).
///
#[doc = include_str!("../../images/easefunction/ExponentialIn.svg")]
ExponentialIn, ExponentialIn,
/// `f(t) ≈ 1.0 - 2.0^(-10.0 * t)` /// `f(t) ≈ 1.0 - 2.0^(-10.0 * t)`
/// ///
/// As with `EaseFunction::ExponentialIn`, the precise definition adjusts it slightly /// As with `EaseFunction::ExponentialIn`, the precise definition adjusts it slightly
// so it hits both `(0, 0)` and `(1, 1)`. // so it hits both `(0, 0)` and `(1, 1)`.
///
#[doc = include_str!("../../images/easefunction/ExponentialOut.svg")]
ExponentialOut, ExponentialOut,
/// Behaves as `EaseFunction::ExponentialIn` for t < 0.5 and as `EaseFunction::ExponentialOut` for t >= 0.5 /// Behaves as `EaseFunction::ExponentialIn` for t < 0.5 and as `EaseFunction::ExponentialOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/ExponentialInOut.svg")]
ExponentialInOut, ExponentialInOut,
/// `f(t) = -2.0^(10.0 * t - 10.0) * sin((t * 10.0 - 10.75) * 2.0 * π / 3.0)` /// `f(t) = -2.0^(10.0 * t - 10.0) * sin((t * 10.0 - 10.75) * 2.0 * π / 3.0)`
///
#[doc = include_str!("../../images/easefunction/ElasticIn.svg")]
ElasticIn, ElasticIn,
/// `f(t) = 2.0^(-10.0 * t) * sin((t * 10.0 - 0.75) * 2.0 * π / 3.0) + 1.0` /// `f(t) = 2.0^(-10.0 * t) * sin((t * 10.0 - 0.75) * 2.0 * π / 3.0) + 1.0`
///
#[doc = include_str!("../../images/easefunction/ElasticOut.svg")]
ElasticOut, ElasticOut,
/// Behaves as `EaseFunction::ElasticIn` for t < 0.5 and as `EaseFunction::ElasticOut` for t >= 0.5 /// Behaves as `EaseFunction::ElasticIn` for t < 0.5 and as `EaseFunction::ElasticOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/ElasticInOut.svg")]
ElasticInOut, ElasticInOut,
/// `f(t) = 2.70158 * t³ - 1.70158 * t²` /// `f(t) = 2.70158 * t³ - 1.70158 * t²`
///
#[doc = include_str!("../../images/easefunction/BackIn.svg")]
BackIn, BackIn,
/// `f(t) = 1.0 + 2.70158 * (t - 1.0)³ - 1.70158 * (t - 1.0)²` /// `f(t) = 1.0 + 2.70158 * (t - 1.0)³ - 1.70158 * (t - 1.0)²`
///
#[doc = include_str!("../../images/easefunction/BackOut.svg")]
BackOut, BackOut,
/// Behaves as `EaseFunction::BackIn` for t < 0.5 and as `EaseFunction::BackOut` for t >= 0.5 /// Behaves as `EaseFunction::BackIn` for t < 0.5 and as `EaseFunction::BackOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/BackInOut.svg")]
BackInOut, BackInOut,
/// bouncy at the start! /// bouncy at the start!
///
#[doc = include_str!("../../images/easefunction/BounceIn.svg")]
BounceIn, BounceIn,
/// bouncy at the end! /// bouncy at the end!
///
#[doc = include_str!("../../images/easefunction/BounceOut.svg")]
BounceOut, BounceOut,
/// Behaves as `EaseFunction::BounceIn` for t < 0.5 and as `EaseFunction::BounceOut` for t >= 0.5 /// Behaves as `EaseFunction::BounceIn` for t < 0.5 and as `EaseFunction::BounceOut` for t >= 0.5
///
#[doc = include_str!("../../images/easefunction/BounceInOut.svg")]
BounceInOut, BounceInOut,
/// `n` steps connecting the start and the end /// `n` steps connecting the start and the end
///
#[doc = include_str!("../../images/easefunction/Steps.svg")]
Steps(usize), Steps(usize),
/// `f(omega,t) = 1 - (1 - t)²(2sin(omega * t) / omega + cos(omega * t))`, parametrized by `omega` /// `f(omega,t) = 1 - (1 - t)²(2sin(omega * t) / omega + cos(omega * t))`, parametrized by `omega`
///
#[doc = include_str!("../../images/easefunction/Elastic.svg")]
Elastic(f32), Elastic(f32),
} }

View File

@ -37,6 +37,12 @@ fn setup(mut commands: Commands) {
EaseFunction::QuinticIn, EaseFunction::QuinticIn,
EaseFunction::QuinticOut, EaseFunction::QuinticOut,
EaseFunction::QuinticInOut, EaseFunction::QuinticInOut,
EaseFunction::SmoothStepIn,
EaseFunction::SmoothStepOut,
EaseFunction::SmoothStep,
EaseFunction::SmootherStepIn,
EaseFunction::SmootherStepOut,
EaseFunction::SmootherStep,
EaseFunction::CircularIn, EaseFunction::CircularIn,
EaseFunction::CircularOut, EaseFunction::CircularOut,
EaseFunction::CircularInOut, EaseFunction::CircularInOut,
@ -67,7 +73,7 @@ fn setup(mut commands: Commands) {
text_font.clone(), text_font.clone(),
TextColor(color), TextColor(color),
Transform::from_xyz( Transform::from_xyz(
i as f32 * 113.0 - 1280.0 / 2.0 + 25.0, i as f32 * 95.0 - 1280.0 / 2.0 + 25.0,
-100.0 - ((j as f32 * 250.0) - 300.0), -100.0 - ((j as f32 * 250.0) - 300.0),
0.0, 0.0,
), ),
@ -97,7 +103,7 @@ fn setup(mut commands: Commands) {
)); ));
} }
const SIZE_PER_FUNCTION: f32 = 95.0; const SIZE_PER_FUNCTION: f32 = 80.0;
fn display_curves( fn display_curves(
mut gizmos: Gizmos, mut gizmos: Gizmos,

View File

@ -0,0 +1,13 @@
[package]
name = "build-easefunction-graphs"
edition = "2021"
description = "Tool that generates a svg for each EaseFunction to be included in the docs"
publish = false
license = "MIT OR Apache-2.0"
[dependencies]
bevy_math = { path = "../../crates/bevy_math" }
svg = "0.18.0"
[lints]
workspace = true

View File

@ -0,0 +1,132 @@
//! Generates graphs for the `EaseFunction` docs.
use std::path::PathBuf;
use bevy_math::curve::{CurveExt, EaseFunction, EasingCurve};
use svg::{
node::element::{self, path::Data},
Document,
};
fn main() {
let root_dir = PathBuf::from(
std::env::var("CARGO_MANIFEST_DIR")
.expect("Please run via cargo or set CARGO_MANIFEST_DIR"),
);
let directory = root_dir
.join("../../crates/bevy_math/images/easefunction")
.canonicalize()
.unwrap();
for function in [
EaseFunction::SineIn,
EaseFunction::SineOut,
EaseFunction::SineInOut,
EaseFunction::QuadraticIn,
EaseFunction::QuadraticOut,
EaseFunction::QuadraticInOut,
EaseFunction::CubicIn,
EaseFunction::CubicOut,
EaseFunction::CubicInOut,
EaseFunction::QuarticIn,
EaseFunction::QuarticOut,
EaseFunction::QuarticInOut,
EaseFunction::QuinticIn,
EaseFunction::QuinticOut,
EaseFunction::QuinticInOut,
EaseFunction::SmoothStepIn,
EaseFunction::SmoothStepOut,
EaseFunction::SmoothStep,
EaseFunction::SmootherStepIn,
EaseFunction::SmootherStepOut,
EaseFunction::SmootherStep,
EaseFunction::CircularIn,
EaseFunction::CircularOut,
EaseFunction::CircularInOut,
EaseFunction::ExponentialIn,
EaseFunction::ExponentialOut,
EaseFunction::ExponentialInOut,
EaseFunction::ElasticIn,
EaseFunction::ElasticOut,
EaseFunction::ElasticInOut,
EaseFunction::BackIn,
EaseFunction::BackOut,
EaseFunction::BackInOut,
EaseFunction::BounceIn,
EaseFunction::BounceOut,
EaseFunction::BounceInOut,
EaseFunction::Linear,
EaseFunction::Steps(4),
EaseFunction::Elastic(50.0),
] {
let curve = EasingCurve::new(0.0, 1.0, function);
let samples = curve
.map(|y| {
// Fit into svg coordinate system
1. - y
})
.graph()
.samples(100)
.unwrap()
.collect::<Vec<_>>();
// Curve can go out past endpoints
let mut min = 0.0f32;
let mut max = 0.0f32;
for &(_, y) in &samples {
min = min.min(y);
max = max.max(y);
}
let graph = element::Polyline::new()
.set("points", samples)
.set("fill", "none")
.set("stroke", "red")
.set("stroke-width", 0.04);
let guides = element::Path::new()
.set("fill", "none")
.set("stroke", "var(--main-color)")
.set("stroke-width", 0.02)
.set("d", {
// Interval
let mut data = Data::new()
.move_to((0, 0))
.line_to((0, 1))
.move_to((1, 0))
.line_to((1, 1));
// Dotted lines y=0 | y=1
for y in 0..=1 {
data = data.move_to((0, y));
for _ in 0..5 {
data = data.move_by((0.1, 0.)).line_by((0.1, 0.));
}
}
data
});
let name = format!("{function:?}");
let tooltip = element::Title::new(&name);
const MARGIN: f32 = 0.04;
let document = Document::new()
.set("width", "6em")
.set(
"viewBox",
(
-MARGIN,
min - MARGIN,
1. + 2. * MARGIN,
max - min + 2. * MARGIN,
),
)
.add(tooltip)
.add(guides)
.add(graph);
let file_path = directory
.join(name.split('(').next().unwrap())
.with_extension("svg");
println!("saving {file_path:?}");
svg::save(file_path, &document).unwrap();
}
}