Skip to content

Commit

Permalink
Updates
Browse files Browse the repository at this point in the history
  • Loading branch information
lukeknipe committed Dec 4, 2024
1 parent f94ba33 commit ef2c063
Show file tree
Hide file tree
Showing 2 changed files with 74 additions and 39 deletions.
68 changes: 29 additions & 39 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,25 +12,25 @@
gtag('js', new Date());
gtag('config', 'G-DM5K75JW4Z');
</script>
<title>Voter Registration in Arizona's Legislative Districts</title>
<title>The 2024 Presidential Election in Pima County</title>
<meta name="description" content="About me, and this website">
<meta content="width=device-width, initial-scale=1" name="viewport" />
<!-- itemprop tags for Google -->
<meta itemprop="name" content="Arizona's legislative districts, by the numbers">
<meta itemprop="description" content="An interactive map of Arizona's 30 legislative districs that shows each district's elected representatives, voter registration stats, and how they lean politically.">
<meta itemprop="name" content="The 2024 Presidential Election in Pima County, precinct by precinct">
<meta itemprop="description" content="An interactive map of Pima County's 265 voting precincts that shows the 2024 U.S. Presidential Election outcome for each precinct.">
<meta itemprop="image" content="https://lukeknipe.com/az_voter_reg_by_ld/og.png">
<!-- og tags for Facebook -->
<meta property="og:title" content="Arizona's legislative districts, by the numbers" />
<meta property="og:title" content="The 2024 Presidential Election in Pima County, precinct by precinct" />
<meta property="og:locale" content="en_US" />
<meta property="og:url" content="https://lukeknipe.com/az_voter_reg_by_ld/">
<meta property="og:type" content="website">
<meta property="og:description" content="An interactive map of Arizona's 30 legislative districs that shows each district's elected representatives, voter registration stats, and how they lean politically.">
<meta property="og:description" content="An interactive map of Pima County's 265 voting precincts that shows the 2024 U.S. Presidential Election outcome for each precinct.">
<meta property="og:image" content="https://lukeknipe.com/az_voter_reg_by_ld/og.png">
<meta property="og:image:alt" content="Arizona's legislative districts, by the numbers">
<meta property="og:image:alt" content="The 2024 Presidential Election in Pima County, precinct by precinct">
<!-- Twitter tags -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Arizona's legislative districts, by the numbers">
<meta name="twitter:description" content="An interactive map of Arizona's 30 legislative districs that shows each district's elected representatives, voter registration stats, and how they lean politically.">
<meta name="twitter:description" content="An interactive map of Pima County's 265 voting precincts that shows the 2024 U.S. Presidential Election outcome for each precinct.">
<meta name="twitter:image" content="https://lukeknipe.com/az_voter_reg_by_ld/og.png">
<link rel="stylesheet" href="style.css">
<meta charset="utf-8" />
Expand All @@ -51,13 +51,13 @@

// Display basemap

var map = L.map('map', {zoomControl: false}).setView([32.1, -111.9], 8.8);
var map = L.map('map', {zoomControl: false}).setView([32.2, -111], 10.5);
new L.Control.Zoom({ position: 'bottomleft' }).addTo(map);

L.tileLayer('https://api.mapbox.com/styles/v1/lukeknipe/cl5mwyk7000gy15qvyp46e1h2/tiles/256/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibHVrZWtuaXBlIiwiYSI6ImNsNW13ajU1azAwZmszZXBxeWV0ZWtlaTgifQ.llc0hOFsg4QzV7tiR1jLdg', {
maxZoom: 18,
attribution: 'Map data: <a href="https://redistricting-irc-az.hub.arcgis.com/pages/official-maps">AIRC</a>' +
' | Voter data: <a href="https://azsos.gov/sites/default/files/state_voter_registration_2023_july.pdf">Arizona Secretary of State Registration Report, July 2023</a> | Imagery © <a href="http://mapbox.com">Mapbox</a>',
attribution: 'Map data: <a href="https://gisopendata.pima.gov/">Pima County Geospatial Data Portal</a>' +
' | Election data: <a href="https://www.pima.gov/394/Elections">Pima County Elections Department</a> | Imagery © <a href="http://mapbox.com">Mapbox</a>',
}).addTo(map);

// Control that shows district info on hover
Expand All @@ -72,36 +72,30 @@

