31:T478,# Reproductive rights and ... ?? With the Supreme Court's unfortunate Dobbs decision overturning Roe v Wade, I thought it might be a good time to explore how a respect for reproductive rights correlates with other health care indicators. This visualization is the result. We measure "respect for reproductive rights" using the *reproductive rights score* (or *rr-score*) from [Status of Women in the States](https://statusofwomendata.org/explore-the-data/reproductive-rights/). With no covariate chosen, the map below is simply shaded according to that score and the histogram shows the prevalence of states with various rr-scores. You can hover over a state to find its score. When a covariate is chosen, the map is shaded to indicate both the reproductive rights score and the covariate. The legend in the lower right indicates how to interpret the shading. You can again hover over a state to get its scores and to see where it falls in the legend. A scatter plot also appears to illustrate the relationship between the reproductive rights score and the covariate, along with some commentary to help interpret the correlation and p-value.32:Tbfa,comment = { if (covariate == "---") { return md`### Comments With no covariate, the map is shaded according to just the reproductive rights score. The Red/Blue diverging scale looks quite a lot like an electoral map indicating Democratic vs Republican leaning states.`; } else if (covariate == "infant_mortality_rate") { return md`### Comments Not too surprisingly, infant mortality rate has a strong, negative correlation of -${d3.format( "0.2f" )( Math.sqrt(regression.R2) )} with rr-score. The small p-value of ${d3.format("0.5f")( Math.sqrt(regression.f.pvalue) )} suggests that the relationship is genuine. Generally, a p-value less than 0.05 indicates that we have a 95% level of confidence that there's a genuine relationship between the variables. `; } else if (covariate == "teen_births_rate") { return md`### Comments Teen births rate also has a strong, negative correlation with rr-score of -${d3.format( "0.2f" )(Math.sqrt(regression.R2))} and the small p-value of ${d3.format("0.5f")( Math.sqrt(regression.f.pvalue) )} again suggests that the relationship is genuine. `; } else if (covariate == "life_expectancy") { return md`### Comments Life expectancy is a much more general health indicator but still has a fairly strong postive corelation of ${d3.format( "0.2f" )(Math.sqrt(regression.R2))} with rr-score and the p-value of ${d3.format( "0.5f" )( Math.sqrt(regression.f.pvalue) )} still suggests that the relationship is genuine at the 95% level of confidence. `; } else if (covariate == "poor_health_proportion") { return md`### Comments The proportion of folks who indicated they have fair or poor health on the CDC's *Behavioral Risk Factor Surveillance System* has a weaker, negative corelation of -${d3.format( "0.2f" )(Math.sqrt(regression.R2))} with rr-score. The p-value of ${d3.format( "0.5f" )( Math.sqrt(regression.f.pvalue) )} does not suggest a genuine relationship at the 95% level of confidence. `; } else if (covariate == "poor_health_disparity") { return md`### Comments The *disparity* between the proportion of black and white folks with fair or poor health has a somewhat stronger, negative corelation of -${d3.format( "0.2f" )(Math.sqrt(regression.R2))} with rr-score. The p-value of ${d3.format( "0.5f" )( Math.sqrt(regression.f.pvalue) )} just outside the threshold for a 95% level of confidence. I think this is particularly striking given the states with inadequate data to assess this disparity. `; } else if (covariate == "percent_bachelors") { return md`### Comments As an educator, I find it quite interesting that the proportion of folks with bachelor's degrees has a fairly strong, positive corelation of ${d3.format( "0.2f" )(Math.sqrt(regression.R2))} with rr-score. The p-value of ${d3.format( "0.5f" )( Math.sqrt(regression.f.pvalue) )} is quite small too, indicating a genuine relationship. `; } }33:T1b9f,function make_map(opts = {}) { let { max_size = 900, link_chart = null } = opts; let map_width = width < max_size ? width : max_size; let height = 0.575 * map_width; let div = d3 .create("div") .style("width", `${map_width}px`) .style("height", `${height}px`) .style("overflow", "hidden") .style("position", "relative"); let svg = div .append("svg") .style("overflow", "hidden") .attr("viewBox", [0, 0, map_width, height]); let proj = d3 .geoIdentity() .reflectY(true) .fitSize([map_width, height], stateTiles); let path = d3.geoPath().projection(proj); let map = svg.append("g"); let density_map = new Map(); map .selectAll("path.tile") .data(stateTiles.features) .join("path") .attr("class", "tile") .attr("data-fips", (o) => o.properties.fips) .attr("data-name", (o) => o.properties.name) .attr("data-abbr", (o) => o.properties.abbr) .attr("data-rrs", function (d) { let fd = data.filter((o) => o.abbr == d.properties.abbr); if (fd.length > 0) { return fd[0].rr_score; } else { return "NA"; } }) .attr("data-covariate", function (d) { if (covariate != "---") { let fd = filtered_data.filter((o) => o.abbr == d.properties.abbr); if (fd.length > 0) { return fd[0][covariate]; } else { return "NA"; } } }) .attr("d", path) .attr("fill", (o) => covariate == "---" ? rr_shade(o.properties.abbr) : state_color(o.properties.abbr) ) .attr("stroke-width", 0.8) .attr("stroke", "white") .attr("stroke-linejoin", "round") // .on("touchmove", (e) => e.preventDefault()) .on("pointerenter mouseenter", function (evt, o) { evt.preventDefault(); if (covariate != "---") { let class_selector = ".color" + state_color(o.properties.abbr).slice(1); legend .select(class_selector) .attr("stroke", "black") .attr("stroke-width", 2) .raise(); if (link_chart) { let selected_circles = d3 .select(link_chart) .select(`#${o.properties.abbr}`) .attr("fill", "yellow") .attr("stroke", "black") .attr("r", 0.005 * width) .raise(); } } else { if (link_chart) { d3.select(link_chart) .select(`.${o.properties.abbr}`) .attr("stroke", "black") .attr("stroke-width", 0.002 * width) .raise(); d3.select(link_chart).select(); } } }) .on("mouseout", function (evt, o) { if (covariate != "---") { let class_selector = ".color" + state_color(o.properties.abbr).slice(1); legend .select(class_selector) .attr("stroke", "white") .attr("stroke-width", 0.5); if (link_chart) { let selected_circles = d3 .select(link_chart) .select(`#${o.properties.abbr}`) .attr("fill", "black") .attr("r", 0.002 * width); } } else { if (link_chart) { d3.select(link_chart) .select(`.${o.properties.abbr}`) .attr("stroke", null); } } }); map .selectAll("text") .data(stateTiles.features) .join("text") .text((o) => o.properties.abbr) .attr("font-size", `${0.022 * map_width}px`) .attr("x", function (o) { return path.centroid(o)[0]; }) .attr("text-anchor", "middle") .attr("y", function (o) { return path.centroid(o)[1]; }) .attr("dy", 0.008 * map_width) .attr("pointer-events", "none"); map .selectAll("path.tile") .nodes() .forEach(function (t) { let content = html`

