2f:T4e8,// clean up process for benefits viewof benefits = aq.from(clean) .select('company', 'benefits') // select these columns only .derive({ num_benefits: aq.escape( d => d3.count(d.benefits) ) // get a count of benefits by row }) .dedupe('company','benefits') // deduplicate rows with the same benefit list .filter(d => d.num_benefits > 0) // remove those without benefits (for other purposes, this might be useful) // below is the part where I very ungracefully work with the arrays // starts here .derive({ benefits: d => op.replace(d.benefits, "['", "") }) .derive({ benefits: d => op.replace(d.benefits, "']", "") }) .derive({ benefits: d => op.replace(d.benefits, /'/g, "") }) // ends here ^ .groupby('company') // once the array is clean, group all benefits by company .rollup({ all_benefits: d => op.array_agg(d.benefits) // one company, one array of benefits }) .derive({ all_benefits: d => op.split(d.all_benefits, ',') }) .unroll('all_benefits') // do one company and one benefit per row .derive({ all_benefits: d => op.trim(d.all_benefits) }) .dedupe('company', 'all_benefits') // remove duplicates that resulted from the above .rename({all_benefits: 'benefit'}) .view()30:[] 2d:{"title":"SC1 - Flex - Benefits","cells":[{"id":0,"value":"md `# SC1 - Flex - Benefits`","pinned":false,"hidden":false,"mode":"ojs"},{"id":503,"value":"viewof file = Inputs.file({label: \"Data\", required: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1602,"value":"md `This dataset's date range is from **${d3.utcFormat('%b %d, %Y')(data_range[0])}** to **${d3.utcFormat('%b %d, %Y')(data_range[1])}**.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":963,"value":"data_range = d3.extent(clean, d => d.date)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1560,"value":"viewof dot_color = Object.assign(Inputs.radio(appcast_color_palette, {\n value: appcast_color_palette[4],\n label: html`Dot Color`,\n format: (x) => html`${x}`\n}), {style: '--label-width: 195px'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1572,"value":"viewof custom_color = Inputs.toggle({label: \"Check this box to use another color\", value: false})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1565,"value":"viewof color1 = Inputs.color({label: \"Favorite color\", value: \"#4682b4\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":895,"value":"vl.markCircle({\n fill: custom_color ? color1 : dot_color, \n //fill: color_selector,\n opacity: 0.75\n})\n .data(benefits.objects().filter(d => top_companies.includes(d.company)))\n .encode(\n vl.y().fieldN('benefit')\n .title('Benefit'),\n vl.x().fieldN('company')\n .title('Company')\n .axis({\n orient: 'top'\n }),\n )\n .config({\n view: {stroke: null, step: 20},\n //view: {stroke: 'black', strokeOpacity: 0.5, step: 20},\n axis: {\n grid: true, gridOpacity: 0.5, \n tickOpacity: 0.75, domain: false, \n labelFontWeight: 200, labelFontSize: 10,\n titleFontWeight: 50\n },\n axisY: {titlePadding: 50},\n circle: {size: 200}\n })\n //.width(400).height(300)\n .padding({top: 25, bottom: 50, right: 50, left: 50})\n .render()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1578,"value":"### *Data*","pinned":false,"hidden":false,"mode":"md"},{"id":874,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":1624,"value":"viewof unique_benefit_list = benefits\n .select(1)\n .dedupe()\n .orderby('benefit')\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1631,"value":"md `## *\"Gas reimbursement\" related benefits*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1634,"value":"// what companies offer benefits related to the benefits of interest?\nviewof focus_benefits = benefits\n // @Gretchen, you can add/remove benefits below if you'd like to explore others\n .filter(d => d.benefit == 'Free or subsidised travel' || d.benefit == 'Company car') \n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1640,"value":"// how many companies include the benefits in focus?\nviewof focus_benefits_count = focus_benefits\n .select('company')\n .dedupe()\n .count()\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1645,"value":"// how many of the companies that include the benefits in focus are part of the top companies?\nfocus_benefits\n .filter(aq.escape(d => top_companies.includes(d.company)))\n .view()\n// nada :(","pinned":true,"hidden":false,"mode":"ojs"},{"id":1651,"value":"// what percent of the companies out of the whole dataset include the focused benefits?\nviewof percent_benefits = benefits\n .select('company')\n .dedupe()\n .count()\n .rename({count: 'total number of companies'})\n .derive({\n percent_with_focus_benefits: aq.escape( d => focus_benefits_count.get('count',0) / d['total number of companies'] )\n })\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1675,"value":"md `**${d3.format('.2%')(percent_benefits.get('percent_with_focus_benefits', 0))}** of companies have those benefits`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1580,"value":"

