32:Tb43,mapOver65 = { const width = 960; const height = 600; const rateFormat = d3.format('.2r'); const projection = d3 .geoAlbers() .rotate([0, 62, 0]) .fitSize([width-40, height], nc); const path = d3.geoPath(projection); const svg = d3.select(DOM.svg(width, height)) .style("width", "100%") .style("height", "auto"); svg.append("rect") .attr("width", "100%") .attr("height", "100%") .attr("fill", "#fff"); svg.append("g") .selectAll("path") .data(nc.features) .enter() .append("path") .attr("d", path) .attr("transform", "translate(20, 0)") .attr("class", "counties") .attr("stroke", "#fff") .style("stroke-width", 2) .style("fill", d=>getFillOver65(d.properties.county)) .on("mouseover", function(d){ this.parentNode.appendChild(this); d3.select(this) .classed("selected", true); svg.selectAll(".mapCaption").text(`${d.properties.county} County: ${dataMap.get(d.properties.county).pc_per_65}`) }) .on("mouseout", function(d){ svg.selectAll(".mapCaption").text(`North Carolina: ${ncData.pc_per_65}`); d3.select(this) .classed("selected", false); }); const titleText = svg.append("text").attr("transform", "translate(20, 40)").style("fill", "#4b4b4b"); titleText .append("tspan") .attr("class", "mapTitle") .attr("font-size", "1.4rem") .text(`Primary Care Physicians per 10,000 Residents 65 and older, North Carolina, 2017`); titleText .append("tspan") .attr("class", "mapCaption") .attr("font-size", "1rem") .text(`North Carolina: ${dataMap.get("State")}`) .attr("dy", "1.4em") .attr("x", 0); let urbanized = svg.append("g") .selectAll("path") .data(nc_urbanized_areas.features) .enter() .append("path") .attr("d", path) .attr("transform", "translate(20, 0)") .attr("class", "urbanized-areas") .attr("stroke", "#4b4b4b") .style("stroke-width", 1) .style("fill", "none") .style("pointer-events", "none"); const legend = svg.append("g") .attr("class", "legend") .attr("transform", "translate(50,375)"); legend.node().appendChild(createLegendCells(colorScaleOver65, "Primary Care Physicians per 10,000 Residents 65 and older")); svg.selectAll(".legend-title").call(wordWrap, 35); svg.node().appendChild(urbanizedExample.cloneNode()); svg.append("text").attr("transform", "translate(280, 465)").style("fill", "#4b4b4b").text("Census Urbanized Areas"); // d3.select(svg.node().appendChild(urbanized.node().parentNode.cloneNode(true))) // .attr("transform","translate(20,20)"); return svg.node(); }33:Tb24,mapUnder18 = { const width = 960; const height = 600; const rateFormat = d3.format('.2r'); const projection = d3 .geoAlbers() .rotate([0, 62, 0]) .fitSize([width-40, height], nc); const path = d3.geoPath(projection); const svg = d3.select(DOM.svg(width, height)) .style("width", "100%") .style("height", "auto"); svg.append("rect") .attr("width", "100%") .attr("height", "100%") .attr("fill", "#fff"); svg.append("g") .selectAll("path") .data(nc.features) .enter() .append("path") .attr("d", path) .attr("transform", "translate(20, 0)") .attr("class", "counties") .attr("stroke", "#fff") .style("stroke-width", 2) .style("fill", d=>getFillUnder18(d.properties.county)) .on("mouseover", function(d){ this.parentNode.appendChild(this); d3.select(this) .classed("selected", true); svg.selectAll(".mapCaption").text(`${d.properties.county} County: ${dataMap.get(d.properties.county).peds_per_18}`)}) .on("mouseout", function(d){ svg.selectAll(".mapCaption").text(`North Carolina: ${ncData.peds_per_18}`) d3.select(this) .classed("selected", false); }); const titleText = svg.append("text").attr("transform", "translate(20, 40)").style("fill", "#4b4b4b"); titleText .append("tspan") .attr("class", "mapTitle") .attr("font-size", "1.4rem") .text(`Pediatricians per 10,000 Residents Under 18, North Carolina, 2017`); titleText .append("tspan") .attr("class", "mapCaption") .attr("font-size", "1rem") .text(`North Carolina: ${dataMap.get("State")}`) .attr("dy", "1.4em") .attr("x", 0); let urbanized = svg.append("g") .selectAll("path") .data(nc_urbanized_areas.features) .enter() .append("path") .attr("d", path) .attr("transform", "translate(20, 0)") .attr("class", "urbanized-areas") .attr("stroke", "#4b4b4b") .style("stroke-width", 1) .style("fill", "none") .style("pointer-events", "none"); const legend = svg.append("g") .attr("class", "legend") .attr("transform", "translate(50,375)"); legend.node().appendChild(createLegendCells(colorScaleUnder18, "Pediatricians per 10,000 Residents Under 18")); svg.selectAll(".legend-title").call(wordWrap, 25); svg.node().appendChild(urbanizedExample.cloneNode()); svg.append("text").attr("transform", "translate(280, 465)").style("fill", "#4b4b4b").text("Census Urbanized Areas"); // d3.select(svg.node().appendChild(urbanized.node().parentNode.cloneNode(true))) // .attr("transform","translate(20,20)"); return svg.node(); }34:Tfd3,age_to_provider = d3.tsvParse(`fips county under18 over65inclusive peds_total pc_total pc_per_65 peds_per_18 37001 Alamance 35590 26888 31 111 41.3 8.71 37003 Alexander 7755 7463 0 12 16.1 0 37005 Alleghany 1985 2827 0 5 17.7 0 37007 Anson 5228 4370 1 5 11.4 1.91 37009 Ashe 4914 6675 0 11 16.5 0 37011 Avery 2794 3823 0 9 23.5 0 37013 Beaufort 9746 11257 5 20 17.8 5.13 37015 Bertie 3813 3885 1 6 15.4 2.62 37017 Bladen 7220 6749 3 15 22.2 4.16 37019 Brunswick 22223 38193 11 61 16 4.95 37021 Buncombe 50157 50493 38 339 67.1 7.58 37023 Burke 18250 17602 3 70 39.8 1.64 37025 Cabarrus 51357 26767 33 158 59 6.43 37027 Caldwell 16772 15635 8 41 26.2 4.77 37029 Camden 2148 1655 0 0 0 0 37031 Carteret 12217 16820 7 32 19 5.73 37033 Caswell 4307 4719 1 5 10.6 2.32 37035 Catawba 34785 26872 16 111 41.3 4.6 37037 Chatham 14164 18585 3 25 13.5 2.12 37039 Cherokee 5030 8330 3 9 10.8 5.96 37041 Chowan 2928 3370 2 12 35.6 6.83 37043 Clay 1992 3394 0 4 11.8 0 37045 Cleveland 21177 17750 17 59 33.2 8.03 37047 Columbus 12156 10527 6 31 29.4 4.94 37049 Craven 26367 17581 16 75 42.7 6.07 37051 Cumberland 88187 40093 41 184 45.9 4.65 37053 Currituck 5490 4185 0 8 19.1 0 37055 Dare 6922 7545 5 26 34.5 7.22 37057 Davidson 36190 28883 20 57 19.7 5.53 37059 Davie 8645 8425 4 13 15.4 4.63 37061 Duplin 14378 10173 4 17 16.7 2.78 37063 Durham 72075 37088 94 354 95.4 13 37065 Edgecombe 12240 10023 7 30 29.9 5.72 37067 Forsyth 87089 57141 97 414 72.5 11.1 37069 Franklin 14731 10850 1 5 4.61 0.679 37071 Gaston 49525 34377 25 118 34.3 5.05 37073 Gates 2332 2238 0 0 0 0 37075 Graham 1827 2085 1 3 14.4 5.47 37077 Granville 11904 9646 2 41 42.5 1.68 37079 Greene 4559 3325 2 8 24.1 4.39 37081 Guilford 115594 77657 83 401 51.6 7.18 37083 Halifax 11130 10207 5 27 26.5 4.49 37085 Harnett 35563 16255 13 53 32.6 3.66 37087 Haywood 11320 15468 7 41 26.5 6.18 37089 Henderson 22210 30345 14 88 29 6.3 37091 Hertford 4739 4360 5 20 45.9 10.6 37093 Hoke 16535 4954 5 17 34.3 3.02 37095 Hyde 965 1073 0 1 9.32 0 37097 Iredell 39465 27159 31 125 46 7.86 37099 Jackson 7452 8185 6 31 37.9 8.05 37101 Johnston 49060 25210 8 66 26.2 1.63 37103 Jones 2031 2105 0 6 28.5 0 37105 Lee 14845 9464 8 38 40.2 5.39 37107 Lenoir 12774 10940 6 27 24.7 4.7 37109 Lincoln 17294 14165 11 45 31.8 6.36 37113 Macon 6540 10003 4 31 31 6.12 37115 Madison 4024 4838 5 16 33.1 12.4 37117 Martin 4830 5098 2 14 27.5 4.14 37111 McDowell 9207 9173 4 21 22.9 4.34 37119 Mecklenburg 258943 117595 244 955 81.2 9.42 37121 Mitchell 2762 3568 2 12 33.6 7.24 37123 Montgomery 6170 5561 1 7 12.6 1.62 37125 Moore 20190 25290 14 70 27.7 6.93 37127 Nash 20270 17021 14 58 34.1 6.91 37129 New Hanover 42813 38181 37 185 48.5 8.64 37131 Northampton 3877 4744 0 4 8.43 0 37133 Onslow 57324 17969 16 69 38.4 2.79 37135 Orange 26394 19188 75 292 152 28.4 37137 Pamlico 2061 3702 1 7 18.9 4.85 37139 Pasquotank 9259 6190 7 31 50.1 7.56 37141 Pender 12678 10804 2 17 15.7 1.58 37143 Perquimans 2547 3565 0 2 5.61 0 37145 Person 8392 7476 3 14 18.7 3.57 37147 Pitt 38786 22094 47 203 91.9 12.1 37149 Polk 3449 6157 0 9 14.6 0 37151 Randolph 32302 24645 7 48 19.5 2.17 37153 Richmond 10249 7798 3 20 25.6 2.93 37155 Robeson 32156 19170 12 58 30.3 3.73 37157 Rockingham 18741 17817 8 47 26.4 4.27 37159 Rowan 31849 23889 13 69 28.9 4.08 37161 Rutherford 13966 13949 5 25 17.9 3.58 37163 Sampson 15538 10770 2 28 26 1.29 37165 Scotland 8344 6276 5 24 38.2 5.99 37167 Stanly 13169 11557 8 29 25.1 6.07 37169 Stokes 8706 9201 3 18 19.6 3.45 37171 Surry 15262 14051 6 51 36.3 3.93 37173 Swain 3499 2901 3 14 48.3 8.57 37175 Transylvania 5633 10592 6 31 29.3 10.7 37177 Tyrrell 767 813 0 0 0 0 37179 Union 58098 28223 20 99 35.1 3.44 37181 Vance 10608 7819 8 30 38.4 7.54 37183 Wake 253289 116425 246 862 74 9.71 37185 Warren 3742 4715 0 1 2.12 0 37187 Washington 2665 2836 0 2 7.05 0 37189 Watauga 7151 8842 6 29 32.8 8.39 37191 Wayne 30606 19606 16 67 34.2 5.23 37193 Wilkes 14381 14602 8 35 24 5.56 37195 Wilson 18830 14170 5 48 33.9 2.66 37197 Yadkin 7844 7198 0 12 16.7 0 37199 Yancey 3346 4435 1 10 22.5 2.99 `)35:T546,createLegendCells = (colorScale, scaleTitle = "Legend") => { let colorRange = colorScale.range().map(function(d,i, array){ let currentRange = colorScale.invertExtent(d).map(d3.format('.2d')); let currentRangeText = `${currentRange[0]} to ${currentRange[1]}`; i == 0 ? currentRangeText = `less than ${currentRange[1]}` : i == array.length - 1 ? currentRangeText = `greater than ${currentRange[0]}` : currentRangeText = currentRangeText; return {color: d, range: currentRangeText}; }); let fontColor = "#4b4b4b"; return svg`${scaleTitle}0${colorRange.map((d, i)=>`${d.range}`)}`; }36:T3bb6,urbanizedExample = { return svg`` }37:[] 30:{"title":"Provider Rate per 10,000 of Selected Population, North Carolina, 2017","cells":[{"id":0,"value":"md`# Provider Rate per 10,000 of Selected Population, North Carolina, 2017`","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":266,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":84,"value":"viewof colorScheme = html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":89,"value":"viewof numberOfBins = slider({\n min: 3, \n max: 9, \n step: 1, \n value: 5, \n title: \"Number of Bins\", \n description: \"Select number of bins for each color scale\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":44,"value":"md`## Appendix`","pinned":false,"hidden":false,"mode":"ojs"},{"id":217,"value":"md`Data derived from North Carolina Office of State Budget and Management (OSBM) [estimates and projections](https://www.osbm.nc.gov/demog/county-projections) and physician licensure data from the [North Carolina Health Professions Data System](https://nchealthworkforce.sirs.unc.edu/) (from licensure data provided by the North Carolina Medical Board).`","pinned":false,"hidden":false,"mode":"ojs"},{"id":204,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":40,"value":"md`Urbanized areas are from the [US Census Cartographic Boundary File](https://www.census.gov/geo/maps-data/data/cbf/cbf_ua.html), clipped to North Carolina.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"nc_urbanized_areas = d3.json(\"https://cdn.rawgit.com/gallowayevan/60d3f0f67e80c5c5b5a4b4e199993f5b/raw/20edf0dd2092f8b2675116558ac8335697bd77c2/nc_urbanized_areas_simplified_clipped.json\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"dataMap = new Map(age_to_provider.map(d=> [d.county, {pc_per_65: +d.pc_per_65, peds_per_18: +d.peds_per_18}]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":351,"value":"ncData = {\n \n let ncReduced = age_to_provider.reduce(function(accumulator, currentValue){\n return {\n under18: +accumulator.under18 + +currentValue.under18,\n over65inclusive: +accumulator.over65inclusive + +currentValue.over65inclusive,\n peds_total : +accumulator.peds_total + +currentValue.peds_total,\n pc_total: +accumulator.pc_total + +currentValue.pc_total\n }\n});\n \n ncReduced.pc_per_65 = +d3.format(\",.2r\")(ncReduced.pc_total/ncReduced.over65inclusive * 10000);\n ncReduced.peds_per_18 = +d3.format(\",.2r\")(ncReduced.peds_total/ncReduced.under18 * 10000); \n \n return ncReduced;\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":81,"value":"colorScaleUnder18 = {\t\t\t \t\t\t\n const scheme = d3[\"scheme\" + colorScheme][numberOfBins];\n const scale = cluster()\n \t\t\t\t\t\t.domain(domainUnder18)\n \t\t\t\t\t\t.range(scheme);\n \n \t\t\treturn scale;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":243,"value":"colorScaleOver65 = {\t\t\t \t\t\t\n const scheme = d3[\"scheme\" + colorScheme][numberOfBins];\n const scale = cluster()\n \t\t\t\t\t\t.domain(domainOver65)\n \t\t\t\t\t\t.range(scheme);\n \n \t\t\treturn scale;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":175,"value":"domainOver65 = age_to_provider.map(d=> +d[\"pc_per_65\"])","pinned":false,"hidden":false,"mode":"ojs"},{"id":239,"value":"domainUnder18 = age_to_provider.map(d=> +d[\"peds_per_18\"])","pinned":false,"hidden":false,"mode":"ojs"},{"id":47,"value":"getFillUnder18 = (county) => {\n const currentValue = dataMap.get(county).peds_per_18;\n \treturn currentValue == 0 ? \"#bdbdbd\" : colorScaleUnder18(currentValue);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":248,"value":"getFillOver65 = (county) => {\n const currentValue = dataMap.get(county).pc_per_65;\n \treturn currentValue == 0 ? \"#bdbdbd\" : colorScaleOver65(currentValue);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":95,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":253,"value":"md`North Carolina county boundary file.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"nc = d3.json(\"https://cdn.rawgit.com/gallowayevan/1b6056fdccb0aa0d860cbdee2bdf7597/raw/a7a6f4d80d077e74152e6c3196abdec9b899eb76/ncmap.json\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"import {slider, checkbox} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":86,"value":"schemes = [\"Blues\",\n \"Greens\",\n \"Greys\",\n \"Oranges\",\n \"Purples\",\n \"Reds\",\n \"BuGn\",\n \"BuPu\",\n \"GnBu\",\n \"OrRd\",\n \"PuBuGn\",\n \"PuBu\",\n \"PuRd\",\n \"RdPu\",\n \"YlGnBu\",\n \"YlGn\",\n \"YlOrBr\",\n \"YlOrRd\"\n ]","pinned":false,"hidden":false,"mode":"ojs"},{"id":91,"value":"cluster = require(\"https://unpkg.com/d3-scale-cluster@1.1.7/dist/d3-scale-cluster.min.js\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":274,"value":"function wordWrap(text, textWidth) {\n //https://bl.ocks.org/mbostock/7555321\n //Changed to base width on number of characters\n text.each(function() {\n var text = d3.select(this),\n words = text.text().split(/\\s+/).reverse(),\n word,\n line = [],\n lineNumber = 0,\n lineHeight = 1.1, // ems\n y = text.attr(\"y\"),\n dy = parseFloat(text.attr(\"dy\")) || 0,\n tspan = text.text(null).append(\"tspan\").attr(\"x\", 0).attr(\"y\", y).attr(\"dy\", dy + \"em\");\n while (word = words.pop()) {\n line.push(word);\n tspan.text(line.join(\" \"));\n if (tspan.text().length > textWidth) {\n line.pop();\n tspan.text(line.join(\" \"));\n line = [word];\n tspan = text.append(\"tspan\").attr(\"x\", 0).attr(\"y\", y).attr(\"dy\", ++lineNumber * lineHeight + dy + \"em\").text(word);\n \n }\n }\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":104,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":377,"value":"style = html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"d3 = require(\"https://d3js.org/d3.v5.min.js\")","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W37","stdlib":"1","titling":"auto"}