43:["$","title",null,{"children":"Top 1946 Manufacturer Totals by Year | Bob Gale | Observable"}] 4b:Te71,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 }; svg.append("g").call(xAxis); svg.append("g").call(yAxis); // manuf rows const segment = svg.append("g") .style("font", "bold 16px sans-serif") .selectAll("g") .data(series) .enter().append("g") .attr("transform", (d, i) => `translate(${margin.left}, ${i * size + margin.top})`) ; // row banding segment.append("rect") .attr("x", 0) .attr("y", 0) .attr("width",`${width}`) .attr("height",`${size}`) .attr("fill",(d, i) => (i % 2) == 0 ? "#fff" : "#f2f2f2" ); // year lines segment.each(function(d, i) { d3.select(this) .append("path") // .datum(d.values.filter(v => v.date > new Date("1929"))) .datum(d.values) .attr("fill", "none") .attr("stroke", "steelblue") .attr("stroke-width", 3) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line) }); // invisible bars to catch mouseover for tooltip segment.each(function(d, i) { let manuf = d.key d3.select(this) .append("g") .attr("fill-opacity", 0) .selectAll("rect") // .data(d.values.filter(v => v.year > "1929")) .data(d.values).enter().append("rect") .attr("x", d => x(d.key) - x.bandwidth() / 2) // changed .attr("y", d => 0) .attr("height", d => y(0)) .attr("width", x.bandwidth()) .on("mouseover", function(d) { d3.select(this).attr("fill-opacity", .1) tooltip.style("visibility", "visible") .html(` ` ) tooltip_chart( top_manuf_year_models(manuf, d.key, 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("fill-opacity", 0) tooltip.style("visibility", "hidden") }) }); // Manufacturer name and total segment.append("text") .attr("transform", (d, i) => `translate(${margin.left + 80}, ${size / 2})`) .attr("text-anchor", "end") .attr("alignment-baseline", "middle") .text(d => d.key); segment.append("text") .style("font", "normal 16px sans-serif") .attr("transform", (d, i) => `translate(${margin.left + 90}, ${size / 2})`) .attr("text-anchor", "start") .attr("alignment-baseline", "middle") .text(d => num_format(d.total)); // callout 1946 count segment.append("text") .datum(d => d.values.filter(v => v.key > "1945")[0]) // changed .style("font", "normal 12px sans-serif") .attr("fill", "darkslategrey") .attr("stroke-width", 1.5) .attr("x", d => x(d.key)) // changed .attr("y", d => y(d.value) - 10) .attr("dy", "0.35em") .attr("text-anchor", "start") .text(d => num_format(d.value)) return svg.node(); }4c:T62e,tooltip_chart = function(data, n = 10) { const tooltip_height = n * 20 + tooltip_margin.top + tooltip_margin.bottom; const svg = d3.select("#top_models_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.model)) .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} Models`); svg.append("g") .attr("fill", "steelblue") .selectAll("rect") .data(data) .enter().append("rect") .attr("x", x(0)) .attr("y", d => y(d.model)) .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.model) + y.bandwidth() / 2) .attr("dy", "0.35em") .text(d => num_format(d.count)); svg.append("g").call(yAxis); return svg.node()}4d:T869,style = html` ` 4e:[] 47:{"id":"ad5149cc05c4d36e","slug":"top-1946-manufacturer-totals-by-year","title":"Top 1946 Manufacturer Totals by Year","thumbnail":"9e38ef1b355ea786c135faa37b30be0a2e830f30c9e878a8a52d364bd8c75b24","access_level":"public","create_time":"$D2018-09-21T00:14:59.899Z","update_time":"$D2019-05-27T22:52:20.612Z","view_time":null,"first_public_time":"$D2018-09-22T23:22:39.793Z","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":970,"publish_version":970,"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":0,"collection":{"id":"ef7fd8c69a899ff2","slug":"faa","title":"FAA","owner":{"id":"65e571f85b73b04b","login":"bawbgale","name":"Bob Gale"}},"type":"notebook","body":{"titling":"auto","title":"Top 1946 Manufacturer Totals by Year","cells":[{"id":1,"value":"md`# Top 1946 Manufacturer Totals by Year\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":29,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":468,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":283,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"height = 350","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":462,"value":"tooltip_width = 300","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":153,"value":"size = (height - margin.top - margin.bottom - (series.length + 1) * padding) / series.length + padding","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":150,"value":"padding = 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"margin = ({top: 10, right: 10, 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":466,"value":"tooltip_margin = ({top: 20, right: 80, bottom: 10, left: 120})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":341,"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":544,"value":"x = d3.scaleBand()\n .domain(x_domain)\n .range([margin.left, width - margin.right])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"y = d3.scaleLinear()\n .domain(y_domain).nice()\n .range([size - padding / 2, padding / 2])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":940,"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":956,"value":"y_domain = [0, d3.max(series_values.map(d => d3.max(d.values, d => d.value)))]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"xAxis = g => g\n .attr(\"class\", \"axis\")\n .attr(\"transform\", `translate(0,${height - margin.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 .call(g => g.select(\".domain\").remove())\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"yAxis = {\n const axis = d3.axisLeft()\n .ticks(6)\n .tickSize(-size * series.length);\n return g => g.selectAll(\"g\").data(y).enter().append(\"g\")\n .attr(\"transform\", (d, i) => `translate(0,${i * size})`)\n .each(function(d) { return d3.select(this).call(axis.scale(d)); })\n .call(g => g.select(\".domain\").remove())\n .call(g => g.selectAll(\".tick line\").attr(\"stroke\", \"#ddd\"));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"line = d3.line()\n .x(d => x(d.key))\n .y(d => y(d.value))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":790,"value":"top_manuf_year_models = function(manuf, year, n) {\n const manuf_data = data.filter(d => d.manuf == manuf)\n const year_data = manuf_data.filter(d => d.year == year)\n return year_data.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":460,"value":"top_manuf_test = top_manuf_year_models(\"Piper\",\"1946\",10)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":335,"value":"series = series_values.map(\n function(item) {\n return {\n key: item.key,\n total: series_totals.find(x => x.key == item.key).value,\n values: item.values,\n }\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":707,"value":"series_sort = [\"Cessna\", \"Piper\", \"Aeronca\", \"Taylorcraft\", \"ERCO\", \"Other\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":873,"value":"series_values = d3.nest()\n .key(d => d.manuf).sortKeys((a,b) => { return series_sort.indexOf(a) - series_sort.indexOf(b)})\n .key(d => d.year).sortKeys(d3.ascending)\n .rollup(v => d3.sum(v, d => d.count))\n .entries(data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":898,"value":"series_totals = d3.nest()\n .key(d => d.manuf).sortKeys((a,b) => { return series_sort.indexOf(a) - series_sort.indexOf(b)})\n .rollup(v => d3.sum(v, d => d.count))\n .entries(data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":697,"value":"data = d3.csv(\"https://gist.githubusercontent.com/bawbgale/e2b0eea40d9d89a6962589e5b134a5b9/raw/3118777eb674786b89a9889b200977a4958ee6dc/faa_2018_1946_builders_aircraft_count_by_manuf_model_model.csv\", (d) => {\n return { \n manuf: d[\"Aircraft Manufacturer (group with other)\"],\n // manuf: d[\"Aircraft Manufacturer (group)\"],\n model: d[\"Aircraft Model (for Other)\"],\n year: +d[\"Year of Year Manufactured\"],\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