\n\n## Other stuff from the previous notebook","pinned":false,"hidden":false,"mode":"md"},{"id":1588,"value":"md `### *Top competitors by day posting intensity*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":645,"value":"vl.markRect({tooltip: true})\n .data(clean_count_overtime.objects().filter(d => top_companies.includes(d.company)))\n .encode(\n vl.x().fieldT('date').title(null)\n .timeUnit('utcyearmonthdate')\n .axis({orient: 'top'}),\n vl.y().fieldN('company').title(null)\n .sort(vl.sum('count').order('descending')),\n vl.color().fieldQ('count')\n .scale({\n //scheme: 'redpurple',\n //scheme: myContinuousColors,\n scheme: d3.quantize(d3.interpolate(myContinuousColors[0], myContinuousColors[1]), 9)\n })\n .legend({offset: 50, gradientThickness: 7, title: 'Number of posts'})\n )\n .config({\n view: {stroke: null},\n axis: {labelFontWeight: 200, grid: false, domain: false, tickCount: 2},\n axisY: {ticks: false, labelPadding: 7},\n axisX: {labelOpacity: 0.5, labelLimit: 600, tickOpacity: 0.5, tickCount: 'week'},\n rect: {width: {band: 0.975}, height: {band: 0.95}}\n })\n .padding({top: 25, bottom: 100})\n .width(700)\n .render()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1585,"value":"md `### *Heatmap colors*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1460,"value":"myContinuousColors = ['#e4e4e4', appcast_color_palette[0]] // [appcast_color_palette[3], appcast_color_palette[0]]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1462,"value":"{\n const div = d3.create('div')\n .style('display', 'flex')\n div.selectAll('div')\n .data(myContinuousColors)\n .join('div')\n .style('width', 'auto')\n .style('padding', '5px')\n .style('margin', '2px')\n .style('border-radius', '2px')\n .style('background-color', d => d)\n .text(d => d).node()\n return div.node()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1458,"value":"Plot.plot({\n color: {\n type: \"linear\",\n range: myContinuousColors // uses d3.interpolateRgb\n },\n marks: [\n Plot.cell(d3.range(50), {x: d => d, fill: d => d})\n ],\n axis: null,\n height: 30,\n x: {padding: -0.1},\n width: 300\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1482,"value":"Plot.plot({\n color: {\n type: \"linear\",\n range: myContinuousColors,\n interpolate: 'hcl'\n },\n marks: [\n Plot.cell(d3.range(50), {x: d => d, fill: d => d})\n ],\n axis: null,\n height: 30,\n x: {padding: -0.1},\n width: 300\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1582,"value":"md `