${t.getAttribute("data-name")}

reproductive rights score: ${t.getAttribute("data-rrs")}

${ covariate != "---" ? `

${covariate.replace(/_/g, " ")}: ${d3.format("0.2f")( t.getAttribute("data-covariate") )}

` : "" }

`; tippy(t, { content: content, theme: "light-border", maxWidth: 500 }); }); let s = map_width / 10; let legend = svg .append("g") .attr("transform", `translate(${map_width - 1.5 * s},${height - 1.2 * s})`); let arrow_group = legend.append("g"); arrow_group // from http://thenewcode.com/1068/Making-Arrows-in-SVG .append("svg:defs") .append("marker") .attr("id", "arrowhead") .attr("markerWidth", 0.5 * 10) .attr("markerHeight", 0.5 * 7) .attr("refX", 0) .attr("refY", 0.5 * 3.5) .attr("orient", "auto") .append("polygon") // .attr("points", `0 0, 10 3.5, 0 7`); .attr("points", `0 0, ${0.5 * 10} ${0.5 * 3.5}, 0 ${0.5 * 7}`); let patches = legend.append("g"); let arrows = legend.append("g"); if (covariate != "---") { let n = 5; let dd = s / n; let to_rr = d3 .scaleLinear() .domain([0, n - 1]) .range([rr_scores.min, rr_scores.max]); let to_covariate = d3 .scaleLinear() .domain([0, n - 1]) .range([covariate_values.min, covariate_values.max]); for (let i = 0; i < n; i++) { for (let j = 0; j < n; j++) { patches .append("rect") .attr( "class", "color" + color(to_rr(i), to_covariate(n - j - 1)).slice(1) ) .attr("x", i * dd) .attr("y", j * dd) .attr("width", s / n) .attr("height", s / n) .attr("fill", color(to_rr(i), to_covariate(n - j - 1))) .attr("stroke", "white") .attr("stroke-width", 0.5); } } arrows .append("line") .attr("x1", 0) .attr("x2", s) .attr("y1", s) .attr("y2", s) .attr("stroke", "black") .attr("stroke-width", 2) .attr("marker-end", "url(#arrowhead)"); arrows .append("line") .attr("x1", 0) .attr("x2", 0) .attr("y1", s) .attr("y2", 0) .attr("stroke", "black") .attr("stroke-width", 2) .attr("marker-end", "url(#arrowhead)"); arrows .append("text") .attr("x", 0.15 * s) .attr("y", 1.2 * s) .attr("font-size", 0.011 * width) .text("rr-score"); arrows .append("text") .attr("x", -0.016 * width) .attr("y", -0.012 * width) .attr("font-size", 0.011 * width) .text("covariate"); } else { legend = Legend( d3.scaleSequential(d3.interpolateRdBu).domain(rr_score_extent), { title: "rr-score", tickFormat: ".0f" } ); d3.select(legend).selectAll("text").attr("font-size", "16px"); svg .append("g") .attr("transform", `translate(${0.3 * map_width},${0.05 * height})`) .append("g") .attr("transform", `scale(${max_size / 700})`) .append(() => legend); } return div.node(); }34:Td92,function make_chart(opts = {}) { let { w = 900 } = opts; let h = 0.6 * w; let plot; if (covariate != "---") { let xs = filtered_data.map((o) => o.rr_score); let xmin = d3.min(xs); let xmax = d3.max(xs); let xrange = xmax - xmin; xmin = xmin - xrange / 10; xmax = xmax + xrange / 10; let ys = filtered_data.map((o) => o[covariate]); let ymin = d3.min(ys); let ymax = d3.max(ys); let yrange = ymax - ymin; ymin = ymin - yrange / 10; ymax = ymax + yrange / 10; let f = (x) => regression.coef[1] * x + regression.coef[0]; plot = Plot.plot({ width: w, height: h, x: { domain: [xmin, xmax] }, y: { domain: [ymin, ymax] }, marks: [ Plot.line([ [xmin + xrange / 40, f(xmin + xrange / 40)], [xmax, f(xmax)] ]), Plot.dot(filtered_data, { x: "rr_score", y: covariate, fill: "black", title: (o) => o.abbr, r: 3 * Math.sqrt(width / 1152) }), Plot.ruleX([xmin]), Plot.ruleY([ymin]) ] }); d3.select(plot) .selectAll("circle") .on("pointerenter", function () { d3.select(this) .attr("fill", "yellow") .attr("stroke", "black") .attr("r", 5 * Math.sqrt(width / 1152)) .raise(); }) .on("pointerleave", function () { d3.select(this) .attr("fill", "black") .attr("r", 3 * Math.sqrt(width / 1152)); }) .nodes() .forEach(function (c) { let d3Circle = d3.select(c); let value = d3Circle.select("title").text(); d3Circle.attr("id", value); tippy(c, { content: d3Circle.attr("id"), theme: "light-border" }); d3Circle.select("title").remove(); }); } else { plot = Plot.plot({ width: w, height: h, marks: [ Plot.rectY( data, Plot.stackY( Plot.binX( { y: "count", thresholds: 7, sort: "first", title: "first" }, // title: "first", { x: "rr_score", text: "abbr", sort: "rr_score", fill: "rr_score", title: (d) => `${d.abbr}: RR score: ${d.rr_score}` } ) ) ), Plot.text( data, Plot.stackY( Plot.binX( { y: "count", thresholds: 7, sort: "first", text: "first" // title: "first" }, { x: "rr_score", sort: "rr_score", z: "abbr", text: "abbr", fill: "black" // title: (d) => `${d.name}. RR score: ${d.rr_score}` } ) ) ), Plot.ruleX([0]), Plot.ruleY([0]) ], x: { ticks: 7 }, color: { scheme: "rdbu" } }); d3.select(plot).selectAll("text").attr("pointer-events", "none"); d3.select(plot) .selectAll("rect") .nodes() .forEach(function (r) { let value = d3.select(r).select("title").text(); d3.select(r).attr("class", value.split(":")[0]); tippy(r, { content: value, theme: "light-border" }); }); d3.select(plot).selectAll("rect").select("title").remove(); } return plot; }35:[{"id":"2965b2c4ceed1ad3763b2ccd7c1d022fdbcc8138f6e12db677ecc9017d48ff56a4d881ba27fb95f4e150eca099e68c388ed2e0b43925758f90fb9aa0ef3f5f82","href":"https://static.observableusercontent.com/files/2965b2c4ceed1ad3763b2ccd7c1d022fdbcc8138f6e12db677ecc9017d48ff56a4d881ba27fb95f4e150eca099e68c388ed2e0b43925758f90fb9aa0ef3f5f82","name":"reproductive_rights_correlates@6.csv","type":"text/csv","lastModified":1651934166163.162,"size":2975},{"id":"deb4404d4b5df40d031833a0806f3464892aaa361230aca6d78c16273c5ef8c9c45979f1753049eada9fe368c717efd40d1295688de83d46c4543436021e251e","href":"https://static.observableusercontent.com/files/deb4404d4b5df40d031833a0806f3464892aaa361230aca6d78c16273c5ef8c9c45979f1753049eada9fe368c717efd40d1295688de83d46c4543436021e251e","name":"stateTiles2.json","type":"application/json","lastModified":1651656397600.876,"size":10555}] 2f:{"title":"Reproductive rights and ... ??","cells":[{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"md"},{"id":26,"value":"viewof covariate = Inputs.select(\n [\"---\"].concat(Object.keys(data[0]).slice(3)),\n { label: \"covariate:\", format: (s) => s.replace(/_/g, \" \") }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":86,"value":"viz = {\n let w = width < 1200 ? width : 1200;\n let small_screen = 800;\n let div = d3.create(\"div\");\n let map_container = div.append(\"div\");\n let chart = make_chart({ w: w < small_screen ? w : 0.35 * w });\n map_container\n .style(\"display\", w < small_screen ? \"block\" : \"inline-block\")\n .style(w < small_screen ? \"margin-bottom\" : \"margin-right\", `${0.05 * w}px`)\n .append(() =>\n make_map({\n max_size: w < small_screen ? w : 0.6 * w - 20,\n link_chart: chart\n })\n );\n div\n .append(\"div\")\n .style(\"display\", w < small_screen ? \"block\" : \"inline-block\")\n .style(\"margin-bottom\", `${0.06 * w}px`)\n .append(() => chart);\n\n return div.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":645,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":716,"value":"## Data citations\n\nThe *reproductive rights scores* come from [Status of Women in the States](https://statusofwomendata.org/explore-the-data/reproductive-rights/).\n\nThe *infant mortality rate*, *teen births rate*, and *life expectancy* all come from [the CDC](https://www.cdc.gov/nchs/pressroom/stats_of_the_states.htm).\n\nThe *poor health proportion* and *poor health disparity* data was also gathered by the CDC but was curated and simplified by [The Kaiser Family Foundation](https://www.kff.org/other/state-indicator/percent-of-adults-reporting-fair-or-poor-health-status-by-raceethnicity).\n\nThe *percent bachelors* data comes from [World Population Review](https://worldpopulationreview.com/state-rankings/educational-attainment-by-state).","pinned":false,"hidden":false,"mode":"md"},{"id":438,"value":"## Code","pinned":false,"hidden":false,"mode":"md"},{"id":84,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":7,"value":"$34","pinned":true,"hidden":false,"mode":"ojs"},{"id":128,"value":"rr_shade = (abbr) =>\n d3.interpolateRdBu(rr_scale(data.filter((o) => o.abbr == abbr)[0].rr_score))","pinned":true,"hidden":false,"mode":"ojs"},{"id":90,"value":"rr_scale = {\n let rr_scores = data.map((o) => o.rr_score);\n let min = d3.min(rr_scores);\n let max = d3.max(rr_scores);\n return d3.scaleLinear().domain([min, max]).range([0, 1]);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":866,"value":"rr_score_extent = d3.extent(data, d=>d.rr_score)","pinned":true,"hidden":false,"mode":"ojs"},{"id":40,"value":"regression = {\n if (covariate != \"---\") {\n return jstat.models.ols(\n filtered_data.map((o) => o[covariate]),\n filtered_data.map((o) => [1, o[\"rr_score\"]])\n );\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":175,"value":"colors = [\n \"#d3d3d3\",\n \"#b6cdcd\",\n \"#97c5c5\",\n \"#75bebe\",\n \"#52b6b6\",\n \"#cab6c5\",\n \"#aeb0bf\",\n \"#91aab9\",\n \"#70a4b2\",\n \"#4e9daa\",\n \"#c098b9\",\n \"#a593b3\",\n \"#898ead\",\n \"#6b89a6\",\n \"#4a839f\",\n \"#b77aab\",\n \"#9e76a6\",\n \"#8372a0\",\n \"#666e9a\",\n \"#476993\",\n \"#ad5b9c\",\n \"#955898\",\n \"#7c5592\",\n \"#60528d\",\n \"#434e87\"\n]","pinned":true,"hidden":false,"mode":"ojs"},{"id":237,"value":"function state_color(abbr) {\n if (covariate != \"---\") {\n let info = filtered_data.filter((o) => o.abbr == abbr);\n if (info.length > 0) {\n return color(info[0].rr_score, info[0][covariate]);\n } else {\n return \"black\";\n }\n } else {\n return rr_shade(data.filter((o) => o.abbr == abbr));\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":235,"value":"color = (rr, cov) => colors[j(cov) + i(rr) * 5]","pinned":true,"hidden":false,"mode":"ojs"},{"id":180,"value":"i = d3\n .scaleQuantile()\n .domain([rr_scores.min, rr_scores.max])\n .range(d3.range(Math.sqrt(colors.length)))","pinned":true,"hidden":false,"mode":"ojs"},{"id":188,"value":"rr_scores = {\n let rr_scores = data.map((o) => o.rr_score);\n rr_scores.min = d3.min(rr_scores);\n rr_scores.max = d3.max(rr_scores);\n return rr_scores;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":233,"value":"j = d3\n .scaleQuantile()\n .domain([covariate_values.min, covariate_values.max])\n .range(d3.range(Math.sqrt(colors.length)))","pinned":true,"hidden":false,"mode":"ojs"},{"id":231,"value":"covariate_values = {\n let covariate_values = filtered_data.map((o) => o[covariate]);\n covariate_values.min = d3.min(covariate_values);\n covariate_values.max = d3.max(covariate_values);\n return covariate_values;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":45,"value":"filtered_data = data.filter((o) => o[covariate] > 0)","pinned":true,"hidden":false,"mode":"ojs"},{"id":3,"value":"data = FileAttachment(\"reproductive_rights_correlates@6.csv\").csv({ typed: true })","pinned":true,"hidden":false,"mode":"ojs"},{"id":78,"value":"stateTiles = {\n let stateTiles = await FileAttachment(\"stateTiles2.json\").json();\n let tiles = topojson.feature(stateTiles, stateTiles.objects.tiles);\n tiles.features = tiles.features.filter((o) => o.properties.abbr != \"DC\");\n return tiles;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":21,"value":"jstat = require(\"jstat\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":595,"value":"tippy_style = html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":74,"value":"tippy = require(\"tippy.js@6\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":70,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":445,"value":"import { Legend } from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":909,"value":"Plot.auto(\n await FileAttachment(\"reproductive_rights_correlates.csv\").csv({\n typed: true\n }),\n { x: \"rr_score\", y: \"overdoses_rate\" }\n).plot({ height: 500, width: 800, x: {} })","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W35","stdlib":"1","titling":"auto"}