Data Scientist at the Austrian Institute for Economic Research and Lecturer at the Vienna University of Economics and Business
viewMini = {
const mapShape = vl.topojson(gemeinden)
.feature("STATISTIK_AUSTRIA_GEM_20200101Polygon")
const mapShape2 = vl.topojson(gemeinden)
.feature("aut")
const select = vl.selectPoint("select")
.fields("name")
.on("click")
.value("madeUp") // search[0].name
.clear("none")
.toggle("event");
const selectDate = vl.selectInterval("selectDate")
.encodings("x"); // .value({x: [0, 120000], y: [0, 10]})
const foreign = vl.data(mergeData)
.key("RegionCode")
.fields(
"RegionCode",
"Variable",
"Value",
"OrValue",
"name",
"Defizit"
);
const map = vl.markGeoshape({
stroke: "white",
strokeWidth: 0.66,
clip: false
})
.transform(
vl.lookup("id").from(foreign),
)
.encode(
vl.color().fieldQ("Value")
.scale({
range: colors,
type: button,
})
.legend(null)
);
const mapTooltip = vl.markGeoshape({
fill: "transparent",
clip: false
})
.transform(
vl.lookup("id").from(foreign),
)
.params(select)
.encode(
vl.tooltip([
{field: "name", title: "Gemeinde"},
{field: "OrValue", title: "Defizit", format: select_variable != "N-Defizit je Hektar Landfläche" ? ",.0f" : ",.1f"}
]),
vl.stroke()
.if(select, vl.value("black"))
.value("transparent"),
vl.strokeWidth()
.if(select, vl.value(1.2))
.value(0),
);
const background = vl.markGeoshape({
stroke: "black",
strokeWidth: 3,
fill: "transparent",
clip: false
});
const mapZero = vl.markGeoshape({
stroke: "white",
strokeWidth: 0.66,
clip: false,
fill: "lightgray"
})
const backgroundWhite = vl.markGeoshape({
stroke: "white",
strokeWidth: 2.2,
fill: "transparent",
clip: false
})
.data(mapShape2);
const backgroundBlack = vl.markGeoshape({
stroke: "black",
strokeWidth: 0.8,
fill: "transparent",
clip: false
})
.data(mapShape2);
const chartMap = vl.layer(background, map, mapTooltip) // backgroundBlack
.data(mapShape)
.project(
vl.projection("conicEquidistant")
.rotate([-13, 0.0])
.center([13.3457347, 47.6964719])
.parallels([35.0, 65.0])
);
return vl.vconcat(
// chartHist
// .height(10)
// .width(width > 1200 ? 1000 : width/1.19)
// .title({
// text: " ",
// subtitle: "Histogramm",
// align: "left",
// anchor: "start",
// }),
chartMap
.height(width > 800 ? 400 : 200)
.width(width > 1200 ? 900 : width/1.25)
)
.data(mergeData)
.resolve({
legend: {fill: "independent", color: "independent"},
scale: {fill: "independent", color: "independent", domain: "independent"},
axis: {y: "independent", x: "independent", domain: "independent"},
})
.config({
view: {stroke: null},
background: "transparent",
font: "FFDaxPro",
axis: {
labelFontSize: 14,
titleFontSize: 14,
titleFontWeight: "normal",
},
legend: {
labelFontSize: 14,
titleFontSize: 14,
titleFontWeight: "normal",
},
mark: {
fontSize: 14
},
title: {
fontSize: 16,
subtitleFontSize: 14,
},
concat: { spacing: 10 },
locale: {number: {
decimal: ",",
thousands: ".",
format: ",.0f",
grouping: [3]
}}
})
.title({
text: " ",
subtitle: width > 800 ?
["Q: WIFO-Berechnungen nach der Richtline für die sachgerechte Düngung (BMLRT, 2022) und Agrarstrukturerhebung 2020 (Statistik Austria, 2022)."] :
["Q: WIFO-Berechnungen nach der Richtline für",
" die sachgerechte Düngung (BMLRT, 2022) und",
"Agrarstrukturerhebung 2020 (Statistik Austria, 2022)."],
orient: "bottom",
anchor: "start"
})
.render({renderer: "svg"});
}
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.
