29:null 2a:["$","title",null,{"children":"Baseline plots normalized | Pavlos Sermpezis | Observable"}] 2f:T744,### Overview This page (by [e-ResLab Aegean](https://reslab.aegean.gr/)) provides visualizations related to employment metrics in European countries over time (such as total or youth (un)employment rates, part-time/temporary/involuntary employment, NEET, etc.). Data and visualizations are provided both at the _country_ and _regional (NUTS)_ levels. We also present the same data in searchable tables. Data and charts can also be downloaded as csv and png files, respectively. ### How to use the visualizations tool The visualizations charts show how the value of a selected variable, e.g., unemployment, (y-axis) changes over time (x-axis) for one or more countries or NUTS regions (different lines/curves). The visualizations can be adapted, by selecting: - **Type of variables:** Absolute values (i.e., population in thousands) or Rates (i.e., percentages, %) for each variable - **Variables:** The variable to visualize (employment, unemployment, NEET, etc.) - **Countries/NUTS:** The set of countries or regions (NUTS) can be selected to be visualized; they appear as different lines in the same plot (and hovering the mouse over a line, the line is highlighted and a pop up appears with the country/region name) - **Normalization/Year:** An option to normalize values (available only for the "Absolute values" option), where -if selected- the values for each year are normalized with the value of a reference year, i.e., normalized_value = value / value_at_reference_year * 100%. Different reference years can be selected, or normalization can be deselected. By default this option is not selected. For example, if 2008 is selected as the reference year, and the employment for a region at 2008 and 2009 is 50 (thousands) and 40 (thousands), respectively, then the normalized value appearing in the graph for 2009 will be 40/50 = 0.8 = 80%. 30:T687,instructions_text = instructions_button%2 ? md` The visualizations charts show how the value of a selected variable, e.g., unemployment, (y-axis) changes over time (x-axis) for one or more countries or NUTS regions (different lines/curves). The visualizations can be adapted, by selecting: - **Type of variables:** Absolute values (i.e., population in thousands) or Rates (i.e., percentages, %) for each variable - **Variables:** The variable to visualize (employment, unemployment, NEET, etc.) - **Countries/NUTS:** The set of countries or regions (NUTS) can be selected to be visualized; they appear as different lines in the same plot (and hovering the mouse over a line, the line is highlighted and a pop up appears with the country/region name) - **Normalization/Year:** An option to normalize values (available only for the "Absolute values" option), where -if selected- the values for each year are normalized with the value of a reference year, i.e., normalized_value = value / value_at_reference_year * 100%. Different reference years can be selected, or normalization can be deselected. By default this option is not selected. For example, if 2008 is selected as the reference year, and the employment for a region at 2008 and 2009 is 50 (thousands) and 40 (thousands), respectively, then the normalized value appearing in the graph for 2009 will be 40/50 = 0.8 = 80%. #### A note on rates The rates are calculated differently for each variable, i.e., each rate has a different physical meaning. Details are provided in the table below. Also, each variable (population or rates) refers only to people within the age group noted in the table below. ` : md``31:T426,definitions_rates = md` Variable | Age group | Rate calculation ---|-----|--- Total employment rate (%) | 15-64 | Employed population over the total population Youth employment rate (%) | 15-29 | Employed population over the total population Unemployment rate (%) | 15-74 | Unemployed population over the sum of employed and unemployed population (i.e., active population people) Youth unemployment rate (%) | 15-29 | Unemployed population over the sum of employed and unemployed population (i.e., active population people) NEET rate (%) | 15-29 | NEET population over the total population Involuntary part-time employment rate (%) | 15-64 | Involuntary part-time employed population over part-time employed population Involuntary temporary employment rate (%) | | Employment in ... sector rate (%) | 15-64 | Employed population in this sector over total employed population Skill level (ISCO) | 15+ | International Standard Classification of Occupations (ISCO) Youth skill level (ISCO) | 15-29 | International Standard Classification of Occupations (ISCO) `32:T539,empl_sector_data_countries = { // DEPRECATED - previous implementation for radar plots data; now incorporated as input argument in sector_radar_chart function /* const props = ["geo", "year", // "Employment in Mining and quarrying & manufacturing rate (%)", // "Employment in Wholesale and retail trade rate (%)", // "Employment in Transportation and storage rate (%)", // "Employment in Accommodation and food service activities rate (%)", // "Employment in Human health and social work activities rate (%)", "Employment in Agriculture rate (%)", "Employment in Mining, quarrying & power production rate (%)", "Employment in Manufacturing rate (%)", "Employment in Construction rate (%)", "Employment in Commerce rate (%)", "Employment in Transportation & storage rate (%)", "Employment in Accommodation & catering rate (%)", "Employment in Knowledge economy rate (%)", "Employment in Public administration, education & healthcare rate (%)", "Employment in Other services rate (%)" ] return raw_data_new_countries.map(e => pick(e, props)) */ }33:Tbf1,COMPRESSED_COLUMN_NAMES = { const reverse_dict = Object({ 'Employment in Accommodation & catering': 'c56', 'Employment in Accommodation & catering rate (%)': 'c55', 'Employment in Accommodation & catering rate (%)_y': 'c54', 'Employment in Agriculture': 'c53', 'Employment in Agriculture rate (%)': 'c52', 'Employment in Agriculture rate (%)_y': 'c51', 'Employment in Commerce': 'c50', 'Employment in Commerce rate (%)': 'c49', 'Employment in Commerce rate (%)_y': 'c48', 'Employment in Construction': 'c47', 'Employment in Construction rate (%)': 'c46', 'Employment in Construction rate (%)_y': 'c45', 'Employment in Knowledge economy': 'c44', 'Employment in Knowledge economy rate (%)': 'c43', 'Employment in Knowledge economy rate (%)_y': 'c42', 'Employment in Manufacturing': 'c41', 'Employment in Manufacturing rate (%)': 'c40', 'Employment in Manufacturing rate (%)_y': 'c39', 'Employment in Mining, quarrying & power production': 'c38', 'Employment in Mining, quarrying & power production rate (%)': 'c37', 'Employment in Mining, quarrying & power production rate (%)_y': 'c36', 'Employment in Other services': 'c35', 'Employment in Other services rate (%)': 'c34', 'Employment in Other services rate (%)_y': 'c33', 'Employment in Public administration, education & healthcare': 'c32', 'Employment in Public administration, education & healthcare rate (%)': 'c31', 'Employment in Public administration, education & healthcare rate (%)_y': 'c30', 'Employment in Transportation & storage': 'c29', 'Employment in Transportation & storage rate (%)': 'c28', 'Employment in Transportation & storage rate (%)_y': 'c27', 'FCA rate (%)': 'c26', 'Involuntary part-time employment rate (%)': 'c25', 'Involuntary temporary employment rate (%)': 'c24', 'NEET': 'c23', 'NEET rate (%)': 'c22', 'Part-time employment': 'c21', 'Skill level: ISCO 1-3 (High skilled)': 'c20', 'Skill level: ISCO 4-5 (Medium non manual skilled)': 'c19', 'Skill level: ISCO 6-8 (Medium manual skilled)': 'c18', 'Skill level: ISCO 9 (Low skilled)': 'c17', 'Total employment': 'c16', 'Total employment rate (%)': 'c15', 'Total employment rate (%)_y': 'c14', 'Unemployment': 'c13', 'Unemployment rate (%)': 'c12', 'Unemployment rate (%)_y': 'c11', 'Youth Long-Term unemployment rate (%)': 'c10', 'Youth employment': 'c9', 'Youth employment rate (%)': 'c8', 'Youth skill level: ISCO 1-3 (High skilled)': 'c7', 'Youth skill level: ISCO 4-5 (Medium non manual skilled)': 'c6', 'Youth skill level: ISCO 6-8 (Medium manual skilled)': 'c5', 'Youth skill level: ISCO 9 (Low skilled)': 'c4', 'Youth unemployment': 'c3', 'Youth unemployment rate (%)': 'c2', 'geo': 'c1', 'year': 'c0' }) var new_dict = {}; for (var key in reverse_dict) { new_dict[reverse_dict[key]] = key; } return new_dict }34:T29c8,raw_data_new1 = { /* let B42 = await fetch("https://geo-api.aegean.gr/api/table/b42_empl_data_rate").then((response) => response.json()) .then(d => d.filter(o => o.period == "A") .map(o => ({geo: o.nuts_id, year: o.year, // "NEET rate (%)": o.neets_rate, "Total employment rate (%)": o.employment_rate, "Unemployment rate (%)": o.unemployment_rate, // "Employment in Mining and quarrying & manufacturing rate (%)": o.bc_perc_empl, // "Employment in Wholesale and retail trade rate (%)": o.g_perc_empl, // "Employment in Transportation and storage rate (%)": o.h_perc_empl, // "Employment in Accommodation and food service activities rate (%)": o.i_perc_empl, // "Employment in Human health and social work activities rate (%)": o.q_perc_empl, "Employment in Agriculture rate (%)": o.a_perc_empl, "Employment in Mining, quarrying & power production rate (%)": o.bde_perc_empl, "Employment in Manufacturing rate (%)": o.c_perc_empl, "Employment in Construction rate (%)": o.f_perc_empl, "Employment in Commerce rate (%)": o.g_perc_empl, "Employment in Transportation & storage rate (%)": o.h_perc_empl, "Employment in Accommodation & catering rate (%)": o.i_perc_empl, "Employment in Knowledge economy rate (%)": o.jklmnu_perc_empl, "Employment in Public administration, education & healthcare rate (%)": o.opq_perc_empl, "Employment in Other services rate (%)": o.rst_perc_empl, })) ) let B41 = await fetch("https://geo-api.aegean.gr/api/table/b41_empl_data_abs").then((response) => response.json()) .then(d => d.filter(o => o.period == "A") .map(o => ({geo: o.nuts_id, year: o.year, // "NEET": o.neets, "Total employment": o.employment, "Unemployment": o.unemployment, // "Employment in Mining and quarrying & manufacturing": o.sector_bc, // "Employment in Wholesale and retail trade": o.sector_g, // "Employment in Transportation and storage": o.sector_h, // "Employment in Accommodation and food service activities": o.sector_i, // "Employment in Human health and social work activities": o.sector_q, "Employment in Agriculture": o.sector_a, "Employment in Mining, quarrying & power production": o.sector_bde, "Employment in Manufacturing": o.sector_c, "Employment in Construction": o.sector_f, "Employment in Commerce": o.sector_g, "Employment in Transportation & storage": o.sector_h, "Employment in Accommodation & catering": o.sector_i, "Employment in Knowledge economy": o.sector_jklmnu, "Employment in Public administration, education & healthcare": o.sector_opq, "Employment in Other services": o.sector_rst, })) ) // let B63 = await fetch("https://geo-api.aegean.gr/api/table/b63_neets_full").then((response) => response.json()) // .then(d => d.filter(o => o.period == "A") // .map(o => ({geo: o.nuts_id, // year: o.year, // "NEETs": o.neets, // "NEETs rate (%)": o.neets_pop_prc, // "Youth employment": o.employment, // "Youth employment rate (%)": o.employment_pop_prc // })) // ) let B63_total; try { B63_total = await fetch("https://geo-api.aegean.gr/api/table/b63_neets_full").then((response) => response.json()) .then(d => d.filter(o => (o.period == "A") & (o.sex == "T")) .map(o => ({geo: o.nuts_id, year: o.year, "NEET": o.neets, "NEET rate (%)": o.neets_pop_prc, "Youth employment": o.employment, "Youth employment rate (%)": o.employment_pop_prc, "Youth unemployment": o.unemployment, "Youth unemployment rate (%)": o.unemployment_active_prc, "Youth Long-Term unemployment rate (%)": o.lt_unemployment_rate }))) } catch (error) { B63_total = [] } // let B63_total = await fetch("https://geo-api.aegean.gr/api/table/b63_neets_full").then((response) => response.json()) // .then(d => d.filter(o => (o.period == "A") & (o.sex == "T")) // .map(o => ({geo: o.nuts_id, // year: o.year, // "NEET": o.neets, // "NEET rate (%)": o.neets_pop_prc, // "Youth employment": o.employment, // "Youth employment rate (%)": o.employment_pop_prc, // "Youth unemployment": o.unemployment, // "Youth unemployment rate (%)": o.unemployment_active_prc, // "Youth Long-Term unemployment rate (%)": o.lt_unemployment_rate // }))) // let B63_male = await fetch("https://geo-api.aegean.gr/api/table/b63_neets_full").then((response) => response.json()) // .then(d => d.filter(o => (o.period == "A") & (o.sex == "M")) // .map(o => ({geo: o.nuts_id, // year: o.year, // "NEETs - only Male": o.neets, // "NEETs rate (%) - only Male": o.neets_pop_prc, // "Youth employment - only Male": o.employment, // "Youth employment rate (%) - only Male": o.employment_pop_prc, // "Youth Long-Term unemployment rate (%) - only Male": o.lt_unemployment_rate // }))) // let B63_female = await fetch("https://geo-api.aegean.gr/api/table/b63_neets_full").then((response) => response.json()) // .then(d => d.filter(o => (o.period == "A") & (o.sex == "F")) // .map(o => ({geo: o.nuts_id, // year: o.year, // "NEETs - only Female": o.neets, // "NEETs rate (%) - only Female": o.neets_pop_prc, // "Youth employment - only Female": o.employment, // "Youth employment rate (%) - only Female": o.employment_pop_prc, // "Youth Long-Term unemployment rate (%) - only Female": o.lt_unemployment_rate // }))) // let C66 = await fetch("https://geo-api.aegean.gr/api/table/c66_neets_unemployment_rate").then((response) => response.json()) // .then(d => d.filter(o => o.freq) // .map(o => ({geo: o.geo, // year: parseInt(o.time_period), // "Youth unemployment rate (%)": o.value, // }))); // let C67 = await fetch("https://geo-api.aegean.gr/api/table/c67_neets_unemployment").then((response) => response.json()) // .then(d => d.filter(o => o.freq) // .map(o => ({geo: o.geo, // year: parseInt(o.time_period), // "Youth unemployment": o.value, // }))); let C03 = await fetch("https://geo-api.aegean.gr/api/table/c03_ptime_empl").then((response) => response.json()) .then(d => d.filter(o => (o.freq == "A") & (o.sex == "T") & (o.worktime == "PT")) .map(o => ({geo: o.geo, year: parseInt(o.time_period), "Part-time employment": o.value, })) ); let C16 = await fetch("https://geo-api.aegean.gr/api/table/c16_invol_ptime_empl").then((response) => response.json()) .then(d => d.filter(o => (o.freq == "A") & (o.sex == "T")) .map(o => ({geo: o.geo, year: parseInt(o.time_period), "Involuntary part-time employment rate (%)": o.value, }))); let C15 = await fetch("https://geo-api.aegean.gr/api/table/c15_invol_temp_empl").then((response) => response.json()) .then(d => d.filter(o => (o.freq == "A") & (o.sex == "T")) .map(o => ({geo: o.geo, year: parseInt(o.time_period), "Involuntary temporary employment rate (%)": o.value, }))); let B53 = await fetch("https://geo-api.aegean.gr/api/table/b53_vfca").then((response) => response.json()) .then(d => d.map(o => ({ geo: o.nuts_id, year: o.year, "FCA rate (%)": Math.round(10* 100*o.fca_epl)/10 //100* o.FCA }))) let B54 = await fetch("https://geo-api.aegean.gr/api/table/b54_isco").then((response) => response.json()) .then(d => d.map(o => ({ geo: o.nuts_id, year: parseInt(o.year), skill: o.isco08_1d, age: o.age, value: o.value }))) let B55 = await fetch("https://geo-api.aegean.gr/api/table/b55_Isco_sums").then((response) => response.json()) .then(d => d.map(o => ({ geo: o.country, year: parseInt(o.year), skill: o.isco08_1d, age: o.age, value: o.value }))) let B54_55_per_skill = [...format_skills_table(B54), ...format_skills_table(B55)] let final_data = merge_arrays(B42, B41) final_data = merge_arrays(final_data, B63_total) // final_data = merge_arrays(final_data, B63_male) // final_data = merge_arrays(final_data, B63_female) // final_data = merge_arrays(final_data, C66) // final_data = merge_arrays(final_data, C67) final_data = merge_arrays(final_data, C03) final_data = merge_arrays(final_data, C15) final_data = merge_arrays(final_data, C16) final_data = merge_arrays(final_data, B53) final_data = merge_arrays(final_data, B54_55_per_skill) final_data = sort_by_year(final_data) final_data = final_data.filter(o=> !(["AL","ME", "MK", "RS", "TR", "CH", "IS", "LI", "NO", "UK"].includes(o.geo.slice(0,2)))); final_data = final_data.filter(o=> !(["ES63","ES64", "FRY1", "FRY2", "FRY3", "FRY4", "FRY5"].includes(o.geo.slice(0,4)))); */ // let final_data = await fetch("https://geo-api.aegean.gr/api/data_observable").then((response) => response.json()) // .then(e => e.map(ee => renameKeys(ee,COMPRESSED_COLUMN_NAMES))) // final_data.forEach(item => item.geo = nutsID2Name(item.geo)) // return final_data }35:T85f,variables_countries = [ "Total employment", "Unemployment", "Youth employment", "Youth unemployment", // "Youth long-term unemployment", "NEET", "Part-time employment", // "Involuntary part-time employment", // "Temporary employment", // "Involuntary temporary employment", // "Employment in Mining and quarrying & manufacturing", // "Employment in Wholesale and retail trade", // "Employment in Transportation and storage", // "Employment in Accommodation and food service activities", // "Employment in Human health and social work activities", "Employment in Agriculture", "Employment in Mining, quarrying & power production", "Employment in Manufacturing", "Employment in Construction", "Employment in Commerce", "Employment in Transportation & storage", "Employment in Accommodation & catering", "Employment in Knowledge economy", "Employment in Public administration, education & healthcare", "Employment in Other services", // "Total employment rate (%)", "Unemployment rate (%)", "Youth employment rate (%)", "Youth unemployment rate (%)", "Youth Long-Term unemployment rate (%)", "NEET rate (%)", // "Part-time employment rate (%)", "Involuntary part-time employment rate (%)", // "Temporary employment rate (%)", "Involuntary temporary employment rate (%)", // "Employment in Mining and quarrying & manufacturing rate (%)", // "Employment in Wholesale and retail trade rate (%)", // "Employment in Transportation and storage rate (%)", // "Employment in Accommodation and food service activities rate (%)", // "Employment in Human health and social work activities rate (%)", // "Employment in High-risk sectors rate (%)", // "FCA rate (%)", "Skill level: ISCO 1-3 (High skilled)", "Skill level: ISCO 4-5 (Medium non manual skilled)", "Skill level: ISCO 6-8 (Medium manual skilled)", "Skill level: ISCO 9 (Low skilled)", "Youth skill level: ISCO 1-3 (High skilled)", "Youth skill level: ISCO 4-5 (Medium non manual skilled)", "Youth skill level: ISCO 6-8 (Medium manual skilled)", "Youth skill level: ISCO 9 (Low skilled)" ]36:T85b,variables_nuts = [ "Total employment", "Unemployment", "Youth employment", "Youth unemployment", // "Youth long-term unemployment", "NEET", "Part-time employment", // "Involuntary part-time employment", // "Temporary employment", // "Involuntary temporary employment", // "Employment in Mining and quarrying & manufacturing", // "Employment in Wholesale and retail trade", // "Employment in Transportation and storage", // "Employment in Accommodation and food service activities", // "Employment in Human health and social work activities", "Employment in Agriculture", "Employment in Mining, quarrying & power production", "Employment in Manufacturing", "Employment in Construction", "Employment in Commerce", "Employment in Transportation & storage", "Employment in Accommodation & catering", "Employment in Knowledge economy", "Employment in Public administration, education & healthcare", "Employment in Other services", // "Total employment rate (%)", "Unemployment rate (%)", "Youth employment rate (%)", "Youth unemployment rate (%)", "Youth Long-Term unemployment rate (%)", "NEET rate (%)", // "Part-time employment rate (%)", // "Involuntary part-time employment rate (%)", // "Temporary employment rate (%)", // "Involuntary temporary employment rate (%)", // "Employment in Mining and quarrying & manufacturing rate (%)", // "Employment in Wholesale and retail trade rate (%)", // "Employment in Transportation and storage rate (%)", // "Employment in Accommodation and food service activities rate (%)", // "Employment in Human health and social work activities rate (%)", // "Employment in High-risk sectors rate (%)", "FCA rate (%)", "Skill level: ISCO 1-3 (High skilled)", "Skill level: ISCO 4-5 (Medium non manual skilled)", "Skill level: ISCO 6-8 (Medium manual skilled)", "Skill level: ISCO 9 (Low skilled)", "Youth skill level: ISCO 1-3 (High skilled)", "Youth skill level: ISCO 4-5 (Medium non manual skilled)", "Youth skill level: ISCO 6-8 (Medium manual skilled)", "Youth skill level: ISCO 9 (Low skilled)" ]37:T634,format_skills_table = function(B) { let B_age_15_29 = B.filter(d => d.age == "15 - 29 years") let B_age_30plus = B.filter(d => d.age == "30+ years") let B_all_ages = merge_skill_arrays(B_age_15_29, B_age_30plus) const skill_levels = ["ISCO_1_3", "ISCO_4_5", "ISCO_6_8", "ISCO_9"] const skill_levels_names = ["ISCO 1-3 (High skilled)", "ISCO 4-5 (Medium non manual skilled)", "ISCO 6-8 (Medium manual skilled)", "ISCO 9 (Low skilled)"] let B_per_skill for (let i=0; i d.skill == skill_levels[i]).map( o => ({ geo: o.geo, year: o.year, ["Youth skill level: "+skill_levels_names[i]]: o.value })) B_per_skill = (B_per_skill === undefined) ? temp_array : merge_arrays(B_per_skill, temp_array) // temp_array = B_age_30plus.filter(d => d.skill == skill_levels[i]).map( o => ({ // geo: o.geo, // year: o.year, // ["Skill level: "+skill_levels_names[i]]: o.value // })) // B_per_skill = merge_arrays(B_per_skill, temp_array) temp_array = B_all_ages.filter(d => d.skill == skill_levels[i]).map( o => ({ geo: o.geo, year: o.year, ["Skill level: "+skill_levels_names[i]]: o.value })) B_per_skill = merge_arrays(B_per_skill, temp_array) } return B_per_skill }38:T615,function sector_radar_chart(current_geo, current_year, raw_data) { const props = ["Employment in Agriculture rate (%)", "Employment in Mining, quarrying & power production rate (%)", "Employment in Manufacturing rate (%)", "Employment in Construction rate (%)", "Employment in Commerce rate (%)", "Employment in Transportation & storage rate (%)", "Employment in Accommodation & catering rate (%)", "Employment in Knowledge economy rate (%)", "Employment in Public administration, education & healthcare rate (%)", "Employment in Other services rate (%)" ] let filtered_empl_sector_data = [] for (let i=0; i (e.year === current_year) && (e.geo === current_geo[i]))[0] filtered_empl_sector_data.push(pick(current_data,props)) } let new_array = [] for (let i=0; i o.year o.year.getFullYear())) const min_date2 = Math.min(...plot_data2.map(o => o.year.getFullYear())) const min_date = new Date(Math.min(min_date1,min_date2)-1,12,1) const max_date1 = Math.max(...plot_data1.map(o => o.year.getFullYear())) const max_date2 = Math.max(...plot_data2.map(o => o.year.getFullYear())) const max_date = new Date(Math.max(max_date1,max_date2)+1, 1, 1) const center_date = new Date ((min_date.getTime()+ (max_date.getTime()-min_date.getTime())*0.1)) const min_y1 = Math.min(...plot_data1.filter(o => !Number.isNaN(o.value)).map(o => o.value))*0.9 const min_y2 = Math.min(...plot_data2.filter(o => !Number.isNaN(o.value)).map(o => o.value))*0.9 const min_y = Math.min(min_y1,min_y2) const max_y1 = Math.max(...plot_data1.filter(o => !Number.isNaN(o.value)).map(o => o.value))*1.1 const max_y2 = Math.max(...plot_data2.filter(o => !Number.isNaN(o.value)).map(o => o.value))*1.1 const max_y = Math.max(max_y1,max_y2) return addTooltips( Plot.plot({ x: { grid: true, label: "Year", domain: [min_date, max_date] }, y: { grid: true, label: (y_label === undefined)? "Value (%)":y_label, domain: [min_y, max_y] }, style: { // padding: "10px", // color: "black", background: "url("+reslab_logo_url+")", backgroundSize: "25%", backgroundRepeat: "no-repeat", backgroundPosition: "95% 5%", }, marks: [ // Plot.ruleY([0], {"stroke": "grey"}), Plot.text([[center_date, max_y]], {text: ["━━━ "+name_variable1+"\n━○━ "+name_variable2], fontSize:15, fontWeight: "bold", textAnchor: "start" }), Plot.line(plot_data1, { x: "year", y: "value", z: "geo", sort: "year", stroke: "geo",//d => d.geo+" - "+nuts_names[d.geo], //"geo""geo", title: d => d.geo+" ("+name_variable1+")" //"geo" }), Plot.line(plot_data2, { x: "year", y: "value", z: "geo", sort: "year", stroke: "geo",//d => d.geo+" - "+nuts_names[d.geo], //"geo""geo", title: d => d.geo+" ("+name_variable2+")", //"geo" marker: true, strokeOpacity:0.3, }), ], color: { legend: true, range: myColorRange }, marginLeft: 100, }) ) }3a:T8b6,baseline_plot = function(plot_data, y_label, name_variable) { // plot_data = plot_data.filter(o => o.year o.year.getFullYear()))-1, 12, 1) const max_date = new Date(Math.max(...plot_data.map(o => o.year.getFullYear()))+1, 1, 1) const center_date = new Date ((min_date.getTime()+ (max_date.getTime()-min_date.getTime())*0.1)) // const min_y = Math.min(...plot_data.filter(o => !Number.isNaN(o.value)).map(o => o.value))*0.9 const min_y = Math.min(...plot_data.filter(o => o.value != null && Number.isFinite(o.value)).map(o => o.value))*0.9 // const max_y = Math.max(...plot_data.filter(o => !Number.isNaN(o.value)).map(o => o.value))*1.1 const max_y = Math.max(...plot_data.filter(o => o.value != null && Number.isFinite(o.value)).map(o => o.value))*1.1 return addTooltips( Plot.plot({ x: { grid: true, label: "Year", domain: [min_date, max_date] }, y: { grid: true, label: (y_label === undefined)? "Value (%)":y_label, domain: [min_y, max_y] }, style: { // padding: "10px", // color: "black", background: "url("+reslab_logo_url+")", backgroundSize: "25%", backgroundRepeat: "no-repeat", backgroundPosition: "95% 5%", }, marks: [ // Plot.ruleY([0], {"stroke": "grey"}), Plot.text([[center_date, max_y]], {text: [name_variable], fontSize:15, fontWeight: "bold", textAnchor: "start" }), Plot.line(plot_data, { x: "year", y: "value", z: "geo", sort: "year", stroke: "geo",//d => d.geo+" - "+nuts_names[d.geo], //"geo""geo", title: "geo",//d => d.geo+" - "+nuts_names[d.geo] //"geo" }), // Plot.frame(), // // Plot.image(reslab_logo), // Add, position and size your logo // Plot.image([reslab_logo_url], { // src: [reslab_logo_url], // frameAnchor: "top-right", // fillOpacity: 0.5, // dx: -70, // dy: 0, // width: 150 // }), // Add, position and size your logo ], color: { legend: true, range: myColorRange }, marginLeft: 100, }) ) }3b:[{"id":"2ba3e6fd7336516b9995bcf5fc6e8f52e252858c139c6faa9d486763bc57c216550d1f91485f5d2173b75be55a9ba7cdd7edbed8000245f3fdbf947d22a05ffa","href":"https://static.observableusercontent.com/files/2ba3e6fd7336516b9995bcf5fc6e8f52e252858c139c6faa9d486763bc57c216550d1f91485f5d2173b75be55a9ba7cdd7edbed8000245f3fdbf947d22a05ffa","name":"nuts.json","type":"application/json","lastModified":1667841912124.701,"size":19368},{"id":"cb99a23237d0aad61e7ea7bc50cade9bfe75053608895394324566560db785a9a55eae01615afe7c149714a2a2546af2ffcaab76ce6f6d0caff1db8f76d309c6","href":"https://static.observableusercontent.com/files/cb99a23237d0aad61e7ea7bc50cade9bfe75053608895394324566560db785a9a55eae01615afe7c149714a2a2546af2ffcaab76ce6f6d0caff1db8f76d309c6","name":"reslab_logo_transparent.png","type":"image/png","lastModified":1699002166931.109,"size":15581},{"id":"752ec86835a077d91722d5ee743abd908a08ded84bda6f0abe8f15ae38f05b25d8df5b5040e148d1217de6fd9e4d1ef9c4f270d5f821b1219750b9114fd1f2a0","href":"https://static.observableusercontent.com/files/752ec86835a077d91722d5ee743abd908a08ded84bda6f0abe8f15ae38f05b25d8df5b5040e148d1217de6fd9e4d1ef9c4f270d5f821b1219750b9114fd1f2a0","name":"reslab_logo.png","type":"image/png","lastModified":1696762925338.014,"size":20445},{"id":"d9ebd890a646f8c7ca3c450cd6b745b09909cd741698ead8a777a334ce21f27d034731280bdf68cde72698f7d409fbb5f4c458a6a6d0fcdaf57b0daf7d5684a9","href":"https://static.observableusercontent.com/files/d9ebd890a646f8c7ca3c450cd6b745b09909cd741698ead8a777a334ce21f27d034731280bdf68cde72698f7d409fbb5f4c458a6a6d0fcdaf57b0daf7d5684a9","name":"reslab_logo.svg","type":"image/svg+xml","lastModified":1696766241299.842,"size":6425}] 2d:{"id":"d7e23076b995714b","slug":"reslab-baseline-plots-normalized","title":"Baseline plots normalized","thumbnail":"d47f129018620874a50484cdd75e709e4685a65a5c5afda244b168de305909b2","access_level":"public","create_time":"$D2022-10-29T16:23:03.148Z","update_time":"$D2025-05-25T07:33:37.491Z","view_time":null,"first_public_time":"$D2022-10-29T16:23:03.148Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"54a924218005a3d6","login":"pavlos","name":"Pavlos Sermpezis","avatar_url":"https://avatars-next.observableusercontent.com/200aa95291d6d5ebe777baf6ba8e2f53b577798e1ae41ebc39d70811739e73d6","tier":"starter_2024"},"version":3346,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"0742c07d75b1a2ea","login":"pavlos","name":"Pavlos Sermpezis","avatar_url":"https://avatars-next.observableusercontent.com/200aa95291d6d5ebe777baf6ba8e2f53b577798e1ae41ebc39d70811739e73d6","tier":null}],"members":[{"type":"individual","id":"0742c07d75b1a2ea","login":"pavlos","name":"Pavlos Sermpezis","avatar_url":"https://avatars-next.observableusercontent.com/200aa95291d6d5ebe777baf6ba8e2f53b577798e1ae41ebc39d70811739e73d6","tier":null,"role":"editor"},{"type":"individual","id":"da2e2a0573ec89eb","login":"skaram82","name":"Stelios K.","avatar_url":"https://avatars-next.observableusercontent.com/db4c5657f84f0fe8e7e31499dc35fcfba2338443b80cb962bdce9208bd80a917","tier":null,"role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":{"id":"775e8344876a6136","slug":"e-reslab","title":"e-Reslab","owner":{"id":"54a924218005a3d6","login":"pavlos","name":"Pavlos Sermpezis"}},"type":"notebook","body":{"title":"Baseline plots normalized","cells":[{"id":0,"value":"# Baseline plots normalized ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":313,"value":"$2f","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3001,"value":"viewof instructions_button = {\n const but = Inputs.button(\"How to use the visualizations tool (click to show/hide instructions)\")\n but.style.width = \"100%\"\n but.style.fontSize = \"15px\"\n return but\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3048,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1975,"value":"#### A note on rates\n\nThe rates are calculated differently for each variable, i.e., each rate has a different physical meaning. Details are provided in the table below. Also, each variable (population or rates) refers only to people within the age group noted in the table below.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1949,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":352,"value":"## Country level plots","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1726,"value":"viewof abs_or_rate_countries = Inputs.select([\"Absolute values (population)\", \"Rates (%)\"], {\n // width: \"90%\", \n label: \"Type of variables\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1716,"value":"viewof select_variable_countries = Inputs.select(variables_countries.filter(e => (abs_or_rate_countries===\"Rates (%)\")? e.includes('%') : !(e.includes('%')) ), {width: 400, label: \"Select variable to visualize\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3268,"value":"block_buttons_second_variable = html`

