The avatar for @sfu-iat355
IAT355
Published
Spring2019
Edited
Sep 11, 2019
8 forks
1 star
Spring2019
Vancouver mapping 102IAT355: Do you have all the data you need? Working with data in d3 and VegaIAT355: Do you have all the data you need? Working with data in d3 and Vega2018 Vancouver Crime DataPassing Signals Between CellsIAT355: Do you have all the data you need? Working with data in d3 and VegaBuilding Up a Data StoryEasing into Vega from Vega-LiteInteractionInteraction 2Vega-Lite: Exploring Visual Forms.Data Inspection and Cleaning
Getting Started with Data
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
d3 = require("d3@5")
Insert cell
Insert cell
Cereals = d3.csv("https://gist.githubusercontent.com/SFU-IAT355/87a05902375cb5523d31a6197d607cb3/raw/da6a2294b0ad2fe6bec5759213fefb302c7af2b2/CerealsVEGAtutorial.csv")
Insert cell
Insert cell
Insert cell
VegaLite = require('@observablehq/vega-lite')
Insert cell
Insert cell
Insert cell
VegaLite({
data: {values: Cereals},
mark: "bar",
encoding: {
y: {field: "name", type: "nominal"},
x: {field: "protein", type: "quantitative"}
}
})
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Insert cell
Insert cell
Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

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