Published
Edited
Jun 10, 2020
1 fork
1 star
md`# Grid.js with Datasette`
viewof form_input = form(html`<form>
<div><label>Database URL <input style="padding: 5px; font-size: 14px; width: 30em" name="url" type="text" value="${initial_url}"></label></div>
</form>`)
html`You can share a <a href="/@simonw/grid-js-with-datasette?url=${encodeURIComponent(form_input.url)}">link to this page</a>`
data = await fetch(form_input.url).then(r => r.json());
{
var g = new gridjs.Grid({
columns: data.columns,
data: data.rows
});
var el = document.createElement('div');
g.render(el);
return el;
}
html`<link rel="stylesheet" href="https://unpkg.com/gridjs/dist/theme/mermaid.min.css">`
import {form} from "@mbostock/form-input"
initial_url = decodeURIComponent(location.href.split("?url=")[1] || '') || 'https://covid-19.datasettes.com/covid/ny_times_us_states.json?state=Arizona'
location.href.split("?url=")[1]
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.
