Public
Edited
Nov 6, 2023
viewof wardsView = embed(
{
$schema: "https://vega.github.io/schema/vega-lite/v3.json",
mode: "canvas",
width: width - 250,
height: 800,
title: {
text: "MTO Calls and Issues",
subtitle: `Jan 2023-Oct 2023, Total: ${totalCount}`,
anchor: "middle",
fontSize: 18,
font: "Source Serif Pro",
subtitleFont: "Source Serif Pro",
subtitleFontSize: 14,
fontWeight: 300,
offset: 15
},
config: {
background: "white",
padding: 20,
legend: {
titleFont: "Source Serif Pro",
titleFontSize: 14,
titleFontWeight: 400,
labelFont: "Source Serif Pro",
labelFontSize: 13,
labelFontWeight: 300
},
axis: {
titleFont: "Source Serif Pro",
titleFontSize: 14,
titleFontWeight: 400,
labelFont: "Source Serif Pro",
labelFontSize: 13,
labelFontWeight: 300,
tickColor: "lightgray"
},
style: {
cell: {
stroke: "transparent"
}
},
text: {
font: "Source Serif Pro"
}
},
layer: [
{
data: {
values: wards.features
},
projection: {
type: "mercator"
},
mark: {
type: "geoshape",
stroke: "#aaa",
strokeWidth: 1
},
encoding: {
color: {
field: "properties.calls_issues",
title: "# Calls, Issues",
type: "quantitative",
scale: { range: ["rgba(0,114,188,0)", "rgba(0,114,188,0.9)"] }
}
}
},
{
data: {
values: wardCentroids
},
mark: { type: "text", fontSize: 20 },
projection: {
type: "mercator"
},
encoding: {
longitude: { field: "lon", type: "quantitative" },
latitude: { field: "lat", type: "quantitative" },
text: {
field: "ward",
type: "nominal"
}
}
}
]
},
{ actions: true, scaleFactor: 2 }
)
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.
