2f:[] 2d:{"title":"Lyft - Canada","cells":[{"id":0,"value":"md `# Lyft - Canada`","pinned":false,"hidden":false,"mode":"ojs"},{"id":503,"value":"viewof file = Inputs.file({label: \"Data\", required: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":618,"value":"file.name","pinned":true,"hidden":false,"mode":"ojs"},{"id":821,"value":"md `### *Leads*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":724,"value":"Plot.plot({\n height: 200,\n insetTop: 25,\n marginRight: 100,\n width,\n color: {\n legend: true\n },\n x: {\n type: 'utc'\n },\n fy: {\n label: null\n },\n marks: [\n Plot.gridY({ interval: 5 }),\n Plot.axisY({ interval: 5 }),\n Plot.gridX({ interval: d3.utcMonday }),\n Plot.axisX({interval: d3.utcMonday}),\n Plot.lineY(\n campaign_by_day,\n {\n filter: d => d3.utcDay(d.date) <= day,\n x: \"date\",\n y: \"leads\",\n //stroke: \"master_publisher_aggregated\",\n marker: true,\n title: (d) => `${d.leads} leads on ${d3.utcFormat('(%a) %b %d')(d.date)}`,\n thresholds: d3.utcDay,\n //fy: 'master_publisher_aggregated',\n fx: \"title\"\n }\n ),\n Plot.frame()\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":806,"value":"Plot.plot({\n height: 200,\n //insetTop: 25,\n marginRight: 100,\n width,\n color: {\n legend: true\n },\n x: {\n type: 'utc'\n },\n // facet: {\n // padding: 0.5\n // },\n fy: {\n label: null,\n padding: 0.3\n },\n marks: [\n Plot.gridY({ interval: 5 }),\n Plot.axisY({ interval: 5 }),\n Plot.gridX({ interval: d3.utcMonday }),\n Plot.axisX({interval: d3.utcMonday}),\n Plot.lineY(\n campaign_pub_by_day,\n {\n x: \"date\",\n y: \"leads\",\n stroke: \"master_publisher_aggregated\",\n marker: true,\n title: (d) => `${d.leads} leads on ${d3.utcFormat('(%a) %b %d')(d.date)}`,\n thresholds: d3.utcDay,\n fy: 'master_publisher_aggregated',\n fx: \"title\"\n }\n ),\n Plot.frame()\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":824,"value":"md `### *CPL*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":795,"value":"Plot.plot({\n height: 200,\n insetTop: 25,\n marginRight: 100,\n width,\n color: {\n legend: true\n },\n fy: {\n label: null\n },\n marks: [\n Plot.gridY({ interval: 10 }),\n Plot.axisY({ interval: 10, tickFormat: '$.0f'}),\n Plot.gridX({ interval: d3.utcMonday }),\n Plot.axisX({interval: d3.utcMonday}),\n Plot.lineY(\n campaign_by_day,\n {\n x: \"date\",\n y: \"cpl\",\n //stroke: \"master_publisher_aggregated\",\n marker: true,\n title: (d) => `${d3.format('$.1f')(d.cpl)} CPL on ${d3.utcFormat('(%a) %b %d')(d.date)}`,\n thresholds: d3.utcDay,\n //fy: 'master_publisher_aggregated',\n fx: \"title\"\n }\n ),\n Plot.frame()\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":815,"value":"Plot.plot({\n height: 200,\n //insetTop: 25,\n marginRight: 100,\n width,\n color: {\n legend: true\n },\n x: {\n type: 'utc'\n },\n // facet: {\n // padding: 0.5\n // },\n fy: {\n label: null,\n padding: 0.3\n },\n marks: [\n Plot.gridY({ interval: 15 }),\n Plot.axisY({ interval: 15, tickFormat: '$.0f' }),\n Plot.gridX({ interval: d3.utcMonday }),\n Plot.axisX({interval: d3.utcMonday}),\n Plot.lineY(\n campaign_pub_by_day,\n {\n x: \"date\",\n y: \"cpl\",\n stroke: \"master_publisher_aggregated\",\n marker: true,\n title: (d) => `${d3.format('$.1f')(d.cpl)} cpl on ${d3.utcFormat('(%a) %b %d')(d.date)}`,\n thresholds: d3.utcDay,\n fy: 'master_publisher_aggregated',\n fx: \"title\"\n }\n ),\n Plot.frame()\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":842,"value":"viewof day = Scrubber(d3.sort(d3.union(campaign_by_day.objects().map((d) => d3.utcDay(d.date)))), {loop: false, delay: 130, autoplay: false, format: date => date.toLocaleString(\"en\", {month: \"long\", day: \"numeric\"})})","pinned":false,"hidden":false,"mode":"ojs"},{"id":864,"value":"Plot.plot({\n insetBottom: 25,\n insetLeft: 25,\n insetRight: 25,\n width,\n //aspectRatio: 2,\n grid: true,\n r: {\n range: [5,20]\n },\n facet: {\n data: campaign_by_day,\n x: 'title'\n },\n marks: [\n Plot.frame({strokeOpacity: 0.25}),\n Plot.line(campaign_by_day, {\n filter: d => d.date < day,\n x: 'leads',\n y: 'cpl',\n stroke: '#f6dc37',\n facet: true\n }),\n Plot.dot(campaign_by_day ,{\n filter: d => d.date < day,\n x: 'leads',\n y: 'cpl',\n r: 'bgc',\n fill: '#f6dc37',\n stroke: '#ceba36',\n facet: true\n }),\n Plot.text(campaign_by_day, {\n filter: d => d.date < day,\n x: 'leads',\n y: 'cpl',\n text: d => `${op.utcdate(d.date)}`,\n })\n ]\n})","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":877,"value":"viewof color = Inputs.color({label: \"Favorite color\", value: \"#4682b4\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":198,"value":"### *Data*","pinned":false,"hidden":false,"mode":"md"},{"id":728,"value":"viewof campaign_by_day = clean\n .filter(d => d.title === 'YYC' || d.title === 'YEG')\n .filter(d => d.master_publisher_aggregated !== null)\n .derive({\n date: aq.escape(d => d3.utcDay(d.date))\n })\n //.groupby('date', 'title', 'master_publisher_aggregated')\n .groupby('date', 'title')\n .rollup({\n leads: d => op.sum(d.leads),\n spend: d => op.sum(d.spend),\n bgc: d => op.sum(d.bgc)\n })\n .derive({\n cpl: d => d.spend / d.leads\n })\n .orderby('date')\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":803,"value":"viewof campaign_pub_by_day = clean\n .filter(d => d.title === 'YYC' || d.title === 'YEG')\n .filter(d => d.master_publisher_aggregated !== null)\n .derive({\n date: aq.escape(d => d3.utcDay(d.date))\n })\n .groupby('date', 'title', 'master_publisher_aggregated')\n //.groupby('date', 'title')\n .rollup({\n clicks: d => op.sum(d.clicks),\n leads: d => op.sum(d.leads),\n spend: d => op.sum(d.spend)\n })\n .derive({\n cpl: d => d.spend / d.leads\n })\n .orderby('date')\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":508,"value":"viewof clean = aq.from(raw_data)\n .view()","pinned":true,"hidden":false,"mode":"ojs"},{"id":505,"value":"raw_data = file.csv({typed: true})","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 = v_data['zipcodes.csv'].url","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":59,"value":"import { aq, op } from '@uwdata/arquero'","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":844,"value":"import {Scrubber} from \"@mbostock/scrubber\"","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":702,"value":"import {toc} from \"@nebrius/indented-toc\"","pinned":true,"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":710,"value":"appcast_color_palette = ['#05062C', '#3138BB','#FF7D6F', '#AF9BFC', '#C7FFE2', '#127FFC', '#FF9B77', '#B7D8FE', '#DAE2FD', '#FAFAFA']","pinned":false,"hidden":false,"mode":"ojs"},{"id":717,"value":"Plot.cell(appcast_color_palette, {x: d => d, fill: d => d}).plot()","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":"$W2f","stdlib":"1","titling":"auto"}