Public
Edited
Feb 28, 2020
5 stars
Insert cell
Insert cell
import {vl} from '@vega/vega-lite-api'
Insert cell
d3 = require("d3-dsv@1")
Insert cell
Insert cell
csv_text ="quarter,population\nApr-10,100\nJul-10,110\nOct-10,150\nJan-11,90\nApr-11,120\nJul-11,130"
Insert cell
data = d3.csvParse(csv_text, d3.autoType)
Insert cell
Insert cell
vl.markLine()
.data(data)
.transform(vl.calculate("timeParse(datum.quarter, '%b-%y')").as("quarter_date"))
.encode(vl.x().fieldT("quarter_date").timeUnit("monthyear").title("Quarter"),
vl.y().fieldQ("population"))
.render()
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