31:T12d9,map = { const width = 960; const height = 600; const rateFormat = d3.format(".2f"); let fills = []; const projection = d3 .geoAlbers() .rotate([0, 62, 0]) .fitSize([width - 40, height - 40], 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 => { const fill = getFill(d.properties.county); fills.push(fill); return fill; }) .on("mouseover", d => d3 .selectAll(".mapCaption") .text( `${d.properties.county} County: ${rateFormat( dataMap.get(d.properties.county) )} ${currentProfession} per 10,000 Population` ) ) .on("mouseout", d => d3 .selectAll(".mapCaption") .text( `North Carolina: ${rateFormat( dataMap.get("North Carolina") )} ${currentProfession} per 10,000 Population` ) ); 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(`${currentProfession} per 10,000 Population North Carolina, ${year}`); titleText .append("tspan") .attr("class", "mapCaption") .attr("font-size", "1rem") .text( `North Carolina: ${rateFormat( dataMap.get("North Carolina") )} ${currentProfession} per 10,000 Population` ) .attr("dy", "1.4em") .attr("x", 0); svg.node().appendChild( createSVGtext({ text: `Notes: Data include active, licensed ${currentProfession.toLowerCase()} in practice in North Carolina as of October 31 of each year. Data are derived from licensure data from each profession's licensing board. County estimates are based on primary practice location. Population census data and estimates are downloaded from the North Carolina Office of State Budget and Management via NC LINC and are based on US Census data.`, x: width * 0.05, y: height * 0.88, fill: "#4b4b4b", maxCharsPerLine: 120, fontSize: 10 }) ); //For making large YEAR // svg // .append("text") // .attr("transform", "translate(300,400)") // .text(year) // .attr("fill", "#4b4b4b") // .attr("font-size", 52); if (urbanized) { 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") //"#4b4b4b") .style("stroke-width", 1) .style("fill", "none") .style("pointer-events", "none"); svg.node().appendChild(urbanizedExample); svg .append("text") .attr("transform", "translate(295, 455)") .style("fill", "#4b4b4b") .text("Census Urbanized Areas"); } const legend = svg .append("g") .attr("class", "legend") .attr("transform", "translate(50,350)"); const bins = groupCount(fills, d => d); legend.node().appendChild(createLegendCells(colorScale, bins)); d3.select(svg.node().appendChild(logo.childNodes[0].cloneNode(true))); d3.select(svg.node().appendChild(logo.childNodes[2].cloneNode(true))).attr( "transform", `translate(${width * 0.65},${height * 0.85}) scale(0.45)` ); if (showNonMetro) { const countyCentroids = nc.features .filter( d => omb_metro_2017.get(d.properties.county.toUpperCase()) == "nonmetro" ) .map(d => path.centroid(d)); const symbolGenerator = d3 .symbol() .type(d3.symbolStar) .size(60); svg .selectAll(".stars") .data(countyCentroids) .enter() .append("path") .attr("class", "stars") .attr("transform", d => `translate(${d[0] + 20},${d[1]})`) .attr("d", symbolGenerator) .attr("fill", "#fff") .attr("stroke", "#333"); const ruralLegend = svg .append("g") .attr("transform", "translate(280, 420)"); ruralLegend .append("path") .attr("d", symbolGenerator) .attr("fill", "#fff") .attr("stroke", "#333"); ruralLegend .append("text") .attr("dx", 15) .attr("dy", 5) .attr("fill", "#333") .text("Nonmetropolitan County (54)"); } return svg.node(); }32:T528,createLegendCells = (colorScale, bins) => { let colorRange = colorScale.range().map(function(d, i, array) { let currentRange = colorScale.invertExtent(d).map(d3.format(".2f")); let currentRangeText = `${currentRange[0]} to ${currentRange[1]}`; i == 0 ? (currentRangeText = `< ${currentRange[1]}`) : i == array.length - 1 ? (currentRangeText = `≥ ${currentRange[0]}`) : (currentRangeText = currentRangeText); return { color: d, range: currentRangeText }; }); colorRange.reverse(); colorRange.push({ color: "#d6d6d6", range: `No ${currentProfession}` }); let fontColor = "#4b4b4b"; return svg`${currentProfession} per 10,000 Population(# of counties)${colorRange.map( (d, i) => `${ d.range } (${bins.has(d.color) ? bins.get(d.color) : 0})` )}`; }33:T3bb9,urbanizedExample = { return svg``; }34:[] 2f:{"title":"Health Professionals per 10,000 Population North Carolina","cells":[{"id":0,"value":"md`## Health Professionals per 10,000 Population North Carolina\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":630,"value":"viewof profession = html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":633,"value":"viewof year = slider({\n min: yearExtent[0],\n max: yearExtent[1],\n step: 1,\n value: yearExtent[1],\n title: \"Year\",\n description: `Select a year of data`\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":764,"value":"viewof colorScheme = select({\n title: \"Map Color Scheme\",\n description: \"Pick a color scheme for the map.\",\n options: schemes,\n value: \"YlOrRd\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":89,"value":"viewof numberOfBins = slider({\n min: 3, \n max: 5, \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":727,"value":"viewof showNonMetro = checkbox({\n description: \"Check to show rural counties with a star.\",\n options: [{ value: \"showRural\", label: \"Show Rural Counties\" }],\n value: \"\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":743,"value":"viewof urbanized = checkbox({\n description: \"Check to show an overlay with census urbanized areas.\",\n options: [{ value: \"urbanized\", label: \"Show Census Urbanized Areas\" }],\n value: \"\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":221,"value":"DOM.download(\n serialize(map),\n `${currentProfession.replace(/ /g, \"_\")}_${year}.svg`,\n \"Download Map as SVG\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":248,"value":"DOM.download(\n await rasterize(map),\n `${currentProfession.replace(/ /g, \"_\")}_${year}.png`,\n \"Download Map as PNG\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":44,"value":"md`## Appendix`","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(\n \"https://gist.githubusercontent.com/gallowayevan/60d3f0f67e80c5c5b5a4b4e199993f5b/raw/20edf0dd2092f8b2675116558ac8335697bd77c2/nc_urbanized_areas_simplified_clipped.json\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":37,"value":"md`Population data derived from North Carolina Office of State Budget and Management (OSBM) estimates and projections: https://www.osbm.nc.gov/demog/county-projections`","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"dataMap = new Map(supply.filter(d=>d.year == year).map(d=> [d.county, d.rate]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":81,"value":"colorScale = {\n const scheme = d3[\"scheme\" + colorScheme][numberOfBins + 1].slice(1);\n const scale = cluster()\n .domain(domain)\n .range(scheme);\n\n return scale;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":175,"value":"domain = supply.map(d => d.rate)","pinned":false,"hidden":false,"mode":"ojs"},{"id":47,"value":"getFill = county => {\n const currentValue = dataMap.get(county);\n\n return currentValue == 0 ? \"#d6d6d6\" : colorScale(currentValue);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":95,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":42,"value":"md`North Carolina county boundary file.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":635,"value":"yearExtent = d3.extent(supply, d => d.year)","pinned":false,"hidden":false,"mode":"ojs"},{"id":637,"value":"supply = d3.csv(\n `https://data-dept-healthworkforce.cloudapps.unc.edu/data/region/spec${profession.padStart(\n 3,\n \"0\"\n )}.csv`,\n function(d) {\n if (d.type == \"ahec\") return null;\n return {\n county: d.region,\n year: +d.year,\n total: +d.total,\n population: +d.population,\n rate: +d.providerRate\n };\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":665,"value":"currentProfession = {\n const curr = professions.filter(d => +d.id == +profession)[0];\n return curr.profession == curr.specialty\n ? curr.profession == \"Certified Nurse Midwife\"\n ? \"Certified Nurse Midwives\"\n : curr.profession + \"s\"\n : `${curr.profession} - ${curr.display_name}`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"nc = d3.json(\n \"https://gist.githubusercontent.com/gallowayevan/1b6056fdccb0aa0d860cbdee2bdf7597/raw/a7a6f4d80d077e74152e6c3196abdec9b899eb76/ncmap.json\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"import {slider, checkbox, select} 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":205,"value":"import {logo} from \"@gallowayevan/sheps-health-workforce-nc-logo\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":224,"value":"import {serialize, rasterize} from \"@mbostock/saving-svg\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":259,"value":"import {createSVGtext} from \"@gallowayevan/svg-word-wrap\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":409,"value":"import {omb_metro_2017} from '@gallowayevan/change-in-health-professional-supply-over-time-north-carol'","pinned":false,"hidden":false,"mode":"ojs"},{"id":512,"value":"import {groupCount} from \"@mbostock/group\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":746,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":639,"value":"professions = d3.csv(\n \"https://data-dept-healthworkforce.cloudapps.unc.edu/data/specialties.csv\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"d3 = require(\"d3\")","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}