diff --git a/get_data.py b/get_data.py
index 8a2280c..7df10f1 100644
--- a/get_data.py
+++ b/get_data.py
@@ -34,8 +34,8 @@ for state in states[:51]: # Just the 50 and DC, not Guam/American Samoa/PR/etc
for feature in data['features']:
# {"type": "Feature", "properties": {"STATEFP": "01", "PLACEFP": "02260", "PLACENS": "02405163", "GEOID": "0102260", "NAME": "Ardmore", "NAMELSAD": "Ardmore town", "LSAD": "43", "CLASSFP": "C1", "PCICBSA": "N", "PCINECTA": "N", "MTFCC": "G4110", "FUNCSTAT": "A", "ALAND": 5289895, "AWATER": 21830, "INTPTLAT": "+34.9878376", "INTPTLON": "-086.8290225"}, "geometry": {"type": "Polygon", "coordinates": [[[-86.856689, 34.992046], [-86.855354, 34.992044], [-86.855101, 34.99204]
state_place = (feature['properties']['STATEFP'], feature['properties']['PLACEFP'])
- lon_lat = (float(feature['properties']['INTPTLON']), float(feature['properties']['INTPTLAT']))
- place_locations[state_place] = lon_lat
+ lat_lon = (float(feature['properties']['INTPTLAT']), float(feature['properties']['INTPTLON']))
+ place_locations[state_place] = lat_lon
print("done")
print("Fetching population data for all states…", flush=True, end="")
diff --git a/index.html b/index.html
index 9a61f3d..d24b864 100644
--- a/index.html
+++ b/index.html
@@ -61,9 +61,6 @@
@@ -129,7 +126,7 @@
const cities = await response.json();
await state_shape_data_request; // We can't draw until this is in
const state_shape = state_shape_data.features.find(f => f.properties.NAME.toLowerCase() == stateName.toLowerCase());
- const state_mercator_adjusted_bounds = find_bounds(state_shape.geometry.coordinates[0].map(mercator));
+ const state_bounds = find_bounds(state_shape.geometry.coordinates[0]);
if (!state_shape) {
console.error("Unable to find state in shapes");
}
@@ -140,7 +137,6 @@
simplified_cities: cities.map(city => simplify(city.name)),
city_guess: "",
message: "",
- show_unguessed_cities: true,
achievements: {
"Top Five": cities => cities.slice(0, 5),
"Top Ten": cities => cities.slice(0, 10),
@@ -173,21 +169,14 @@
const ctx = canvas.getContext("2d");
ctx.clearRect(0, 0, canvas.width, canvas.height);
- const [minx, maxx, miny, maxy] = state_mercator_adjusted_bounds;
- const height_scale = (canvas.height - 8) / (maxy - miny);
- const width_scale = (canvas.width - 8) / (maxx - minx);
- const scale = Math.min(height_scale, width_scale);
-
- const y_offset = miny - (canvas.height / scale - (maxy - miny)) / 2;
- const x_offset = minx - (canvas.width / scale - (maxx - minx)) / 2;
-
function transform(pt) {
- pt = mercator(pt)
- return [scale * (pt[0] - x_offset), canvas.height - (scale * (pt[1] - y_offset))];
+ // TODO: this just works for MN, and not very well at that
+ return [(pt[0]+98)*80, 600-(pt[1]-42)*80];
}
ctx.beginPath();
ctx.moveTo(...transform(state_shape.geometry.coordinates[0][0]))
+ console.log(transform(state_shape.geometry.coordinates[0][0]))
for (let coord of state_shape.geometry.coordinates[0].slice(1)) {
ctx.lineTo(...transform(coord));
}
@@ -195,29 +184,16 @@
for (let city of cities) {
if (city.guessed) {
ctx.beginPath();
- const c = transform(city.location)
- ctx.fillStyle = "black";
- ctx.arc(c[0], c[1], 2, 0, 2*Math.PI, true);
- } else if (this.show_unguessed_cities) {
- ctx.beginPath();
- const c = transform(city.location)
- ctx.fillStyle = "lightgray";
+ const c = transform([city.location[1], city.location[0]])
+ console.log(city.location, c)
ctx.arc(c[0], c[1], 2, 0, 2*Math.PI, true);
+ ctx.fill();
}
- ctx.fill();
}
},
}).mount();
}
- function mercator(pt) {
- const radians_from_eq = Math.abs(Math.PI/180 * pt[1]);
- // https://en.wikipedia.org/wiki/Mercator_projection#Derivation
- const y_radians = Math.log(Math.tan(Math.PI/4 + radians_from_eq/2));
- const y_degrees = 180/Math.PI * y_radians;
- return [pt[0], y_degrees];
- }
-
// returns minx, maxx, miny, maxy
function find_bounds(coords) {
return [