With this CSV example:
Source,col1,col2,col3
foo,1,2,3
bar,3,4,5
The standard method I use Pandas is this:
Parse CSV<
Here is an dynamic approach assuming an existing header on line 1. The csv is loaded with d3.js
.
function csvToColumnArrays(csv) {
var mainObj = {},
header = Object.keys(csv[0]);
for (var i = 0; i < header.length; i++) {
mainObj[header[i]] = [];
};
csv.map(function(d) {
for (key in mainObj) {
mainObj[key].push(d[key])
}
});
return mainObj;
}
d3.csv(path, function(csv) {
var df = csvToColumnArrays(csv);
});
Then you are able to access each column of the data similar an R, python or Matlab dataframe with df.column_header[row_number]
.
Ceaveat The following is applicable only to d3 v3, and not the latest d4v4!
I am partial to d3.js, and while it won't be a total replacement for Pandas, if you spend some time learning its paradigm, it should be able to take care of all your data wrangling for you. (And if you wind up wanting to display results in the browser, it's ideally suited to that.)
Example. My CSV file data.csv
:
name,age,color
Mickey,65,black
Donald,58,white
Pluto,64,orange
In the same directory, create an index.html
containing the following:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>My D3 demo</title>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</head>
<body>
<script charset="utf-8" src="demo.js"></script>
</body>
</html>
and also a demo.js
file containing the following:
d3.csv('/data.csv',
// How to format each row. Since the CSV file has a header, `row` will be
// an object with keys derived from the header.
function(row) {
return {name : row.name, age : +row.age, color : row.color};
},
// Callback to run once all data's loaded and ready.
function(data) {
// Log the data to the JavaScript console
console.log(data);
// Compute some interesting results
var averageAge = data.reduce(function(prev, curr) {
return prev + curr.age;
}, 0) / data.length;
// Also, display it
var ulSelection = d3.select('body').append('ul');
var valuesSelection =
ulSelection.selectAll('li').data(data).enter().append('li').text(
function(d) { return d.age; });
var totalSelection =
ulSelection.append('li').text('Average: ' + averageAge);
});
In the directory, run python -m SimpleHTTPServer 8181
, and open http://localhost:8181 in your browser to see a simple listing of the ages and their average.
This simple example shows a few relevant features of d3:
@neversaint your wait is over. say welcome to Danfo.js which is pandas like Javascript library built on tensorflow.js and supports tensors out of the box. This means you can convert danfo data structure to Tensors. And you can do groupby, merging, joining, plotting and other data processing.
Below is Python numpy and pandas
```
import numpy as np
import pandas as pd
data_frame = pd.DataFrame(np.random.randn(5, 4), ['A', 'B', 'C', 'D', 'E'], [1, 2, 3, 4])
data_frame[5] = np.random.randint(1, 50, 5)
print(data_frame.loc[['C', 'D'], [2, 3]])
# axis 1 = Y | 0 = X
data_frame.drop(5, axis=1, inplace=True)
print(data_frame)
```
The same can be achieved in JavaScript* [numjs works only with Node.js] But D3.js has much advanced Data file set options. Both numjs and Pandas-js still in works..
import np from 'numjs';
import { DataFrame } from 'pandas-js';
const df = new DataFrame(np.random.randn(5, 4), ['A', 'B', 'C', 'D', 'E'], [1, 2, 3, 4])
// df
/*
1 2 3 4
A 0.023126 1.078130 -0.521409 -1.480726
B 0.920194 -0.201019 0.028180 0.558041
C -0.650564 -0.505693 -0.533010 0.441858
D -0.973549 0.095626 -1.302843 1.109872
E -0.989123 -1.382969 -1.682573 -0.637132
*/
I've been working on a data wrangling library for JavaScript called data-forge. It's inspired by LINQ and Pandas.
It can be installed like this:
npm install --save data-forge
Your example would work like this:
var csvData = "Source,col1,col2,col3\n" +
"foo,1,2,3\n" +
"bar,3,4,5\n";
var dataForge = require('data-forge');
var dataFrame =
dataForge.fromCSV(csvData)
.parseInts([ "col1", "col2", "col3" ])
;
If your data was in a CSV file you could load it like this:
var dataFrame = dataForge.readFileSync(fileName)
.parseCSV()
.parseInts([ "col1", "col2", "col3" ])
;
You can use the select
method to transform rows.
You can extract a column using getSeries
then use the select
method to transform values in that column.
You get your data back out of the data-frame like this:
var data = dataFrame.toArray();
To average a column:
var avg = dataFrame.getSeries("col1").average();
There is much more you can do with this.
You can find more documentation on npm.
All answers are good. Hoping my answer is comprehensive (i.e. tries to list all options). I hope to return and revise this answer with any criteria to help make a choice.
I hope anyone coming here is familiar with d3
. d3
is very useful "swiss army knife" for handling data in Javascript, like pandas
is helpful for Python. You may see d3
used frequently like pandas
, even if d3
is not exactly a DataFrame/Pandas replacement (i.e. d3
doesn't have the same API; d3
doesn't have Series
/ DataFrame
which behave like in pandas
)
Ahmed's answer explains how d3 can be used to achieve some DataFrame functionality, and some of the libraries below were inspired by things like LearnJsData which uses d3
and lodash
.
As for DataFrame-focused-features , I was overwhelmed with JS libraries which help. Here's a quick list of some of the options you might've encountered. I haven't checked any of them in detail yet (Most I found in combination Google + NPM search).
Be careful you use a variety that you can work with; some are Node.js aka Server-side Javascript, some are browser-compatible aka client-side Javascript. Some are Typescript.
Then after coming to this question, checking other answers here and doing more searching, I found options like:
JS
alternative to the IPython/Jupyter "notebooks"js-data-mongodb
, js-data-redis
, js-data-cloud-datastore
), sorting, filtering, etc.I hope this post can become a community wiki, and evaluate (i.e. compare the different options above) against different criteria like:
Jupyter
(interactive notebooks), etcSome things a JS library may never do (but could it?)