31:T1363,sector_plot = { const selection1 = vl.selectPoint().on('click'); const selection2 = vl.selectPoint().on('click'); const line = vl.data(data) .transform(vl.filter('datum.jobcountry == "US"'), vl.filter(sector === 'Select All' ? 'true' : `datum.sector == "${sector}"`) ) .title("Job Posting Wage by Sector Trends") .layer( vl.markLine({interpolate: 'monotone', line: true, opacitysize: 1, color: "black"}) .params(selection1) .encode( vl.x().fieldT('month').title("Date").axis({format: "%b %Y", nice: true, grid: false}), vl.y().fieldQ('posted_wage_growth_yoy_3moavg').title("Indeed Wage Growth YoY").axis({format: ".1%", nice: true, tickCount: 4}), vl.detail().fieldN('sector').title("Sector"), vl.color().if(selection1, vl.value("black")).value("lightgray"), vl.opacity().if(selection1, vl.value("0.4")).value("0.2"), vl.tooltip([ { field: 'sector', type: 'nominal', title: 'Sector'}, { field: 'posted_wage_growth_yoy_3moavg', type: 'quantitative', format: '.1%', title: 'Indeed Wage Growth YoY'}, { field: 'month', type: 'temporal', format: '%b %d, %Y', title: 'Date'} ]) ) .height(320) .width(width/1.2) ); const line2 = vl.data(data_country) .transform(vl.filter('datum.jobcountry == "US"')) .layer( vl.markLine({interpolate: 'monotone', line: true, size: 3, color: "#233F96"}) .encode( vl.x().fieldT('month').title("Date").axis({format: "%b %Y", nice: true, grid: false}), vl.y().fieldQ('posted_wage_growth_yoy_3moavg').title("Indeed Wage Growth YoY").axis({format: ".1%", nice: true, tickCount: 4}), vl.color().fieldN('jobcountry') .scale({ range: ["#233F96"] }) .legend(false), vl.tooltip([ { field: 'sector', type: 'nominal', title: 'Sector'}, { field: 'posted_wage_growth_yoy_3moavg', type: 'quantitative', format: '.1%', title: 'Indeed Wage Growth YoY'}, { field: 'month', type: 'temporal', format: '%b %d, %Y', title: 'Date'} ]) ) .height(320) .width(width/1.2) ); const line3 = vl.data(data) .transform( vl.filter('datum.jobcountry == "US"'), vl.filter(sector === 'Select All' ? 'false' : `datum.sector == "${sector}"`), vl.aggregate([{op: 'mean', field: 'posted_wage_growth_yoy_3moavg', as: 'average_index'}]) .groupby(['month']) ) .layer( vl.markLine({interpolate: 'monotone', line: true, opacitysize: 2, color: "black"}) .encode( vl.x().fieldT('month').title("Date").axis({format: "%b %Y", nice: true, grid: false}), vl.y().fieldQ('average_index').axis({format: ".1%", nice: true, tickCount: 4}), vl.color().value("black").title(false).legend(false), vl.tooltip([ { field: 'sector', type: 'nominal', title: 'Sector'}, { field: 'month', type: 'temporal', format: '%b %d, %Y', title: 'Date' }, { field: 'average_index', type: 'quantitative', format: '.1%', title: 'Average Indeed Wage Growth YoY' } ]) ) ) .height(320) .width(width / 1.2); const atl_line = vl.data(atlwage_data) .layer( vl.markLine({interpolate: 'monotone', line: true, opacitysize: 2, color: "#4DA6FF"}) .encode( vl.x().fieldT('date').title("Date").axis({format: "%b %Y", nice: true, grid: false}), vl.y().fieldQ('3_month_wage_growth').axis({format: ".1%", nice: true, tickCount: 4}), vl.tooltip([ { field: 'date', type: 'temporal', format: '%b %d, %Y', title: 'Date' }, { field: '3_month_wage_growth', type: 'quantitative', format: '.1%', title: 'Atlanta Wage Growth' } ]) ) ) .height(320) .width(width / 1.2); const bar = vl.data(data_latest) .transform(vl.filter('datum.jobcountry == "US"'), vl.filter(sector === 'Select All' ? 'true' : `datum.sector == "${sector}"`) ) .title("Wage Growth by Sector (" + d3.timeFormat("%B %d, %Y")(maxDate) + ")") .layer( vl.markBar({opacity: 0.8}) .params(selection2) .encode( vl.x().fieldN('sector').title(false).axis({nice: true, grid: false}) .sort({field: "posted_wage_growth_yoy_3moavg", order: "descending"}), vl.y().fieldQ('posted_wage_growth_yoy_3moavg').title("Indeed Wage Growth YoY").axis({format: ".1%", nice: true, tickCount: 4}), vl.color().if(selection2, vl.value("#233F96")).value("lightgray"), vl.tooltip([ { field: 'Sector', type: 'nominal', title: 'Sector'}, { field: 'posted_wage_growth_yoy_3moavg', type: 'quantitative', format: '.1%', title: 'Indeed Wage Growth YoY'} ]) ) .width(width/1.2) .height(140), vl.markRule({size: 3, opacity: 1, stroke: 'black'}) .encode( vl.y().average('posted_wage_growth_yoy_3moavg')) ); return vl.vconcat(vl.layer(line, line2, atl_line) // ,bar ) .config({view: { stroke: null }}) .render(); }32:T628,Plot.plot({ height: data_latest.length * 25 + 30, marginLeft: 200, marginRight: 40, x: { label: "YoY Posted Wage Growth (3mo avg)", tickFormat: d3.format(".1%") }, y: { label: null, domain: data_latest .slice() .sort((a, b) => +b.posted_wage_growth_yoy_3moavg - +a.posted_wage_growth_yoy_3moavg) .map(d => d.sector) }, color: { scheme: "PiYG", domain: [-0.05, 0.05], legend: false }, marks: [ // bars first Plot.barX(data_latest, { x: d => +d.posted_wage_growth_yoy_3moavg, y: d => d.sector, fill: d => +d.posted_wage_growth_yoy_3moavg }), // dashed average line ON TOP of bars Plot.ruleX( [d3.mean(data_latest, d => +d.posted_wage_growth_yoy_3moavg)], { stroke: "black", strokeDasharray: "4,4", strokeWidth: 1.5 } ), Plot.text( [d3.mean(data_latest, d => +d.posted_wage_growth_yoy_3moavg)], { x: d => d, y: 1, // bottom of chart dy: -6, // nudge upward a bit text: "US Avg.", textAnchor: "end", // right-aligned fill: "black", fontSize: 11 } ), // labels with white halo Plot.text(data_latest, { x: d => +d.posted_wage_growth_yoy_3moavg, y: d => d.sector, text: d => d3.format(".1%")(+d.posted_wage_growth_yoy_3moavg), dx: 6, textAnchor: "start", fontWeight: "bold", fontSize: 11, fill: "#000", stroke: "white", strokeWidth: 5, paintOrder: "stroke" }), ] })33:T42d,country_plot = { const selection1 = vl.selectPoint().on('click'); const selection2 = vl.selectPoint().on('click'); const line = vl.data(data_country) .layer( vl.markLine({interpolate: 'monotone', line: true, size: 3}) .encode( vl.x().fieldT('month').title("Date").axis({format: "%b %Y", nice: true, grid: false}), vl.y().fieldQ('posted_wage_growth_yoy_3moavg').title("Indeed Wage Growth").axis({format: ".1%", nice: true, tickCount: 4}), vl.color().fieldN('jobcountry') .legend({ title: null, orient: "top", labelFontSize: 12, symbolSize: 120, symbolStrokeWidth: 4 }), vl.tooltip([ { field: 'jobcountry', type: 'nominal', title: 'Country'}, { field: 'posted_wage_growth_yoy_3moavg', type: 'quantitative', format: '.1%', title: 'Indeed Wage Growth'}, { field: 'month', type: 'temporal', format: '%b %d, %Y', title: 'Date'} ]) ) .height(320) .width(width/1.2) ); return vl.vconcat(vl.layer(line)) .config({view: { stroke: null }}) .render(); }34:[{"id":"e99679b5f8769ac6546b16979c04a2eb7e3cab06b54f47bc2c8b0bf29a08c1dff387d4f6fb55529b0630d6c1b621133bb6860796b6f8ff84c5ea13887d207261","href":"https://static.observableusercontent.com/files/e99679b5f8769ac6546b16979c04a2eb7e3cab06b54f47bc2c8b0bf29a08c1dff387d4f6fb55529b0630d6c1b621133bb6860796b6f8ff84c5ea13887d207261","name":"sector_category_ref-1-1.csv","type":"text/csv","lastModified":1758211210614.423,"size":1909},{"id":"1ec3edc43ba66c0db419744c479d1b5118bb405587189f3ad739a10853f6f933d86824e809f4b4ad18053ab33fb5dc7c5f3d6bc601654c8ea976afd5b321f517","href":"https://static.observableusercontent.com/files/1ec3edc43ba66c0db419744c479d1b5118bb405587189f3ad739a10853f6f933d86824e809f4b4ad18053ab33fb5dc7c5f3d6bc601654c8ea976afd5b321f517","name":"counties-albers-10m.json","type":"application/json","lastModified":1758211210614.423,"size":795407}] 2f:{"title":"Indeed Hiring Lab - Wage Tracker","cells":[{"id":0,"value":"# Indeed Hiring Lab - Wage Tracker\n\nU.S. Indeed Job Postings Wage Growth\n\n*Source: [Indeed Hiring Lab](https://github.com/hiring-lab/indeed-wage-tracker), [Federal Reserve Bank of Atlanta](https://fred.stlouisfed.org/series/FRBATLWGT3MMAUMHWGO)*","pinned":false,"hidden":false,"mode":"md"},{"id":63,"value":"## Job Postings Trends by Sector","pinned":false,"hidden":false,"mode":"md"},{"id":1343,"value":"viewof sector = {\n const uniqueSectors = Array.from(new Set(data.map(d => d.sector))).sort();\n\n const type = select({\n title: \"Sector\",\n options: [\n { label: \"Select All\", value: \"Select All\" },\n ...uniqueSectors.map(s => ({ label: s, value: s }))\n ],\n value: \"Select All\",\n description: \"Select Sector to chart.\"\n });\n\n type.input.style.fontSize = \"0.8em\";\n return type;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2643,"value":"html`\n

\n \n \n Indeed US Avg.\n \n \n \n Atl Fed Wage\n \n

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":65,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":2253,"value":"

\n## Indeed Job Posting Wage by Sector\n\n*YoY percent change in wage on Indeed 3 month avg. (**${d3.utcFormat(\"%B %Y\")(maxDate)}**)*","pinned":false,"hidden":false,"mode":"md"},{"id":2250,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":2255,"value":"\n Source: Indeed Hiring Lab. Percent Change since ${d3.utcFormat(\"%B %Y\")(d3.utcYear.offset(maxDate, -1))}
\n Visual created by Bobby Reedy.\n","pinned":false,"hidden":false,"mode":"md"},{"id":2593,"value":"

\n## Indeed Job Posting Wage by Country\n\n*Change in wage on Indeed 3 month avg. (Data as of: **${d3.utcFormat(\"%B %Y\")(maxDate)}**)*","pinned":false,"hidden":false,"mode":"md"},{"id":2576,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"

\n## Code and Data","pinned":false,"hidden":false,"mode":"md"},{"id":18,"value":"data = d3.csv(\n \"https://raw.githubusercontent.com/hiring-lab/indeed-wage-tracker/refs/heads/main/posted-wage-growth-by-sector.csv\",\n d => {\n const parseMonth = d3.timeParse(\"%b-%y\");\n const formatDate = d3.timeFormat(\"%Y-%m-%d\");\n const date = parseMonth(d.month);\n return {\n ...d,\n month: formatDate(date)\n };\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1765,"value":"data_latest = data.filter(\n d =>\n new Date(d.month).getTime() === maxDate.getTime() &&\n d.jobcountry === \"US\"\n);","pinned":false,"hidden":false,"mode":"ojs"},{"id":2484,"value":"data_country = d3.csv(\n \"https://raw.githubusercontent.com/hiring-lab/indeed-wage-tracker/refs/heads/main/posted-wage-growth-by-country.csv\",\n d => {\n const parseMonth = d3.timeParse(\"%b-%y\");\n const formatDate = d3.timeFormat(\"%Y-%m-%d\");\n const date = parseMonth(d.month);\n return {\n ...d,\n month: formatDate(date)\n };\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2619,"value":"atlwage_data = d3.csv(\"https://raw.githubusercontent.com/robertmreedy/FRED_JOLTS_JOB_OPENINGS/refs/heads/main/data/atlwage_processed.csv\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":2420,"value":"maxDate = d3.max(data, d => new Date(d.month));","pinned":false,"hidden":false,"mode":"ojs"},{"id":957,"value":"import {printTable} from '@uwdata/data-utilities'","pinned":false,"hidden":false,"mode":"ojs"},{"id":1340,"value":"import {select, radio} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"import {vl} from '@vega/vega-lite-api-v5'","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}