Hexagons! #31
Open
Hexagons! #31
Conversation
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
This file represents every UK parliamentary constituency as a hexagon arranged on a grid that maintains a semblance of geography. This will let us show a different view of the UK that won't be overwhelmed by all the sparsely populated rural constituencies and hide all the densely populated urban constituencies. The data was created by the [ODI Leeds][odi-leeds] as part of their [Hexmaps project][odi-hexmaps], thanks to them for making the data open; it makes things better! [odi-leeds]: https://odileeds.org [odi-leeds-hexmaps]: https://odileeds.org/projects/hexmaps/constituencies/
[This plugin][d3-hexjson], by [Oli Hawkins][oli-hawkins], lets us render the hexjson file via D3. [d3-hexjson]: https://github.com/olihawkins/d3-hexjson [oli-hawkins]: https://olihawkins.com/
The object we send to the events is the constituency representation from the topo json file. The structure of this object will be different when we introduce the hex json version. As it happens we only use the id of the constituency in any of our handlers, and this will be present on the hex json objects, so we can just pass that instead.
If the mapMode is set to `topo` (the default) we draw the geographic maps we always used to. If we set it to `hex` though, we'll draw the hexagon map based on the hexJSON file from the ODI. We don't need the projection and path stuff from the topo json maps because those are to do with translating spherical maps onto a flat plane. Other than that though, it is pretty straightforward. Our hex rendering is based pretty strongly on the examples from the [d3-hexjson project][d3-hexjson]. [d3-hexjson]: https://github.com/olihawkins/d3-hexjson/
I'm not sure why we have it and I can't see any downsides to letting people zoom in or out as much as they want.
Also for the d3-hexjson library.
Originally I hoped to just filter the uk map to only include the relevant constituencies, but for some reason the d3-hexjson library would render some of the files incorrectly. The problem seems to be that the reduced number of hexagons in each file means we have to translate the `q` and `r` attributes of each hexagon into an absolute grid reference, and sometimes this means we move a hexagon from an odd or even `q` or `r` onto an even or odd one. As [rendering hexagons by grid reference][hex-coords] is dependent on the odd and even state of the `q` and `r` attributes, this meant that for some of the smaller maps some rows were drawn incorrectly, making the whole map wrong. I tried detecting when the absolute `q` and `r` had a different odd or even state compared to the original, but this meant that the rendering of the map was offset by a row or column, and so the arrangement was good, but it wasn't centered on the screen. The solution I ended up with was to manually translate the `q` and `r` attributes of each map to an absolute space that preserved the correct odd and even states and didn't cause a problem. This was painful, but perhaps could be automated later if we need to regenerate the subdivisions for any future constituency changes. [hex-coords]: https://www.redblobgames.com/grids/hexagons/#coordinates
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What
Introduce a map mode that lets us toggle between a geographic map of the constituencies and a hexagon map where each constituency is the same size.
Why
This alternative view means we don't give visual priority to large sparsely populated constituencies; the price of which is giving up some geographic accuracy (e.g. no London constituencies have an eastern seaboard, but they do on the hex map version).
Screenshot
My Life Story
I've been meaning to do this for ages, but I wanted to do this in a way that would automatically generate the hexes from the geography because the hex data didn't seem to exist as open data and the challenge sounded fun. I failed abysmally at doing that, but happily, the ODI Leeds ran a project to create an open data hex map of uk constituencies and we can use that instead. I mean, it took me nearly a year to swallow my pride and admit I couldn't do this on my own and just integrate their data. Still, better late than never.