Published
Edited
Aug 27, 2020
1 fork
Importers
56 stars
Insert cell
Insert cell
dfd = require('danfojs@0.0.15/dist/index.min.js').catch(() => {
window.dfd.Series.prototype.print = window.dfd.DataFrame.prototype.print = function() { return print(this) };
return window.dfd;
})
Insert cell
Insert cell
df = dfd.read_csv(await FileAttachment("penguins@1.csv").url())
Insert cell
df.shape
Insert cell
df.head().print()
Insert cell
df.bill_length_mm.head().print()
Insert cell
df.dropna().describe().print()
Insert cell
div(d => df.select_dtypes(['float32']).plot(d).box())
Insert cell
Insert cell
function print(df) {
const {col_types, series, columns, index, values} = df;
const table = html`
<div style="overflow: auto; max-height: 300px;">
<table class="df-table">
<thead>
<tr>
<th></th>
${series
? html`<th class="${col_types[0]}">${columns}</th>`
: columns.map((name, i) => html`<th class="${col_types[i]}">${name}</th>`)}
</tr>
</thead>
<tbody>
${values.map((row, i) => html`
<tr>
<th>${index[i]}</th>
${series
? html`<td class="${col_types[0]}">${row}</td>`
: row.map((v, j) => html`<td class="${col_types[j]}">${v}</td>`)}
</tr>
`)}
</tbody>
</table>
</div>
<style>
table.df-table { white-space: pre; }
table.df-table th, td { padding: 2px 5px; font-variant-numeric: tabular-nums; }
table.df-table .float32, .int32 { text-align: right; }
</style>
`;
table.value = df;
return table;
}
Insert cell
Insert cell
function div(fn) {
const d = html`<div>`;
fn(d);
return d;
}
Insert cell
import { vl } from '@vega/vega-lite-api'
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more