43:["$","title",null,{"children":"2018 Registered Aircraft by Year Built | Bob Gale | Observable"}] 4b:T1270,chart = { const svg = d3.select(DOM.svg(width, height)); const tooltop_offset = 10; // tooltip invoked on mouseover const tooltip = d3.select("body") .append("div") .attr("class","tooltip") .style("width",tooltip_width) ; const tooltip_pos_x = function(pageX) { const max_x = width - margin.left - tooltip_width return pageX > max_x - tooltop_offset ? max_x + tooltop_offset : pageX + tooltop_offset }; const tooltip_pos_y = function(pageY) { return pageY + tooltop_offset }; // grid line first, so they display behind the bars svg.append("g").call(yGridLines); // main data bars svg.append("g") .attr("fill", "steelblue") .selectAll("rect").data(data).enter().append("rect") .attr("x", d => x(d.year)) .attr("y", d => y(d.count)) .attr("height", d => y(0) - y(d.count)) .attr("width", x.bandwidth()) .on("mouseover", function(d) { d3.select(this).attr("stroke", "black") tooltip.style("visibility", "visible") .html(` ` ) tooltip_chart( top_year_manufacturers(d.year, 10) ) }) .on("mousemove", function() { tooltip.style("left",tooltip_pos_x(d3.event.pageX)+"px").style("top", tooltip_pos_y(d3.event.pageY)+"px") }) .on("mouseout", function() { d3.select(this).attr("stroke", "none") tooltip.style("visibility", "hidden") }) ; svg.append("g").call(xAxis); // callout on highest data point const callout_text = svg.append("g") .selectAll("text").data(data).enter() .filter(function(d, i) { return d.count == d3.max(data, d => d.count); }) .append("text") .attr("class", "callout") callout_text.append("tspan") .attr("x", d => x(d.year) + 40) .attr("y", d => y(d.count) + 36) .attr("class", "bold") .text(d => `${num_format(d.count)} `) callout_text.append("tspan") .text(d => `aircraft`) callout_text.append("tspan") .attr("x", d => x(d.year) + 40) .attr("y", d => y(d.count) + 56) .text(d => `built in `) callout_text.append("tspan") .attr("class", "bold") .text(d => `${d.year}`) callout_text.append("tspan") .attr("x", d => x(d.year) + 40) .attr("y", d => y(d.count) + 76) .text(d => `are still flying!`) ; const callout_box = svg.append("g") .selectAll("text").data(data).enter() .filter(function(d, i) { return d.count == d3.max(data, d => d.count); }) .append("g") .attr("class","callout-line") callout_box.append("line") .attr("x1", d => x(d.year) + x.bandwidth()) .attr("y1", d => y(d.count / 2)) .attr("x2", d => x(d.year) + x.bandwidth() + 24) .attr("y2", d => y(d.count) + 52) callout_box.append("line") .attr("x1", d => x(d.year) + x.bandwidth() + 24) .attr("y1", d => y(d.count) + 22) .attr("x2", d => x(d.year) + x.bandwidth() + 24) .attr("y2", d => y(d.count) + 82) ; // big number const big_number = svg.append("g") .selectAll("g") .data(aircraft_count) .enter().append("g") ; big_number.append("text") .attr("x", margin.left) .attr("y", margin.top + 60) .attr("class","big-number") .text(d => `${num_format(d.count)}`) big_number.append("text") .attr("x", margin.left) .attr("y", margin.top + 82) .attr("class","big-number-label") .text(d => `Aircraft Registered in U.S.`) svg.append("g") .selectAll("g") .data(stack_data) .enter().append("g") .attr("fill", (d, i) => stack_color(d.key)) .selectAll("rect") .data(d => d) .enter().append("rect") .attr("x", d => margin.left + stack_x(d[0])) .attr("y", margin.top + 94) .attr("width", d => stack_x(d[1]) - stack_x(d[0])) .attr("height", stack_bar_height) ; const has_year_percent = function(d) { return d.true / (d.true + d.false) } svg.append("g") .attr("class","stack-label") .selectAll("text") .data(stack_data) .enter() .filter(function(d, i) { return d.key == "true"; }) .append("text") .attr("x", margin.left + 6) .attr("y", margin.top + 104) .attr("dy", "0.35em") .text(d => `${perc_format(has_year_percent(d[0]["data"]))} Include Year`) ; return svg.node(); }4c:T868,style = html` `4d:T649,tooltip_chart = function(data, n = 10) { const tooltip_height = n * 20 + tooltip_margin.top + tooltip_margin.bottom; const svg = d3.select("#top_manuf_tooltip_chart") .append("svg") .attr("width", tooltip_width) .attr("height", tooltip_height); const x = d3.scaleLinear() .domain([0, d3.max(data, d => d.count)]) .range([tooltip_margin.left, tooltip_width - tooltip_margin.right]); const y = d3.scaleBand() .domain(data.map(d => d.manufacturer)) .range([tooltip_margin.top, tooltip_height - tooltip_margin.bottom]) .padding(0.3); const yAxis = g => g .attr("class", "axis") .attr("transform", `translate(${tooltip_margin.left},0)`) .call(d3.axisLeft(y).tickSize(0)) .call(g => g.select(".domain").remove()); svg.append("text") .attr("class", "tooltip-heading") .attr("x", 0) .attr("y", tooltip_margin.top) .text(`Top ${n} Manufacturers`); svg.append("g") .attr("fill", "steelblue") .selectAll("rect") .data(data) .enter().append("rect") .attr("x", x(0)) .attr("y", d => y(d.manufacturer)) .attr("width", d => x(d.count) - x(0)) .attr("height", y.bandwidth()); svg.append("g") .attr("class", "label") .attr("text-anchor", "start") .selectAll("text") .data(data) .enter().append("text") .attr("x", d => x(d.count) + 4) .attr("y", d => y(d.manufacturer) + y.bandwidth() / 2) .attr("dy", "0.35em") .text(d => num_format(d.count)); svg.append("g").call(yAxis); return svg.node()}4e:[] 47:{"id":"342ccc9a26eb5da5","slug":"2018-registered-aircraft-by-year-built","title":"2018 Registered Aircraft by Year Built","thumbnail":"465bb334a3fb091bb4119e65e644e9c832f98705d02007702042b72ebe989786","access_level":"public","create_time":"$D2018-09-14T20:26:33.743Z","update_time":"$D2018-11-28T19:12:24.523Z","view_time":null,"first_public_time":"$D2018-09-22T23:22:33.391Z","has_unpublished_edits":null,"fork":true,"stars":1,"starred":false,"owner":{"type":"team","id":"65e571f85b73b04b","login":"bawbgale","name":"Bob Gale","avatar_url":"https://avatars-next.observableusercontent.com/d8f4f2ad3660bd22cf54bff177e1d03e6c855c88d7b3f662c039fef0914a3a1d","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":882,"publish_version":882,"role":null,"authored":false,"authors":[{"type":"individual","id":"7a0f95d9e8326d5e","login":"bawbgale","name":"Bob Gale","avatar_url":"https://avatars-next.observableusercontent.com/d8f4f2ad3660bd22cf54bff177e1d03e6c855c88d7b3f662c039fef0914a3a1d","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"7a0f95d9e8326d5e","login":"bawbgale","name":"Bob Gale","avatar_url":"https://avatars-next.observableusercontent.com/d8f4f2ad3660bd22cf54bff177e1d03e6c855c88d7b3f662c039fef0914a3a1d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":{"id":"ef7fd8c69a899ff2","slug":"faa","title":"FAA","owner":{"id":"65e571f85b73b04b","login":"bawbgale","name":"Bob Gale"}},"type":"notebook","body":{"titling":"auto","title":"2018 Registered Aircraft by Year Built","cells":[{"id":1,"value":"md`# 2018 Registered Aircraft by Year Built\nOne chart for a larger dashboard based on [FAA Aircraft Registry data](https://www.faa.gov/licenses_certificates/aircraft_certification/aircraft_registry/). \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":213,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"height = 300","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"margin = ({top: 10, right: 0, bottom: 20, left: 20})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":209,"value":"num_format = d3.format(\",\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":409,"value":"perc_format = d3.format(\".2%\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":879,"value":"x_domain = d3.range(1910,2019)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"x = d3.scaleBand()\n // .domain(data.map(d => d.year))\n .domain(x_domain)\n .range([margin.left, width - margin.right])\n .padding(0.1)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"y = d3.scaleLinear()\n .domain([0, d3.max(data, d => d.count)]).nice()\n .range([height - margin.bottom, margin.top])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"xAxis = function(g) { \n g\n .attr(\"class\", \"axis\")\n .attr(\"transform\", `translate(0,${height - margin.bottom})`) // moves axis to bottom\n .call(d3.axisBottom(x)\n .tickSizeOuter(0) // removes the \"end\" ticks\n .tickValues(x.domain().filter(function(d, i) { return !(d % 10); } )) // label only decades\n )\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":206,"value":"yGridLines = function(g) {\n g\n .attr(\"class\", \"grid\")\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y)\n .ticks(5) // number of ticks, not interval\n .tickSize(-width-margin.left) // ticks normally extend 'out' of the chart. - makes these extend 'in'\n .tickFormat(\"\") // no labels\n )\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":744,"value":"tooltip_margin = ({top: 20, right: 80, bottom: 10, left: 160})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":746,"value":"tooltip_width = 350","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":748,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":371,"value":"stack_x = d3.scaleLinear()\n .domain([0, d3.max(stack_data, d => d[0][1])] )\n .rangeRound([0, stack_width])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"stack_height = 120","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":451,"value":"stack_bar_height = 20","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":377,"value":"stack_width = 162","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":380,"value":"stack_color = d3.scaleOrdinal(d3.schemeGreys[3]).domain([\"foo\",false,true])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":838,"value":"aircraft_manuf_year_counts = d3.nest()\n .key(d => has_year(d.year) ? d.year : null)\n .key(d => d.manuf)\n .rollup(v => d3.sum(v, d => d.count))\n .entries(faa_2018_aircraft_count_by_year_manuf)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":843,"value":"top_year_manufacturers = function(year, n) {\n const year_data = aircraft_manuf_year_counts.find(d => d.key == year).values\n return year_data\n .map(d => {return {\"manufacturer\": d.key, \"count\": d.value } })\n .sort( (x,y) => d3.descending(x.count, y.count) ).slice(0, n)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":847,"value":"test = top_year_manufacturers(\"1946\",10)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":823,"value":"data = d3.nest()\n .key(d => has_year(d.year) ? d.year : null)\n .rollup(v => d3.sum(v, d => d.count))\n .entries(faa_2018_aircraft_count_by_year_manuf)\n .filter(d => d.key != \"null\")\n .map(d => {return {\"year\": d.key, \"count\": d.value } })\n .sort((a,b) => d3.ascending(a.year, b.year))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":812,"value":"stack_data = d3.stack()\n .keys([\"true\",\"false\"])\n (aircraft_has_year_counts)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":783,"value":"aircraft_has_year_counts = [\n d3.nest()\n .key(d => { return has_year(d.year) })\n .rollup(v => d3.sum(v, d => d.count))\n .entries(faa_2018_aircraft_count_by_year_manuf)\n .reduce((obj, item) => Object.assign(obj, {[item.key]: item.value}) ,{})\n ]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":818,"value":"has_year = function(year) { return +year > 1900 } ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":777,"value":"aircraft_count = [\n { count: d3.nest()\n .rollup(v => d3.sum(v, d => d.count))\n .entries(faa_2018_aircraft_count_by_year_manuf)\n }\n ]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":772,"value":"faa_2018_aircraft_count_by_year_manuf = d3.csv(\"https://gist.githubusercontent.com/bawbgale/2c7fca991253ebeca75fcb454c4e8595/raw/ec9cab97bb122f6f4a6ee02f5715fca7c2fd7ba1/faa_2018_aircraft_count_by_year_manuf.csv\", (d) => {\n return { \n year: +d[\"Year\"],\n manuf: d[\"Manuf\"],\n count: +d[\"Aircraft Count\"]\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4e","stdlib":"1"}} 42:null