info.update = function (props) {
this._div.innerHTML = (props ?
'<h2><b><center>Precinct<br>' + props.PRECINCT
+ '</b></center></h2>' + ((props.TRUMP / (props.BALLOTS_CA))*100).toFixed(2) + '% Trump '
+ '<h4>' + props.TRUMP + ' Votes for Donald Trump'
+ '</b></center></h2>' + + ((props.HARRIS / (props.BALLOTS_CA))*100).toFixed(2) + '% Harris '
+ '<h4>' + props.HARRIS + ' Votes for Kamala Harris'
+ '</b></center></h2>' + (((props.OLIVER + props.STEIN + props.WRITE_IN) / (props.BALLOTS_CA))*100).toFixed(2) + '% Others'
+ '<h4>' + props.OLIVER + ' Votes for Chase Oliver'
+ '<h4>' + props.STEIN + ' Votes for Jill Stein'
+ '<h4>' + props.WRITE_IN + ' Write-in votes'
+ '</b></center></h2>' + leanCalc(((props.TRUMP / (props.BALLOTS_CA))*100).toFixed(2), ((props.HARRIS / (props.BALLOTS_CA))*100).toFixed(2))
+ '<br>' + props.DEM + ' Democrats '
+ '<br>' + props.OTR + ' Others '
+ '<br>' + props.LIB + ' Libertarians '
+ '<br>' + props.NL + ' No Labels '
+ '<br>' + (props.DEM + props.REP + props.LIB + props.OTR + props.NL) + ' Total </h4>'
+ '<center><b><u>Senator</u></b><br>'
+ props.SEN
+ '<br><br><b><u>House Reps</u></b><br>'
+ props.HSE
+ '</center>'
: 'Hover over a<br>legislative district');
'<h1>Precinct<br>' + props.PRECINCT + '</h1>'
+ '<h2><center>Turnout ' + props.TURNOUT + '%</h2></center>'
+ '<h2><center>' + leanCalc(((props.TRUMP / (props.BALLOTS_CA))*100).toFixed(2), ((props.HARRIS / (props.BALLOTS_CA))*100).toFixed(2)) + '</center></h2>'
+ '<h3><br>' + ((props.TRUMP / (props.BALLOTS_CA))*100).toFixed(2) + '% Trump</h3>'
+ '<h4><br>' + props.TRUMP + ' Votes for Donald Trump<br></h4>'
+ '<h3><br>' + + ((props.HARRIS / (props.BALLOTS_CA))*100).toFixed(2) + '% Harris</h3>'
+ '<h4><br>' + props.HARRIS + ' Votes for Kamala Harris<br></h4>'
+ '<h3><br>' + (((props.OLIVER + props.STEIN + props.WRITE_IN) / (props.BALLOTS_CA))*100).toFixed(2) + '% Others</h3>'
+ '<h4><br>' + props.OLIVER + ' Votes for Chase Oliver</h4>'
+ '<h4><br>' + props.STEIN + ' Votes for Jill Stein</h4>'
+ '<h4><br>' + props.WRITE_IN + ' Write-in votes<br></h4>'
+ '<h3><br>' + + ((props.UNDER_VOTE / (props.BALLOTS_CA))*100).toFixed(2) + '% Undervote</h3>'
+ '<h4><br>' + props.UNDER_VOTE + ' Undervotes</h4>'
+ '<h4><br>' + props.OVER_VOTE + ' Overvotes</h4>'
: 'Hover over a voting precinct');
};

info.addTo(map);

function leanCalc(pctRep, pctDem) {
if (pctRep > pctDem) {
return '<span style="color: red;"><center><b>Trump by ' + (pctRep - pctDem).toFixed(2) + '%</b></center></span>';
return '<span style="color: red;"><center><b>Trump + ' + (pctRep - pctDem).toFixed(2) + '%</b></center></span>';
} else {
return '<span style="color: blue;"><center><b>Harris by ' + (pctDem - pctRep).toFixed(2) + '%</b></center></span>';
return '<span style="color: blue;"><center><b>Harris + ' + (pctDem - pctRep).toFixed(2) + '%</b></center></span>';
}
}

Expand Down Expand Up @@ -148,7 +142,7 @@
opacity: 1,
color: 'white',
dashArray: '3',
fillOpacity: 0.7,
fillOpacity: 0.5,
fillColor: getColorDem(demEdge),
};
}
Expand Down Expand Up @@ -225,7 +219,7 @@

var div = L.DomUtil.create('div', 'info legend'),
grades = [0, 10, 20, 30, 40, 50, 60, 70, 80, 90],
labels = ['<b>Win<br>margin %</b><br>'],
labels = ['<b>Harris/Trump<br>margin %</b><br>'],
from, to;

for (var i = 0; i < grades.length; i++) {
Expand All @@ -247,8 +241,4 @@

</script>

<div class="header">
<span class="lk"><a href="https://lukeknipe.com">LK</a></span><span class="path"> > <a href="https://lukeknipe.com/maps">Maps</a></span>
</div>

</body>
45 changes: 45 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,51 @@ body,
z-index: 0;
}

h1 {
display: block;
text-align: center;
line-height: 1em;
font-size: 1.5em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}

h2 {
display: inline;
font-size: 1.0em;
line-height: 1.3em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}

h3 {
display: inline;
font-size: 1.0em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: normal;
}

h4 {
display: inline;
text-align: center;
line-height: .5em;
font-size: .75em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: normal;
}

.info {
padding: 6px 8px;
font: 14px/16px Arial, Helvetica, sans-serif;
Expand Down

0 comments on commit ef2c063

Please sign in to comment.