This is a choropleth of Medicare payments by state, using the data recently released by the Center for Medicare and Medicaid Services. I used a kmeans algorithm to determine that 3 clusters explains roughly 90% of the variation in the data.
Last active
January 16, 2020 10:18
-
-
Save ilanman/11125725 to your computer and use it in GitHub Desktop.
Choropleth of Medicare payments
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<style type="text/css"> | |
path:hover { | |
opacity: 0.3; | |
transition-duration: 0.2s; | |
} | |
div.tooltip { | |
position: absolute; | |
min-width: 60px; | |
height: auto; | |
padding: 10px; | |
background-color: silver; | |
border-radius: 10px; | |
pointer-events: none; | |
} | |
</style> | |
<head> | |
<meta charset="utf-8"> | |
<script src="http://d3js.org/d3.v3.js" charset="utf-8"></script> | |
<script src="http://code.jquery.com/jquery.js"></script> | |
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> | |
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> | |
</head> | |
<body> | |
<script type="text/javascript"> | |
//Width and height | |
var w = 600; | |
var h = 400; | |
var color = d3.scale.quantize() | |
.range(["rgb(0,191,255)", "rgb(30,144,255)", | |
"rgb(135, 206, 235)"]); | |
var projection = d3.geo.albersUsa() | |
.translate([w/2, h/2]) | |
.scale([700]); | |
//Define default path generator | |
var path = d3.geo.path() | |
.projection(projection); | |
var div = d3.select("body").append("div") | |
.attr("class", "tooltip") | |
.style("opacity", 0); | |
//Create SVG element | |
var svg = d3.select("body") | |
.append("svg") | |
.attr("width", w) | |
.attr("height", h); | |
d3.json("us-states.json", function(json) { | |
d3.csv("state_med.csv", function(data) { | |
color.domain([ | |
d3.min(data, function(d) { return d.value; }), | |
d3.max(data, function(d) { return d.value; }) | |
]); | |
//Merge the ag. data and GeoJSON | |
//Loop through once for each ag. data value | |
for (var i = 0; i < data.length; i++) { | |
//Grab state name | |
var dataState = data[i].state; | |
//Grab data value, and convert from string to float | |
var dataValue = parseFloat(data[i].value); | |
var dataStd = parseFloat(data[i].std); | |
var dataclus1 = parseFloat(data[i].c1); | |
var dataclus2 = parseFloat(data[i].c2); | |
//Find the corresponding state inside the GeoJSON | |
for (var j = 0; j < json.features.length; j++) { | |
var jsonState = json.features[j].properties.name; | |
if (dataState == jsonState) { | |
json.features[j].properties.value = dataValue; | |
json.features[j].properties.std = dataStd; | |
json.features[j].properties.c1 = dataclus1; | |
json.features[j].properties.c2 = dataclus2; | |
break; | |
} | |
} | |
} | |
svg.selectAll("path") | |
.data(json.features) | |
.enter() | |
.append("path") | |
.attr("d", path) | |
.style("fill", function(d) { | |
//Get data value | |
var value = d.properties.value; | |
if (value) { | |
//If value exists… | |
return color(value); | |
} else { | |
//If value is undefined… | |
return "#ccc"; | |
} | |
}) | |
.on("mouseover",function(d){ | |
div.transition() | |
.style("opacity", 0.9); | |
div.html(function() { | |
return "State: <strong>" + d.properties.name + "</strong><br> Avg Payment: <strong>" + d.properties.value + "</strong><br> Std Dev: <strong>" + d.properties.std; | |
}) | |
.style("left", (d3.event.pageX) + "px") | |
.style("top", (d3.event.pageY - 20) + "px"); | |
}) | |
.on("mouseout",function(d) { | |
div.transition() | |
.style("opacity", 0); | |
}); | |
}); | |
}); | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
state | value | std | clus1 | clus2 | |
---|---|---|---|---|---|
Alaska | 97.3 | 17.9 | 1 | 6 | |
Alabama | 66.3 | 12.9 | 3 | 2 | |
Arkansas | 63.7 | 11.8 | 3 | 7 | |
Arizona | 84.4 | 14.0 | 1 | 6 | |
California | 87.0 | 13.2 | 1 | 6 | |
Colorado | 78.6 | 13.2 | 2 | 1 | |
Connecticut | 72.3 | 10.9 | 2 | 1 | |
Delaware | 82.1 | 13.4 | 1 | 6 | |
Florida | 91.2 | 14.3 | 1 | 6 | |
Georgia | 72.1 | 12.5 | 2 | 3 | |
Hawaii | 64.1 | 14.0 | 3 | 8 | |
Iowa | 60.8 | 9.9 | 3 | 7 | |
Idaho | 69.3 | 13.3 | 2 | 1 | |
Illinois | 77.6 | 12.4 | 2 | 3 | |
Indiana | 70.7 | 14.1 | 2 | 3 | |
Kansas | 70.4 | 12.0 | 2 | 3 | |
Kentucky | 63.2 | 11.0 | 3 | 7 | |
Louisiana | 67.8 | 12.2 | 2 | 2 | |
Massachusetts | 72.6 | 11.2 | 2 | 3 | |
Maryland | 91.5 | 14.6 | 1 | 6 | |
Maine | 60.8 | 10.3 | 3 | 7 | |
Michigan | 73.2 | 11.7 | 2 | 1 | |
Minnesota | 60.8 | 11.2 | 3 | 4 | |
Missouri | 75.3 | 12.5 | 2 | 1 | |
Mississippi | 67.6 | 11.8 | 2 | 7 | |
Montana | 71.9 | 13.0 | 2 | 3 | |
North Carolina | 69.4 | 12.0 | 2 | 2 | |
North Dakota | 59.3 | 9.5 | 3 | 4 | |
Nebraska | 64.1 | 10.7 | 3 | 5 | |
New Hampshire | 68.0 | 11.4 | 2 | 3 | |
New Jersey | 84.5 | 12.5 | 1 | 6 | |
New Mexico | 70.6 | 11.8 | 2 | 3 | |
Nevada | 89.3 | 16.4 | 1 | 6 | |
New York | 79.1 | 11.6 | 2 | 1 | |
Ohio | 69.5 | 11.6 | 2 | 3 | |
Oklahoma | 70.0 | 13.1 | 2 | 2 | |
Oregon | 67.7 | 12.2 | 2 | 2 | |
Pennsylvania | 73.9 | 11.8 | 2 | 1 | |
Rhode Island | 76.6 | 12.8 | 2 | 1 | |
South Carolina | 67.2 | 11.7 | 3 | 2 | |
South Dakota | 66.7 | 11.9 | 3 | 7 | |
Tennessee | 63.8 | 11.5 | 3 | 7 | |
Texas | 76.6 | 13.3 | 2 | 1 | |
Utah | 74.0 | 14.5 | 2 | 3 | |
Virginia | 71.7 | 12.6 | 2 | 3 | |
Vermont | 55.0 | 9.7 | 3 | 4 | |
Washington | 75.3 | 13.3 | 2 | 1 | |
Wisconsin | 60.0 | 10.8 | 3 | 4 | |
West Virginia | 61.0 | 11.0 | 3 | 5 | |
Wyoming | 61.3 | 11.5 | 3 | 2 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment