Turns CSVs into graphs in a few simple steps; embeds onto other websites!
git clone https://github.com/publiclab/simple-data-grapher
npm install
to install all the necessary packages required.examples/index.html
in your browser to look at the preview of the library.npm run build
for making the changes in the dist/
.npm run test
to run the tests.examples/index.html
.npm run lint
We are using babel
to transpile code into es5 and browserify
to require
different files and watch
to watch the changes and build the changes.
For testing we are using mocha
.
View.js: First reads the input files through the event listeners and sends the file to Csvparser.js, then once the required information is received, it displays a sample of the data. It then takes the selected data by the user, through the afterSampleData()
method, and goes to the plotting library, and displays the graph.
Csvparser.js: Receives the file and it's format type and:
PlotlyjsPlotter.js (default) or ChartjsPlotter.js: Assembles the received data according to its format and plots the graph on the canvas element.
Add Graph: It is checked at showSampleDataXandY()
, where the number of currently plotted graphs is incremented and it is sent as a flag, where the newly plotted graph has to be appended in the chart area, and not clear the canvas.
Create Spreadsheet: Uses the transpose created by Csvparser.js and creates a (excel or xlsx) spreadsheet using SheetJS
and downloads it.
CODAP Export: CODAP is used here to view the CSV data in a proper tabular form. From there, the user can view a summary of their data, view a more readable form of it and use other tools that CODAP's Plugin API offers. The user can also export their data as a CSV directly to their Google Drive.
I created an adapter function
which can easily switch between the two charting libraries, as one can be advantageous over the other in different situations.
The basic flow remains the same as in the standalone library.
Save the data: The user can save their uploaded CSV and use it later for plotting.
Using previously uploaded data for plotting: Users can use their previously uploaded files for plotting in simple-data-grapher.
Associate a file title and description with the uploaded data.
Per-User Data Page: Lists down all the files a user has saved, their title & description. The user can delete as well as download the files.
The user can publish their plotted charts as a Research Note on Public Lab and discuss their findings.