Published
Edited
Mar 15, 2020
Importers
Insert cell
Insert cell
Insert cell
Insert cell
data = d3.csv('https://gist.githubusercontent.com/curran/a08a1080b88344b0c8a7/raw/639388c2cbc2120a14dcf466e85730eb8be498bb/iris.csv')
Insert cell
Insert cell
table(sql`
SELECT *
FROM ${{data}}
WHERE petal_width < 0.2
`)
Insert cell
table(sql`
SELECT sepal_length / sepal_width AS sepal_ratio,
petal_length / petal_width AS petal_ratio
FROM ${{data}}
ORDER BY sepal_ratio
`)
Insert cell
Insert cell
alasql = require("alasql")
Insert cell
sqlCode = (strings, ...interpolants) => {
let bits = []
let bindings = {}
let unnamedTableIndex = 0
strings.forEach((string, i) => {
bits.push(string)
if (i < interpolants.length) {
const interpolant = interpolants[i]
if (interpolant.forEach) {
// unnamed tables
interpolant.forEach(function (value) {
const name = "table__" + unnamedTableIndex
unnamedTableIndex++
bits.push(`${i > 0 ? ', ' : ''}:${name}`)
bindings[name] = value
})
} else {
// named tables
Object.keys(interpolant).forEach(function (name, i) {
const value = interpolant[name]
bits.push(`${i > 0 ? ', ' : ''}:${name} AS ${name}`)
bindings[name] = value
});
}
}
})
return [bits.join(''), bindings]
}
Insert cell
sql = (strings, ...interpolants) => {
const [code, bindings] = sqlCode(strings, ...interpolants)
return alasql(code, bindings)
}
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