41:null 42:["$","title",null,{"children":"Shirts I'm wearing, per day | Joe Murphy | Observable"}] 48:T7a2,{ const height = 200; const width = 500; const color = 'f00'; const margin = { top: 30, right: 0, bottom: 30, left: 40 }; const y_label = 'Shirts'; const parseTime = d3.timeParse('%Y-%m-%d'); const shortMonth = d3.timeFormat('%b'); const fullMonth = d3.timeFormat('%B'); const formatDay = d3.timeFormat('%d'); const TICKEVERY = 40; data.forEach(d => { d.dateObj = parseTime(d.date); }); const svg = d3.select("svg#gfx").attr("viewBox", [0, 0, width, height]); var x = d3 .scaleBand() .domain(d3.range(data.length)) .range([margin.left, width - margin.right]) .padding(0); var y = d3 .scaleLinear() .domain([0, 14]) .nice() .range([height - margin.bottom, margin.top]); var xAxis = g => g.attr("transform", `translate(0,${height - margin.bottom})`).call( d3 .axisBottom(x) .tickFormat(function(d, i, f) { // Don't show all the ticks if (i % TICKEVERY !== 0) return ''; var day = formatDay(data[i].dateObj); var month = fullMonth(data[i].dateObj); return `${fullMonth(data[i].dateObj)} ${day.replace('0', '')}`; }) .tickSizeOuter(0) ); var yAxis = g => g .attr("transform", `translate(${margin.left},0)`) .call(d3.axisLeft(y).ticks(null, data.format)) .call(g => g.select(".domain").remove()) .call(g => g .append("text") .attr("x", -margin.left) .attr("y", 10) .attr("fill", "currentColor") .attr("text-anchor", "start") .text(y_label) ); svg .append("g") .attr("fill", color) .selectAll("rect") .data(data) .join("rect") .attr("x", (d, i) => x(i)) .attr("y", d => y(d['shirts'])) .attr("height", d => y(0) - y(d['shirts'])) .attr("width", x.bandwidth()); svg.append("g").call(xAxis); svg.append("g").call(yAxis); return svg.node(); }49:[] 46:{"id":"910021d8e8a84851","slug":"shirts-im-wearing-per-day","title":"Shirts I'm wearing, per day","thumbnail":"c18f031006a33e8397edcd2e01fb85dfebdc201b3f10854e8d9426ebeae8421f","access_level":"public","create_time":"$D2020-05-24T18:20:08.187Z","update_time":"$D2020-12-27T20:35:15.934Z","view_time":null,"first_public_time":"$D2020-06-19T14:26:24.706Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"a6af4dee8234e6ec","login":"freejoe76","name":"Joe Murphy","avatar_url":"https://avatars-next.observableusercontent.com/4ae4fb28e742e65da2e82a2957dc148c74ca8a34da7d17d55f936390a5d34dba","tier":"starter_2024","bio":"Data editor @ NBC News.","following":false},"version":200,"publish_version":200,"role":null,"authored":false,"authors":[{"type":"individual","id":"c2537b21a76a81f1","login":"freejoe76","name":"Joe Murphy","avatar_url":"https://avatars-next.observableusercontent.com/4ae4fb28e742e65da2e82a2957dc148c74ca8a34da7d17d55f936390a5d34dba","tier":null,"bio":"Data editor @ NBC News.","following":false}],"members":[{"type":"individual","id":"c2537b21a76a81f1","login":"freejoe76","name":"Joe Murphy","avatar_url":"https://avatars-next.observableusercontent.com/4ae4fb28e742e65da2e82a2957dc148c74ca8a34da7d17d55f936390a5d34dba","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"2e12a63a58b84895","slug":"shirt-color-data","title":"shirt-data","owner":{"id":"a6af4dee8234e6ec","login":"freejoe76","name":"Joe Murphy"}},"type":"notebook","body":{"titling":"auto","title":"Shirts I'm wearing, per day","cells":[{"id":2,"value":"html`

Shirts I'm wearing, per day

A simple bar chart.

\n \n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"$48","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":0,"value":"data = d3.csv(\"https://joemurph.com/app/ss/csv/shirts.csv\")\n//data = d3.csv(\"https://docs.google.com/spreadsheets/d/e/2PACX-1vT3C9S-pXtVU6ekAxpvFd2gkcA4cSflFmh_nrtAVPeYHireArSKCelxPh45leRy6Q9Or8VRi3z3emHV/pub?gid=1527873357&single=true&output=csv\")\n//","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W49","stdlib":"1"}} 47:"$46:body"