\n## Top competitors by week post intensity`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1290,"value":"viewof toggle = Inputs.toggle({label: \"Show labels\", value: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1156,"value":"Plot.plot({\n width: 700,\n height: 475,\n marginLeft: 150,\n insetLeft: 15,\n grid: true,\n r: {\n range: [0, 15]\n },\n y: {\n tickSize: 0,\n label: null\n },\n x: {\n label: null,\n type: 'point'\n },\n marks: [\n //Plot.frame(),\n Plot.dot(clean_count_time_week.objects().filter(d => top_companies.includes(d.company)), {\n x: 'week_date',\n y: 'company',\n r: 'percent',\n fill: custom_color ? color1 : dot_color ,\n opacity: 0.9,\n interval: d3.utcWeek\n }),\n toggle ? Plot.text(clean_count_time_week.objects().filter(d => top_companies.includes(d.company)), {\n x: 'week_date',\n y: 'company',\n r: 'percent',\n fill: d => d.percent <= 0.1 ? null : 'white',\n fontSize: 11,\n text: d => `${d3.format('.0%')(d.percent)}`,\n interval: d3.utcWeek\n }) : null,\n Plot.axisX({anchor: 'top', tickFormat: '%b %d'})\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1375,"value":"Plot.plot({\n insetTop: 25,\n y: {\n label: 'Total count of posts by Top Competitors'\n },\n marks: [\n Plot.rectY(clean_count_overtime.objects().filter(d => top_companies.includes(d.company)), Plot.binX({y: 'sum'},{\n x: 'date',\n y: 'count',\n interval: d3.utcWeek,\n insetRight: 5,\n insetLeft: 5,\n fill: appcast_color_palette[5]\n })),\n // Plot.text(clean_count_overtime.objects().filter(d => top_companies.includes(d.company)), Plot.binX({y: 'sum'},{\n // x: 'date',\n // y: 'count',\n // interval: d3.utcDay,\n // text: 'date'\n // })),\n // Plot.gridX({interval: 'week'}),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1613,"value":"md `### *Data for two charts above*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1010,"value":"viewof clean_count_time_week = clean_count_overtime\n .derive({date: d => op.parse_date(d.date)})\n .derive({\n week_date: aq.escape( d => d3.utcMonday(d.date) )\n })\n .groupby('week_date', 'company')\n .rollup({\n count: d => op.sum(d.count)\n })\n .groupby('week_date')\n .derive({\n percent: d => d.count/op.sum(d.count)\n })\n // .filter(d => +d.week_date == +op.utcdatetime(2023,1,27))\n // .rollup({\n // percent: d => op.sum(d.percent)\n // })\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1000,"value":"top_companies = clean_count_overtime\n .groupby('company')\n .rollup({\n count: d => op.sum(d.count)\n })\n .orderby(aq.desc('count'))\n .filter(d => op.rank() <= 15)\n .array('company')","pinned":true,"hidden":false,"mode":"ojs"},{"id":981,"value":"palettes","pinned":true,"hidden":false,"mode":"ojs"},{"id":834,"value":"htl.html `

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":88,"value":"
\n
\n
\n

