@wq/pandas is a simple JavaScript utility to load and parse CSV files generated by Pandas DataFrames. @wq/pandas extends d3.js’s built in CSV parser with a more robust way to handle the complex CSV headers Pandas DataFrames can produce. @wq/pandas is primarily intended for use in conjunction with Django REST Pandas.

The typical workflow is something like this:

1. Generate a CSV file via DataFrame.to_csv() (Django REST Pandas does this automatically)
2. Load the file over the internet with @wq/pandas
3. Visualize the resulting data, perhaps with d3.js and/or @wq/chart.

Installation

FIXME

API

@wq/pandas is typically imported as pandas, though any local variable name can be used.

wq.app for PyPI

// myapp.js
define(['d3', 'wq/pandas', ...], function(d3, pandas, ...) {
    pandas.get(...);
});

wq.app for npm

// index.js
import * as d3 from 'd3';
import { pandas } from '@wq/chart';
pandas.get(...);

The pandas module provides two functions: pandas.parse() and pandas.get(). For similarity with d3.csv(), these are also added to the d3 object as d3.pandas.parse() and d3.pandas(), respectively.

parse()

pandas.parse() parses a CSV string with the following structure:

,value,value,value
site,SITE1,SITE2,SITE3
parameter,PARAM1,PARAM1,PARAM2
date,,,
2014-01-01,0.5,0.5,0.2
2014-01-02,0.1,0.5,0.2

Into an array of datasets with the following structure:

[
  {
    'site': 'SITE1',
    'parameter': 'PARAM1',
    'list': [
      {'date': '2014-01-01', 'value': 0.5},
      {'date': '2014-01-02', 'value': 0.1}
    ]
  }
  // etc for SITE2/PARAM1 and SITE3/PARAM2...
]

pandas.parse() also supports multi-valued datasets, e.g.:

,val1,val2
site,SITE1,SITE1,
parameter,PARAM1,PARAM1
date,,
2014-01-01,0.6,0.3

Which will be parsed into:

[
  {
    'site': 'SITE1',
    'parameter': 'PARAM1',
    'list': [
      {'date': '2014-01-01', 'val1': 0.6, 'val2': 0.3}
    ]
  }
]

get()

pandas.get() is a simple wrapper around d3.xhr() to make it easy to load and parse pandas data from an external file or REST service.

Example Usage

wq.app for PyPI

define(['d3', 'wq/pandas'], function(d3, pandas) {

pandas.get('/data.csv', render);

function render(error, data) {
    d3.select('svg')
       .selectAll('rect')
       .data(data)
       // ...
}

});

wq.app for npm

import * as d3 from d3;
import { pandas } from '@wq/chart';

pandas.get('/data.csv', render);

function render(error, data) {
    d3.select('svg')
       .selectAll('rect')
       .data(data)
       // ...
}