Published
Edited
Feb 5, 2020
md`# #1: Using "viewof" function - can take many forms such as image, text, json, csv, etc... choosing files from local computers
`
import {vl} from '@vega/vega-lite-api'
d3 = require('d3-dsv')
viewof f = html`<input type=file accept=".csv">`
first_data = d3.csvParse(await Files.text(f))
first_data
vl.markPoint()
.data(first_data)
.encode(
vl.y().average('sewer_and_water'),
vl.x().fieldN('power')
)
.render()
md`# #2: Using "await" function - upload csv files into observable and parse data
`
second_data = d3.csvParse(await FileAttachment("mc1-reports-data.csv").text())
second_data
vl.markPoint()
.data(second_data)
.encode(
vl.y().average('sewer_and_water'),
vl.x().fieldN('power')
)
.render()
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
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.