\n ${viewof toggle_second_variable_countries}\n ${viewof select_variable_countries2}\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3262,"value":"viewof toggle_second_variable_countries = Inputs.toggle({label: \"Compare with a second variable\", value: false})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3264,"value":"viewof select_variable_countries2 = Inputs.select(variables_countries.filter(e => (abs_or_rate_countries===\"Rates (%)\")? e.includes('%') : !(e.includes('%')) ), {width: 400, label: \"Select a second variable to visualize\", disabled: !toggle_second_variable_countries})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1454,"value":"viewof norm_flag_countries = Inputs.radio([\"Yes\", \"No\"], {\n label: \"Normalize values?\", \n value: \"No\", disabled: (abs_or_rate_countries===\"Rates (%)\")?[\"Yes\"]:[]\n}) \n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1458,"value":"viewof ref_year_countries = {\n let min_y = Math.min(...raw_data_new_countries.map(o => o.year))\n let max_y = Math.max(...raw_data_new_countries.map(o => o.year))\n return Inputs.range([min_y, max_y], {value: min_y, label: \"Year of reference\", step: 1})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1468,"value":"viewof easy_select_countries = Inputs.button([\n [\"None\", () => set(viewof checkboxes_countries_countries, [])],\n [\"All\", () => set(viewof checkboxes_countries_countries, countries)]\n], {label: 'Quick select None/All countries'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1462,"value":"viewof checkboxes_countries_countries = Inputs.checkbox(countries, {label: \"Select countries\", value: ['EL - Greece', 'CY - Cyprus']})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":369,"value":"// plot_countries = baseline_plot(selected_data_countries, ylabel_countries, select_variable_countries)\nplot_countries = (toggle_second_variable_countries) ? baseline_plot_multivariables(selected_data_countries, \n selected_data_countries2, \n ylabel_countries, \n select_variable_countries, \n select_variable_countries2) \n : baseline_plot(selected_data_countries, \n ylabel_countries,\n select_variable_countries)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2312,"value":"button_png_plot_countries = downloadButtonPNG(plot_countries, {\n white:true, \n filename:\"chart_countries_\"+format_variable_for_filename(select_variable_countries), \n ishtml:true\n}) //downloadButtonPNG(plot_countries_svg, {white:true, filename:\"chart_countries\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":677,"value":"table_title_countries = md`#### Data depicted in table & option to download\nThe data in the above plot are also given in the following table`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":680,"value":"viewof searched_data = Inputs.search(JSON.parse(JSON.stringify(selected_data_countries)).map(o => ({geo: o.geo.split(\" - \")[0], name: o.geo.split(\" - \")[1], year: o.year.slice(0,4), value: o.value})), {label: 'Filter data by country or year'}, )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":659,"value":"viewof table = Inputs.table(searched_data, {\n header: {\n \"geo\": \"Country code\",\n \"name\": \"Country\",\n \"year\": \"Year\",\n \"value\": ylabel_countries,\n },\n // format: {\n // geo: x => x+\" - \"+nuts_names[x]\n // },\n width: 600,\n height: 150\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":726,"value":"table_text_countries = md`The data shown in the above table can be downloaded as a csv file (if you have filtered them, only the filtered data will be downloaded)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":699,"value":"button_table_countries = button(searched_data, 'searched_data_'+format_variable_for_filename(select_variable_countries)+'.csv');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":842,"value":"viewof table1 = Inputs.table(aggregate_country_table, {\n columns: ['geo', 'name'].concat(Object.keys(aggregate_country_table[0]).filter(o => !['geo', 'name'].includes(o))),\n header: {\n \"geo\": \"Country code\",\n \"name\": \"Country\",\n },\n // format: {\n // geo: x => x+\" - \"+nuts_names[x]\n // }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":844,"value":"button_table1_countries = button(aggregate_country_table, 'searched_data_aggregate_'+format_variable_for_filename(select_variable_countries)+'.csv');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":354,"value":"## NUTS level plots\n\nThe visualization below is at a _per NUTS level_. You first need to select the variable to visualize (Unemployment, Employment, NEET, etc.) and then if you want the values to be normalized with the value of the year of reference. \n\nOne or more countries can be selected to be visualized. When a country is selected, _all the nuts in the country_ appear as different lines in the same plot. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1773,"value":"viewof abs_or_rate_nuts = Inputs.select([\"Absolute values (population)\", \"Rates (%)\"], {label: \"Type of variables\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1270,"value":"// viewof select_variable_nuts = Inputs.select(variables_nuts, {label: \"Select variable to visualize\"})\nviewof select_variable_nuts = Inputs.select(variables_nuts.filter(e => (abs_or_rate_nuts===\"Rates (%)\")? e.includes('%') : !(e.includes('%')) ), {label: \"Select variable to visualize\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3277,"value":"block_buttons_second_variable_nuts = html`

\n ${viewof toggle_second_variable_nuts}\n ${viewof select_variable_nuts2}\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3279,"value":"viewof toggle_second_variable_nuts = Inputs.toggle({label: \"Compare with a second variable\", value: false})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3281,"value":"viewof select_variable_nuts2 = Inputs.select(variables_nuts.filter(e => (abs_or_rate_nuts===\"Rates (%)\")? e.includes('%') : !(e.includes('%')) ), {width: 400, label: \"Select a second variable to visualize\", disabled: !toggle_second_variable_nuts})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1317,"value":"// viewof norm_flag = Inputs.radio([\"Yes\", \"No\"], {label: \"Normalize values?\", value:\"Yes\"})\n\nviewof norm_flag_nuts = Inputs.radio([\"Yes\", \"No\"], {\n label: \"Normalize values?\", \n value: \"No\", \n disabled: (abs_or_rate_nuts===\"Rates (%)\")?[\"Yes\"]:[]\n}) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1312,"value":"viewof ref_year_nuts = {\n let min_y = Math.min(...raw_data_new_nuts.map(o => o.year))\n let max_y = Math.max(...raw_data_new_nuts.map(o => o.year))\n return Inputs.range([min_y, max_y], {value: min_y, label: \"Year of reference\", step: 1})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1336,"value":"viewof easy_select_nuts = Inputs.button([\n [\"None\", () => set(viewof checkboxes_countries_nuts, [])],\n [\"All\", () => set(viewof checkboxes_countries_nuts, countries)]\n], {label: 'Quick select None/All countries'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1307,"value":"viewof checkboxes_countries_nuts = Inputs.checkbox(countries, {label: \"Select countries\", value: [\"EL - Greece\"]})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2720,"value":"viewof easy_select_nuts1 = Inputs.button([\n [\"None\", () => set(viewof checkboxes_nuts, [])],\n [\"All\", () => set(viewof checkboxes_nuts, nuts.filter(o => checkboxes_countries_nuts.map(o=>o.slice(0,2)).includes(o.slice(0,2))))]\n], {label: 'Quick select None/All NUTS'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1262,"value":"viewof checkboxes_nuts = {\n // let selected_countries_nuts = countries.filter(o => checkboxes_countries_nuts.includes(o))\n // let all_selected_nuts = nuts.filter(o => selected_countries_nuts.includes(o.slice(0,2)))\n let all_selected_nuts = nuts.filter(o => checkboxes_countries_nuts.map(o=>o.slice(0,2)).includes(o.slice(0,2)))\n return Inputs.checkbox(all_selected_nuts, {label: \"Select NUTS\", value: all_selected_nuts})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":429,"value":"// plot_nuts = baseline_plot(selected_data_nuts, ylabel_nuts, select_variable_nuts)\n\nplot_nuts = (toggle_second_variable_nuts) ? baseline_plot_multivariables(selected_data_nuts, \n selected_data_nuts2, \n ylabel_nuts, \n select_variable_nuts, \n select_variable_nuts2) \n : baseline_plot(selected_data_nuts, \n ylabel_nuts,\n select_variable_nuts)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2309,"value":"button_png_plot_nuts = downloadButtonPNG(plot_nuts, {\n white:true, \n filename:\"chart_nuts_\"+format_variable_for_filename(select_variable_nuts), \n ishtml:true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":728,"value":"table_title_nuts = md`#### Data depicted in table & option to download\nThe data in the above plot are also given in the following table`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":735,"value":"viewof searched_data_nuts = Inputs.search(JSON.parse(JSON.stringify(selected_data_nuts)).map(o => ({geo: o.geo.split(\" - \")[0], name: o.geo.split(\" - \")[1], year: o.year.slice(0,4), value: o.value})), {label: 'Filter data by NUTS or year'}, )","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":733,"value":"viewof table_nuts = {\n return Inputs.table(searched_data_nuts, {\n header: {\n \"geo\": \"NUTS\",\n \"year\": \"Year\",\n \"value\": ylabel_nuts,\n },\n // format: {\n // geo: x => x+\" - \"+nuts_names[x]\n // },\n width: 600,\n height: 150\n }) \n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":748,"value":"table_text_nuts = md`The data shown in the above table can be downloaded as a csv file (if you have filtered them, only the filtered data will be downloaded)`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":738,"value":"button_table_nuts = button(searched_data_nuts, 'searched_data_nuts_'+format_variable_for_filename(select_variable_nuts)+'.csv');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":772,"value":"viewof table_nuts1 = {\n let aggregate_nuts_table = aggregate_data_for_table(searched_data_nuts)\n return Inputs.table(aggregate_nuts_table, {\n \n columns: ['geo', 'name'].concat(Object.keys(aggregate_nuts_table[0]).filter(o => !['geo', 'name'].includes(o))),\n header: {\n \"geo\": \"NUTS code\",\n \"name\": \"NUTS name\",\n },\n // columns: ['geo'].concat(Object.keys(aggregate_nuts_table[0]).filter(o => o != 'geo')),\n // header: {\n // \"geo\": \"NUTS\"\n // },\n // format: {\n // geo: x => x+\" - \"+nuts_names[x]\n // }\n })\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":838,"value":"button_table_nuts1 = button(aggregate_nuts_table, 'searched_data_nuts_aggregate_'+format_variable_for_filename(select_variable_nuts)+'.csv');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2022,"value":"radar_text_common = md` ### Analysis of employment per sector\n\nThe following chart show how the employment in a region is shared among the different sectors, e.g., Mining and quarrying, Wholesale and retail, etc.. The charts (called, spider charts or radar charts) show the fraction of Employed population in the sector over the Total employed population. The fraction/rates take values from 0 (i.e., 0%) to 1 (i.e., 100%).\n\nMultiple regions can be selected, and they appear as different colors/lines in the chart. Using the option for the year of reference shows how the rates change over time.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2322,"value":"radar_text_countries = md`### Country-level plots`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2917,"value":"viewof easy_select_countries_radar = Inputs.button([\n [\"None\", () => set(viewof form_radar_countries_countries, [])],\n [\"All\", () => set(viewof form_radar_countries_countries, countries)]\n], {label: 'Quick select None/All countries'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2954,"value":"viewof form_radar_countries_countries = Inputs.checkbox(countries, {label: \"Select countries\", value: ['EL - Greece', 'CY - Cyprus']})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2958,"value":"viewof form_radar_countries_year = {\n let min_y = Math.min(...raw_data_new_countries.map(o => o.year))\n let max_y = Math.max(...raw_data_new_countries.map(o => o.year))\n return Inputs.range([min_y, max_y], {value: max_y, label: \"Select year\", step: 1})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2025,"value":"sector_radar_chart_countries = sector_radar_chart(form_radar_countries_countries, form_radar_countries_year, raw_data_new_countries)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2092,"value":"button_radar_png_countries = downloadButtonPNG(sector_radar_chart_countries, {filename:\"chart_radar_countries_employment_per_sector\", white:true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2042,"value":"radar_text_nuts = md`### NUTS-level plots`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2973,"value":"viewof easy_select_countries_radar_nuts = Inputs.button([\n [\"None\", () => set(viewof checkbox_radar_nuts_countries, [])],\n [\"All\", () => set(viewof checkbox_radar_nuts_countries, countries)]\n], {label: 'Quick select None/All countries'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2045,"value":"viewof checkbox_radar_nuts_countries = Inputs.checkbox(countries, {label: \"Select countries\", value: ['EL - Greece']})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2054,"value":"viewof select_radar_nuts_year = {\n let min_y = Math.min(...raw_data_new_nuts.map(o => o.year))\n let max_y = Math.max(...raw_data_new_nuts.map(o => o.year))\n return Inputs.range([min_y, max_y], {value: max_y, label: \"Select year\", step: 1})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2979,"value":"viewof easy_select_nuts_radar_nuts = Inputs.button([\n [\"None\", () => set(viewof checkboxes_radar_nuts, [])],\n [\"All\", () => set(viewof checkboxes_radar_nuts, nuts.filter(o => checkbox_radar_nuts_countries.map(o=>o.slice(0,2)).includes(o.slice(0,2))))]\n], {label: 'Quick select None/All NUTS'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2047,"value":"viewof checkboxes_radar_nuts = {\n // let selected_countries_nuts = countries.filter(o => checkbox_radar_nuts_countries.includes(o))\n // let all_selected_nuts = nuts.filter(o => checkbox_radar_nuts_countries.includes(o.slice(0,2)))\n let all_selected_nuts = nuts.filter(o => checkbox_radar_nuts_countries.map(o=>o.slice(0,2)).includes(o.slice(0,2)))\n return Inputs.checkbox(all_selected_nuts, {label: \"Select nuts\", value: all_selected_nuts})\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2050,"value":"sector_radar_chart_nuts = sector_radar_chart(checkboxes_radar_nuts, select_radar_nuts_year, raw_data_new_nuts)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2081,"value":"button_radar_png_nuts = downloadButtonPNG(sector_radar_chart_nuts, {filename:\"chart_radar_nuts_employment_per_sector\", white:true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"# Appendix\nThe content below is the code that generates the visualizations","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":11,"value":"### Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1758,"value":"ylabel_countries = ((abs_or_rate_countries===\"Rates (%)\")|(norm_flag_countries==\"Yes\"))?\"Rate (%)\":\"Population (in thousands)\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1767,"value":"ylabel_nuts = ((abs_or_rate_nuts===\"Rates (%)\")|(norm_flag_nuts==\"Yes\"))?\"Rate (%)\":\"Population (in thousands)\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1360,"value":"aggregate_nuts_table = aggregate_data_for_table(searched_data_nuts)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":847,"value":"aggregate_country_table = aggregate_data_for_table(searched_data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3273,"value":"selected_data_countries2 = normalize_data(\n raw_data_new_countries\n .filter(o => checkboxes_countries_countries.includes(o.geo))\n .map(o => ({geo: o.geo, year: o.year, value: o[select_variable_countries2]})), \n norm_flag_countries, \n ref_year_countries\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"selected_data_countries = normalize_data(\n raw_data_new_countries\n .filter(o => checkboxes_countries_countries.includes(o.geo))\n .map(o => ({geo: o.geo, year: o.year, value: o[select_variable_countries]})), \n norm_flag_countries, \n ref_year_countries\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3289,"value":"selected_data_nuts2 = normalize_data(\n raw_data_new_nuts\n .filter(o => checkboxes_nuts.includes(o.geo))\n .map(o => ({geo: o.geo, year: o.year, value: o[select_variable_nuts2]})), \n norm_flag_nuts, \n ref_year_nuts\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":426,"value":"selected_data_nuts = normalize_data(\n raw_data_new_nuts\n .filter(o => checkboxes_nuts.includes(o.geo))\n .map(o => ({geo: o.geo, year: o.year, value: o[select_variable_nuts]})), \n norm_flag_nuts, \n ref_year_nuts\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":403,"value":"// nuts = raw_data_new.map(o=>o.geo).filter((item, i, ar) => ar.indexOf(item) === i).filter(o => o.length>2);\n// nuts = raw_data_new_nuts.filter(o=>o.geo[2] != ' ').map(o=>o.geo).filter((item, i, ar) => ar.indexOf(item) === i);\nnuts = raw_data_new_nuts.map(o=>o.geo).filter((item, i, ar) => ar.indexOf(item) === i);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"#### Raw data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":330,"value":"// // countries = raw_data_new.map(o=>o.geo.slice(0,2)).filter((item, i, ar) => ar.indexOf(item) === i);\n// countries = raw_data_new.filter(o=>o.geo[2] === ' ')\n// .map(o=>o.geo)\n// .filter((item, i, ar) => ar.indexOf(item) === i);\n\ncountries = [\"AT - Austria\", \"HR - Croatia\", \"IT - Italy\", \"SE - Sweden\", \"CY - Cyprus\", \"FR - France\", \"LT - Lithuania\", \"CZ - Czechia\", \"FI - Finland\", \"PT - Portugal\", \"DE - Germany\", \"LU - Luxembourg\", \"PL - Poland\", \"DK - Denmark\", \"ES - Spain\", \"LV - Latvia\", \"NL - Netherlands\", \"EE - Estonia\", \"EL - Greece\", \"MT - Malta\", \"BG - Bulgaria\", \"SI - Slovenia\", \"RO - Romania\", \"HU - Hungary\", \"BE - Belgium\", \"IE - Ireland\", \"SK - Slovakia\"].sort()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1979,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3176,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3212,"value":"raw_data_new_nuts = {\n let final_data = await fetch(\"https://geo-api.aegean.gr/api/data_observable?geo=nuts2\").then((response) => response.json())\n .then(e => e.map(ee => renameKeys(ee,COMPRESSED_COLUMN_NAMES)))\n \n \n // final_data.forEach(item => item.geo = nutsID2Name(item.geo))\n \n return final_data \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3187,"value":"raw_data_new_countries = {\n let final_data = await fetch(\"https://geo-api.aegean.gr/api/data_observable?geo=countries\").then((response) => response.json())\n .then(e => e.map(ee => renameKeys(ee,COMPRESSED_COLUMN_NAMES)))\n \n \n // final_data.forEach(item => item.geo = nutsID2Name(item.geo))\n \n return final_data \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1695,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1441,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1145,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":640,"value":"nuts_names = {\n /*\n let nuts_array = await fetch(\"https://geo-api.aegean.gr/api/table/nuts_lb_2021_4326\").then((response) => response.json())\n.then(d=>d.map(o => ({geo:o.nuts_id, name:o.name_latn, name_eng:o.name_engl})))\n\nlet nuts_dict = {};\nnuts_array.forEach(item => {\n nuts_dict[item.geo] = (item.geo.length === 2)? item.name_eng: item.name;\n });\nreturn nuts_dict\n */\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":613,"value":"### Data Functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1993,"value":"function pick(obj, props) {\n return props.reduce(function(result, prop) {\n result[prop] = obj[prop];\n return result;\n }, {});\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3172,"value":"function renameKeys(obj, keyMap) {\n return Object.keys(obj).reduce((acc, key) => {\n acc[keyMap[key] || key] = obj[key];\n return acc;\n }, {});\n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2689,"value":"merge_skill_arrays = function(arr1, arr2) {\n let merged = []\n for(let i=0; i (itmInner.geo === arr1[i].geo) \n && (itmInner.year === arr1[i].year)\n && (itmInner.skill === arr1[i].skill)));\n if (typeof arr2_obj != 'undefined') {\n let new_entry = {geo: arr1[i].geo, year: arr1[i].year, skill: arr1[i].skill, value: arr1[i].value+arr2_obj.value}\n merged.push(new_entry);\n }\n }\n return merged \n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2659,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2511,"value":"function nutsID2Name(id){\n return !(id in nuts_names) ? id : id+' - '+nuts_names[id];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1644,"value":"merge_arrays = function(arr1, arr2, arr_key) {\n let merged = []\n for(let i=0; i (itmInner.geo === 'AT11') && (itmInner.year === 2008) ) != 'undefined'\n let arr2_obj = (arr2.find((itmInner) => (itmInner.geo === arr1[i].geo) && (itmInner.year === arr1[i].year) ));\n if (typeof arr2_obj != 'undefined') {\n merged.push({...arr1[i], ...arr2_obj});\n } else {\n merged.push({...arr1[i], [arr_key]: Number.NaN});\n }\n }\n return merged \n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1640,"value":"sort_by_year = function(arr) {\n return arr.sort(function (a, b) {\n return b.geo != a.geo ? 0 // if different geo, do nothing\n : b.year < a.year ? 1 // if b should come earlier, push a to end\n : b.year > a.year ? -1 // if b should come later, push a to begin\n : 0; // else do nothing\n });\n \n }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":777,"value":"aggregate_data_for_table = function(data) {\n let new_data = Array()\n for (var i = 0; i < data.length; i++) {\n let new_entry = new_data.filter(o => o.geo == data[i].geo)\n if (new_entry.length == 0) {\n new_data.push({[data[i].year]: data[i].value, 'geo': data[i].geo, 'name': data[i].name}) \n } else {\n new_entry[0][data[i].year] = data[i].value\n }\n }\n return new_data \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":553,"value":"normalize_data = function(data, norm_flag, ref_year) {\n return data.filter(o => o.year>=ref_year).map(\n function(d) {\n if (norm_flag === \"No\") {\n var norm_value = Math.round(10* d.value)/10\n } else {\n var norm_value = Number.NaN\n let ref_data = data.filter(o => (o.geo === d.geo) && (o.year === ref_year) )\n if (ref_data.length > 0) {\n if (ref_data[0]['value'] !== null) {\n let ref_value = ref_data[0]['value']\n var norm_value = Math.round(10* 100*Number( d.value / ref_value ))/10\n }\n }\n }\n return {geo: d.geo, year: new Date(d.year,1,1), value: norm_value}\n }\n )\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1340,"value":"function set(input, value) {\n input.value = value;\n input.dispatchEvent(new Event(\"input\", {bubbles: true}));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":374,"value":"### Plotting","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1990,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3138,"value":"function format_variable_for_filename(x) {\n return x.split(\"(\")[0].trim(\" \").replace(\"&\", \"\").replace(\":\", \"\").replace(\",\", \"\").split(\" \").join(\"_\")\n} ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1912,"value":"button = (data, filename = 'data.csv') => {\n \n let downloadData = new Blob([d3.csvFormat(data)], { type: \"text/csv\" });\n // let downloadData = new Blob([JSON.stringify(data, null, 2)], {type: \"application/json\"});\n \n const size = (downloadData.size / 1024).toFixed(0);\n const button = DOM.download(\n downloadData,\n filename,\n `Download data`\n );\n return button;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3259,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":366,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"myColorRange = [\"#36cb1a\", \"#a118fb\", \"#db090f\", \"#38bdef\", \"#fe89d0\", \"#7d6c2c\", \"#2a67db\", \"#34c797\", \"#fc9a18\", \"#77687f\", \"#f89784\", \"#b1b823\", \"#c40fb3\", \"#d4135a\", \"#2b7d1a\", \"#34786a\", \"#a5aafb\", \"#af5216\", \"#b8b098\", \"#9353a8\", \"#ab4f6c\", \"#1a71b1\", \"#6d50f0\", \"#99bc6a\", \"#dca755\", \"#d6a2ba\", \"#9b5d44\", \"#26ca69\", \"#2bc3c3\", \"#ff80fc\", \"#c22e8a\", \"#c33e3c\", \"#7cc343\", \"#9db3cf\", \"#ff9557\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"### Imports","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2074,"value":"import {downloadButtonPNG} from \"@pavlos/download-buttons\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1939,"value":"import {radarChart} from \"@pavlos/radar-plot\";","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"import {addTooltips} from \"@mkfreeman/plot-tooltip\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2738,"value":"reslab_logo_url = FileAttachment(\"reslab_logo_transparent.png\").url()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3239,"value":"// inputscol = html`\n//

\n//

\n// ${viewof abs_or_rate_countries}\n//

\n//

\n// ${viewof select_variable_countries}\n//

\n//

\n// \n// `","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3b","stdlib":"1","titling":"auto"}} 2e:"$2d:body"