28:null 29:["$","title",null,{"children":"Forecast of economic development | Lukas Schmoigl | Observable"}] 2e:T1c3f,view = { // const selectDate = vl // .selectInterval("selectDate") // .encodings("x"); const selectLegend = vl .selectPoint('selectLegend') .fields('Land') .toggle('event') .on('click') .bind('legend') .value(["Austria"]); // const text = vl.markText({ stroke: "black" }) // .transform( // vl.filter(selectDate), // vl.filter(selectLegend), // vl.calculate("max(datum.Jahr)-min(datum.Jahr)").as("length") // ) // .encode( // vl.x() // .value(200) // .axis({ // title: null, // domain: false, // labelAngle: 0, // labelPadding: 10, // minExtent: 25, // grid: false, // tickSource: false // }), // vl.y() // .value(0) // .axis({ // domain: false, // tickSource: false, // title: null, // labelBound: true, // labelPadding: 10, // minExtent: 50, // }), // vl.text().field("length"), // ) // .width(makeWidth(self.innerWidth)); const rect = vl.markRect({ clip: true, // strokeWidth: 10, // stroke: "lightgray", opacity: 0.2, fill: "lightgray", zindex: 0, }) .transform( vl.filter("datum.Prognose == 1"), vl.aggregate(vl.mean("Wert").as("Wert")).groupby("Jahr"), // vl.calculate("max(datum.Jahr)").as("max"), // vl.calculate("min(datum.Jahr)").as("min"), ) .encode( vl.x() .fieldN("Jahr") .axis(null) .scale({ padding: 0, }), // vl.x() // .fieldN("min"), // vl.x2() // .fieldN("max"), ) const dummyBars = vl.markBar({ stroke: "none", zindex: 1, padding: 0, // width: checkboxes.length == 1 ? 25 : null }) .transform( // vl.filter(selectDate), vl.filter(selectLegend), vl.calculate("max(datum.Jahr)-min(datum.Jahr)").as("length"), ) .encode( vl.x() .fieldN("Jahr") .axis({ title: null, domainColor: "black", domainWidth: 0.75, tickColor: "black", tickWIdth: 0.75, labelAngle: 0, labelPadding: 10, minExtent: 25, grid: false, // ticks: false, labelOverlap: true, labelSeparation: 2 }), vl.y() .fieldQ("Wert") .axis({ domain: false, ticks: false, grid: true, title: "Percentage changes from previous year", labelBound: true, labelPadding: 10, minExtent: 50, }), vl.fill() .value("transparent") .legend({ orient: "none", legendX: -75, legendY: -40, direction: "horizontal", title: null, values: [... new Set(inputData.map(d => d.Land))], }) .scale({ range: colorsDiscrete, domain: [... new Set(inputData.map(d => d.Land))], }), vl.xOffset() .fieldN("Land"), vl.tooltip([ {field: 'Land', title: 'Land'}, {field: 'WertTT', title: 'Wert', format: ",.1%" }, ]), ) .width(self.innerWidth > 1200 ? 900 : makeWidth(width)/1.33); const bars = vl.markBar({ stroke: "none", zindex: 1, // width: checkboxes.length == 1 ? 25 : null }) .transform( // vl.filter(selectDate), vl.filter(selectLegend), vl.calculate("max(datum.Jahr)-min(datum.Jahr)").as("length"), ) .encode( vl.x() .fieldN("Jahr") .axis({ title: null, domainColor: "black", domainWidth: 0.75, tickColor: "black", tickWIdth: 0.75, labelAngle: 0, labelPadding: 10, minExtent: 25, grid: false, labelOverlap: true, labelSeparation: 2 }), vl.y() .fieldQ("Wert") .axis(null), vl.fill() .fieldN("Land") .legend({ orient: "none", legendX: -75, legendY: -40, direction: "horizontal", title: null, values: [... new Set(data.map(d => d.Land))], }) .scale({ range: colorsDiscrete, domain: [... new Set(data.map(d => d.Land))], }), vl.xOffset() .fieldN("Land"), vl.tooltip([ {field: 'Land', title: 'Country'}, {field: 'WertTT', title: 'Value', format: ",.1%" }, ]), ) .width(self.innerWidth > 1200 ? 900 : makeWidth(width)/1.33); // const areas = vl.markArea({fill: "lightgray"}) // .params(selectDate) // .transform( // vl.filter("datum.Land == 'Österreich'"), // // vl.calculate("0").as("Wert"), // ) // .encode( // vl.x() // .fieldN("Jahr") // .axis({ // title: null, // domain: false, // labelAngle: 0, // labelPadding: 10, // minExtent: 25, // grid: false, // // tickSource: false, // labelOverlap: true, // labelSeparation: 2 // }), // vl.y() // .fieldQ("Wert") // .axis({ // domain: false, // tickSource: false, // labelSource: false, // title: null, // labelBound: true, // labelPadding: 10, // minExtent: 50, // }), // ) // .width(makeWidth(width)) // .height(40); return vl.layer(bars.params(selectLegend), vl.layer(dummyBars, rect)) .resolve({ // legend: {fill: "independent", color: "independent", size: "independent", opacity: "independent", shape: "independent" }, scale: {x: "independent", y: "independent"}, // axis: {x: "independent", y: "independent"}, }) .data( data .map(d => ({...d, WertTT: Number(d.Wert) / 100 })) .filter(d => d.Jahr >= Math.min(...slider) && d.Jahr <= Math.max(...slider)) // .filter(d => checkboxes.includes(d.Land)) ) .title({ text: " ", subtitle: checkboxes.includes("Austria") && checkboxes.length == 1 ? "Source: WIFO Economic Outlook." : "Source: BEA, Eurostat, Statistics Austria, WIFO economic forecast.", orient: "bottom", anchor: "start" }) .config({ padding: { "left": 10, "top": 20, "right": 10, "bottom": 10 }, view: {stroke: null}, font: "FFDaxPro", axis: { labelFontSize: 14, titleFontSize: 14, titleFontWeight: "normal", }, legend: { labelFontSize: 14, titleFontSize: 14, titleFontWeight: "normal", }, mark: { fontSize: 14 }, title: { fontSize: 16, subtitleFontSize: 14 }, background: "transparent", locale: {number: { decimal: ".", thousands: "", format: ',.0f', grouping: [3] }} }) .render({renderer: 'svg'}); }2f:[] 2c:{"id":"13d851e2ad4b1a02","slug":"fg1_en","title":"Forecast of economic development","thumbnail":"4362c092bd89e0e9de30eb747279fa21024d3aed99309e22c1f310d34314142f","access_level":"public","create_time":"$D2023-11-21T10:18:45.367Z","update_time":"$D2025-08-21T11:13:43.775Z","view_time":null,"first_public_time":"$D2023-11-21T10:18:45.367Z","has_unpublished_edits":null,"fork":{"id":"8faf6ad0dad62e6b","slug":"fg1_de","title":"Prognose der Wirtschaftsentwicklung","owner":{"id":"5899a57f37c1c5bd","login":"schmoigl","name":"Lukas Schmoigl"}},"stars":0,"starred":false,"owner":{"type":"team","id":"5899a57f37c1c5bd","login":"schmoigl","name":"Lukas Schmoigl","avatar_url":"https://avatars-next.observableusercontent.com/a18b68154bac49cfe040df035c2eefd5f4ab5d461e944fe6b8953c00703e3960","tier":"starter_2024"},"version":568,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"2348f18d0d304950","login":"schmoigl","name":"Lukas Schmoigl","avatar_url":"https://avatars-next.observableusercontent.com/a18b68154bac49cfe040df035c2eefd5f4ab5d461e944fe6b8953c00703e3960","tier":null},{"type":"individual","id":"1d9fbc79aae6136b","login":"wirtschaftsforschungsinstitut-wien","name":"WIFO","avatar_url":"https://avatars-next.observableusercontent.com/1658f25280813588b3c66e1286031995e225c988fe8d20b53767200c3f385a9f","tier":null}],"members":[{"type":"individual","id":"2348f18d0d304950","login":"schmoigl","name":"Lukas Schmoigl","avatar_url":"https://avatars-next.observableusercontent.com/a18b68154bac49cfe040df035c2eefd5f4ab5d461e944fe6b8953c00703e3960","tier":null,"role":"editor"}],"comments":[{"id":"f1aa3366632b11df","reply_to_id":null,"content":"Legende: Euro area (ohne Bindestrich)","create_time":"$D2024-03-06T13:34:00.787Z","update_time":"$D2024-03-06T13:42:12.857Z","resolved":true,"user":{"type":"individual","id":"990d035a7adcbcb4","login":"earnold","name":"EArnold","avatar_url":"https://avatars-next.observableusercontent.com/936f94c144a38d248b9d39c65ed5b01136ec8b053a08d7a8b16b1fdf46776a60","tier":null}},{"id":"b6b95df85dec316b","reply_to_id":null,"content":"Untertitel: GDP, volume","create_time":"$D2024-03-06T13:34:03.168Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"990d035a7adcbcb4","login":"earnold","name":"EArnold","avatar_url":"https://avatars-next.observableusercontent.com/936f94c144a38d248b9d39c65ed5b01136ec8b053a08d7a8b16b1fdf46776a60","tier":null}},{"id":"39d1bcd5a78f4a51","reply_to_id":"f1aa3366632b11df","content":"Achsenbeschriftung: Percentage changes from previous year","create_time":"$D2024-03-06T13:41:54.009Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"990d035a7adcbcb4","login":"earnold","name":"EArnold","avatar_url":"https://avatars-next.observableusercontent.com/936f94c144a38d248b9d39c65ed5b01136ec8b053a08d7a8b16b1fdf46776a60","tier":null}},{"id":"64a20ddc85f1477b","reply_to_id":"f1aa3366632b11df","content":"Source: Statistics Austria, WIFO Economic Outlook.","create_time":"$D2024-03-06T13:41:58.656Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"990d035a7adcbcb4","login":"earnold","name":"EArnold","avatar_url":"https://avatars-next.observableusercontent.com/936f94c144a38d248b9d39c65ed5b01136ec8b053a08d7a8b16b1fdf46776a60","tier":null}},{"id":"c8a2996cf3744e5b","reply_to_id":"f1aa3366632b11df","content":"rechte Skala entfernen","create_time":"$D2024-03-06T13:42:03.623Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"990d035a7adcbcb4","login":"earnold","name":"EArnold","avatar_url":"https://avatars-next.observableusercontent.com/936f94c144a38d248b9d39c65ed5b01136ec8b053a08d7a8b16b1fdf46776a60","tier":null}}],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"5d801b34d3a2eb89","slug":"fg-webgrafiken","title":"FG-Webgrafiken","owner":{"id":"5899a57f37c1c5bd","login":"schmoigl","name":"Lukas Schmoigl"}},"type":"notebook","body":{"title":"Forecast of economic development","cells":[{"id":0,"value":"\n# Forecast of economic development\n## FG1 web chart\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":563,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":538,"value":"title = htl.html`\n

Forecast of economic development

GDP, volume

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":165,"value":"viewof slider = rangeSlider({\n min: Math.min(... data.map(d => d.Jahr)),\n max: Math.max(... data.map(d => d.Jahr)),\n step: 1,\n value: [Math.max(... data.map(d => d.Jahr))-15, Math.max(... data.map(d => d.Jahr))],\n // width: makeWidth(self.innerWidth),\n // format: d => formatDate(d3.timeHour.offset(start, d)),\n title: '',\n separator: ' → ',\n color: \"#2d5b5e\",\n // theme: theme_Retro1,\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"$2e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"---\n\n\n# Appendix\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":480,"value":"data = inputData\n .map(d => ({...d, Land: d.Land == \"Österreich\" ? \"Austria\" : d.Land }))\n .map(d => ({...d, Land: d.Land == \"Deutschland\" ? \"Germany\" : d.Land }))\n .map(d => ({...d, Land: d.Land == \"Euro-Raum\" ? \"Euro area\" : d.Land }))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"inputData = d3.csv(\"https://raw.githubusercontent.com/WIFOat/fg_data/main/data_fg1.csv\", d3.autoType) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"colorsDiscrete = [\n // \"black\",\n \"#559bd5\",\n \"#72bb6f\",\n \"#559e8f\",\n \"#12a7e7\",\n \"#96b428\",\n \"#c3423f\",\n \"#f3d039\",\n // \"lightgray\",\n // \"gray\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"import {yamultiselect} from '@saneef/yet-another-multi-select'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"import { rangeSlider as rangeSlider } from '@mootari/range-slider'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"import {vl} from '@vega/vega-lite-api-v5'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":119,"value":"makeWidth = function(inputWidth) {\n if (inputWidth<600) {\n return Math.sqrt(inputWidth)*16\n }\n if (inputWidth<750) {\n return Math.sqrt(inputWidth)*18\n }\n if (inputWidth<900) {\n return Math.sqrt(inputWidth)*20\n }\n if (inputWidth<1050) {\n return Math.sqrt(inputWidth)*22\n }\n if (inputWidth<1200) {\n return Math.sqrt(inputWidth)*24\n }\n else {\n return Math.sqrt(inputWidth)*24\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":444,"value":"import {theme_Retro1} from '@mootari/range-slider'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":337,"value":"viewof checkboxes = Inputs.checkbox([... new Set(data.map(d => d.Land))], {label: null, value: [\"Austria\"]})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2f","stdlib":"1","titling":"auto"}} 2d:"$2c:body"