","pinned":false,"hidden":false,"mode":"html"},{"id":20,"value":"md `## Appendix\n\n_Implementation & data stuff_`","pinned":false,"hidden":false,"mode":"ojs"},{"id":198,"value":"### *Data*","pinned":false,"hidden":false,"mode":"md"},{"id":771,"value":"viewof titles = aq.from(raw_data)\n // .derive({\n // date: d => op.parse_date(d.date)\n // })\n .select('job_title', 'company')\n .dedupe()\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":710,"value":"import {us} from \"@observablehq/build-your-first-choropleth-map-with-observable-plot\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":733,"value":"states = topojson.feature(us, us.objects.states)","pinned":true,"hidden":false,"mode":"ojs"},{"id":793,"value":"nation = topojson.feature(us, us.objects.nation)","pinned":true,"hidden":false,"mode":"ojs"},{"id":857,"value":"counties_ = topojson.feature(us, us.objects.counties)","pinned":true,"hidden":false,"mode":"ojs"},{"id":508,"value":"viewof clean_count_overtime = aq.from(raw_data)\n .derive({date: d => op.parse_date(d.date)})\n .groupby('date', 'company')\n .count()\n .orderby('date')\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":871,"value":"md `## Clean data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":869,"value":"viewof clean = aq.from(raw_data)\n .derive({date: d => op.parse_date(d.date)})\n // .filter(d => d.company == 'Uber Drivers')\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1078,"value":"clean\n .select('geo_city', 'geo_state')\n .dedupe()\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":705,"value":"zip_codes = d3.csvParse(data)","pinned":true,"hidden":false,"mode":"ojs"},{"id":689,"value":"prox_url = 'https://corsproxy.io?' + encodeURIComponent(v_data['zipcodes.csv'].url)","pinned":true,"hidden":false,"mode":"ojs"},{"id":698,"value":"data = fetch(prox_url).then(response => response.text())","pinned":true,"hidden":false,"mode":"ojs"},{"id":505,"value":"raw_data = file.csv({typed: false})","pinned":true,"hidden":false,"mode":"ojs"},{"id":187,"value":"### *Secondary data sources*","pinned":false,"hidden":false,"mode":"md"},{"id":69,"value":"// all vega data-sets\n\n// to 'extract' a dataset as an array (only for .csv and .json)\n// use this format: football = v_data['football.json']()\n// for some .csv, it's better to use the url format: zipcodes = v_data['zipcodes.csv'].url\n// this is due to the fact that parsing it as an array of objects results in zipcodes of the form \"00313\" turning into \"313\"\n\nv_data = require('vega-datasets@2')","pinned":false,"hidden":false,"mode":"ojs"},{"id":98,"value":"zips = d3.csv(v_data['zipcodes.csv'].url)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1099,"value":"zip_map = new Map(zips.map(d => [d.zip_code, d]))\n\n//broadband_access_2018 = new Map(us_broadband_2018.map(({id, broadband}) => [id, broadband]))","pinned":true,"hidden":false,"mode":"ojs"},{"id":159,"value":"us_holidays_2021 = USholidays.filter(d => op.utcyear(date_parser(d.date)) == 2021)","pinned":false,"hidden":false,"mode":"ojs"},{"id":193,"value":"### *Libraries*","pinned":false,"hidden":false,"mode":"md"},{"id":4,"value":"import {vl} from '@vega/vega-lite-api-v5'","pinned":false,"hidden":false,"mode":"ojs"},{"id":36,"value":"import {uniqueValid} from '@uwdata/data-utilities'","pinned":false,"hidden":false,"mode":"ojs"},{"id":59,"value":"import { aq, op } from '@uwdata/arquero'","pinned":false,"hidden":false,"mode":"ojs"},{"id":137,"value":"// object containing all of the FiPS us county codes\n\nimport {counties} from \"@d3/choropleth\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":391,"value":"// list of US Holidays\n\nimport {USholidays} from \"@observablehq/microsoft-reactor-hackathon\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":480,"value":"import {Legend, Swatches} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":483,"value":"import {DuckDBClient} from \"@cmudig/duckdb\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":486,"value":"import { palettes } from '@makio135/give-me-colors'","pinned":false,"hidden":false,"mode":"ojs"},{"id":496,"value":"// this is a really cool way of displaying tables. Much more aesthetically pleasing than the defaults of arquero and input.table\n\nimport { formatTable } from \"@saneef/pretty-tables\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":514,"value":"import {textcolor} from \"@observablehq/text-color-annotations-in-markdown\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":519,"value":"import {viewof fileLog} from \"5b757a31fd4f7329\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":456,"value":"md `### *Functions*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":409,"value":"date_parser = d3.utcParse('%m/%d/%Y')","pinned":true,"hidden":false,"mode":"ojs"},{"id":208,"value":"### *Chart configuration*","pinned":false,"hidden":false,"mode":"md"},{"id":1379,"value":"appcast_color_palette = ['#3138BB', '#FF7D6F', '#AF9BFC', '#C7FFE2', '#127FFC', '#FF9B77']","pinned":true,"hidden":false,"mode":"ojs"},{"id":202,"value":"clean_config = ({\n view: { stroke: null },\n axis: {\n gridOpacity: 0.5,\n labelFontWeight: 75,\n domain: false,\n offset: 5,\n titleFontWeight: 350,\n titleFontSize: 10\n },\n axisX: {\n tickCount: 5,\n titlePadding: 10,\n labelPadding: 4\n },\n axisY: {\n ticks: false,\n labelLimit: 300,\n labelFontSize: 7\n },\n title: {\n fontWeight: 300,\n fontSize: 13,\n offset: 25\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":632,"value":"// sample of how to place html blocks in a grid\n\n// html `

\n// ${viewof spend}\n// ${viewof cpl}\n// ${viewof cpc}\n//

`","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}