FTFiles

Fourier Transform Files are files that aim to encode simple vector image data. The goal of this library is to provide a way to take a svg file with a single svg path. Then it will calculate and re-encode it into a set of coefficients that apply to a complex fourier series.

Usage

This can be done client side the following way:

import { FTProcessor } from 'ftfiles';

// Create a SVGProcessor instance
const ftProc = new FTProcessor(path); // Path must be an SVGPathElement

ftProc.processPoints(numberOfPoints); // Doing discrete integration basically, you have to do this before transforming
ftProc.dft(); // Does the transformation

ftProc.getCoefficients(); // used to retreive the coefficients of the series

Then the coefficients can be read in order to draw it with the drawing module

import { FTDrawer } from 'ftfiles';

// Say we already have coefficents (be it serialized and sent from backend, calculated client side)
const coefficients = ftProc.getCoefficients();

const drawer = new FTDrawer(coefficients);
drawer.setCanvas(canvas); // Set the canvas to which to draw (Param must be Canvas element)
drawer.setScale(1); // Set the scale at which to draw
drawer.draw(); // Draws

Heres a sample repo using this library: https://github.com/Maxty99/FTFileWeb

Thanks

• Biocinematics(): Fourier one-line SVG used for testing and examples: https://twitter.com/Biocinematics/status/1143330623131738112
• 3Blue1Brown(): For the inspiration to make this
• Node(): Framework used
• netsec917(): For the complex number library