jezzamonn / fourier Goto Github PK
View Code? Open in Web Editor NEWAn Interactive Introduction to Fourier Transforms
Home Page: http://www.jezzamon.com/fourier
License: MIT License
An Interactive Introduction to Fourier Transforms
Home Page: http://www.jezzamon.com/fourier
License: MIT License
thanks~
Hi. One day, I saw the video of 3blue1brown and I thought I really want to make this animation. I found that, I found yours . but there was no simple svg to animation converter for the person like me. And I started to think I didn't even finished scratch guidebook. is that hard? ( https://www.youtube.com/watch?v=xXwQ0UUu-ww ) even this student doing? I searched more, And I found p5 code drawing fourier. It loads svg from gist but I have no idea to switch to my svg. I can't even upload pure svg link on web. like this ( https://gist.githubusercontent.com/mbostock/a4fd7a68925d4039c22996cc1d4862ce/raw/d813a42956d311d73fee336e1b5aac899c835883/fourier.svg ) I draw the star via inkscape, that also doesn't work. Is my svg is wrong or this isn't place for someone wants just interesting animations? Please help me
thanks for the very nice demo.
I ran into an audio Problem trying the different buttons:
synth.js:23 Uncaught DOMException: Failed to construct 'AudioContext': The number of hardware contexts provided (6) is greater than or equal to the maximum bound (6).
at playSoundWave (http://www.jezzamon.com/fourier/main.bundle.js:1051:24)
at HTMLButtonElement. (http://www.jezzamon.com/fourier/main.bundle.js:1442:36)
playSoundWave @ synth.js:23
(anonymous) @ main.js:59
it seems the number of open AudioContext's allowed varies. to test I used a connditional breakpoint to close them 100 ms after the decay ends:
window.setTimeout(() => audioContext.close(), decay*1000+100) && 0
Im not sure if closing the contexts or reusing one would be the better Route, its probably just a matter of style.
A few of the labels use English text in the Javascript, so these don't get translated properly in the translations. Would be good to set up something so they do get translated
As one who studied signal processing, I disagree with the way the JPEG wavelets and the cat image are displayed. They shouldn't be displayed resampled but pixelated because only the values at integer coordinates matter.
This can be achieved with these extra CSS rules:
image-rendering: -moz-crisp-edges; /* Firefox */
image-rendering: -o-crisp-edges; /* Opera */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
Just noticed that in both translations (german and spanish) in the second to last paragraph the span "email-text" inserts english text ("email me at ...@..., or"). Can this be fixed by special span ids for each language or by editing the inserted text to be just your email address?
Also "homepage" is capitalsed in german.
If you move the harmonic-count slider to the left and redraw the wave, the slider moves to the right. If you press Play right after redrawing the wave, the harmonics are there. If you keep spamming Play as the right side of the image animates into a filtered wave, the quieter (not necessarily upper) harmonics gradually fade into silence.
I've installed the dependencies from the requirements.txt but when executing svg2pasths_ext.py I get this error
Traceback (most recent call last): File "C:\Users\vcand\Desktop\FourierFromSVG-master\svg2paths_ext.py", line 9, in <module> from svgpathtools.svg2paths import polyline2pathd ModuleNotFoundError: No module named 'svgpathtools.svg2paths' PS C:\Users\vcand\Desktop\FourierFromSVG-master>
Any help?
(I have no previous knowledge of Python so help is really appreciated)
Hi, is it possible to somehow obtain one frame of the animated drawing as a vector image?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.