Published
Edited
Jun 14, 2020
3 forks
Insert cell
Insert cell
vegalite = require("@observablehq/vega-lite")
Insert cell
Insert cell
vegalite({
data: {
values: [
{},
{},
{},
{}
]
}
})
Insert cell
vegalite({
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
}
})
Insert cell
Insert cell
vegalite({
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle"
})
Insert cell
Insert cell
vegalite({
width: 900,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle"
})
Insert cell
vegalite({
width: 900,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle",
encoding: {
}
})
Insert cell
Insert cell
vegalite({
width: 900,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle",
encoding: {
x: {
field: "time",
type: "temporal"
}
}
})
Insert cell
Insert cell
vegalite({
width: 900,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle",
encoding: {
x: {
field: "time",
type: "temporal"
},
y: {
field: "mag",
type: "quantitative"
}
}
})
Insert cell
Insert cell
vegalite({
width: 600,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle",
encoding: {
x: {
field: "time",
type: "temporal"
},
y: {
field: "mag",
type: "quantitative"
},
color: {
field: "magType",
type: "nominal"
}
}
})
Insert cell
Insert cell
vegalite({
width: 600,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle",
encoding: {
x: {
field: "time",
type: "temporal"
},
y: {
field: "mag",
type: "quantitative"
},
color: {
field: "depth",
type: "quantitative"
}
}
})
Insert cell
vegalite({
width: 600,
height: 400,
data: {
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv"
},
mark: "circle",
encoding: {
x: {
field: "longitude",
type: "quantitative"
},
y: {
field: "latitude",
type: "quantitative"
},
color: {
field: "depth",
type: "quantitative"
},
size: {
field: "mag",
type: "quantitative"
}
}
})
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