-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcreating topojson notes.txt
89 lines (66 loc) · 4.31 KB
/
creating topojson notes.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
first, get cartographic boundary shapefiles for the us from the census bureau.
cartographic boundary shapefiles are simplified representation of selected geographical areas from the Census bureau's MAF/TIGER geographic database.
probably want to grab the boundary of the entire nation and of all the states
https://www.census.gov/geo/maps-data/data/tiger-cart-boundary.html
then use a shapefile parser to take the shapefile and create GeoJson from it.
this actually reads the shapefile (in binary) as well as the included .dbf file which gives attributes to the data in the shapefile
https://github.com/mbostock/shapefile
once the shapefile has been converted to GeoJson, we could view it in the browser,
but it would be faster to apply a projection to it first as opposed to doing that at runtime
for this, use geoproject in d3-geo-projection, which takes a javascript function, the name of the GeoJson file, and the name of the new file to create
https://github.com/d3/d3-geo-projection/blob/master/README.md#geoproject
need to figure out what projection to use. seems like it should be Albers' equal-area-conic projection for the us.
But this is what I thought I was using earlier. I may need to try a few to see what works?
definitely use fitsize. look into parallels() and rotate()?
the resulting GeoJson file from this will be quite large. Simplify it by converting it into topojson.
TopoJson files are much smaller than GeoJson files. Data is stored much more efficiently.
TopoJson represents lines and polygons as sequences of arcs as opposed to sequences of coordinates. Plus some other crap.
use geo2topo to convert to TopoJson
https://github.com/topojson/topojson-server/blob/master/README.md#geo2topo
then use toposimplify to remove coordinates using Visvalingham's algorithm
https://github.com/topojson/topojson-simplify/blob/master/README.md#toposimplify
finally use topoquantize to represent data as integers as opposed to long floating point numbers
https://github.com/topojson/topojson-client/blob/master/README.md#topoquantize
install shapefile parser
npm install -g shapefile
cd shapefiles
shp2json cb_2017_us_nation_5m.shp -o nation.json
shp2json cb_2017_us_state_500k.shp -o states.json
npm install -g @mapbox/geojson-merge
geojson-merge nation.json states.json > combined.geojson
npm install -g d3-geo-projection
geoproject 'd3.geoAlbersUsa().fitSize([960, 600], d)' < nation.json > nation-albers.json
geoproject 'd3.geoAlbersUsa().fitSize([960, 600], d)' < states.json > states-albers.json
d3.geoAlbersUsa().scale(1280).translate([960 / 2, 600 / 2])
I think what I need to do is write all of this crap in Python. so it's easily replicated and changed.
Need to run all of the topojson, geojson stuff through the command line.
problem is that we want the points, outline, and states to be separate so we can draw them separately
but we want them to be projected, quantized, etc together so that they're accurate
should do it all programmatically?
download the shapefiles, unzip them, turn them into GeoJson files
then take the coordinates and turn them into GeoJson and combine other two GeoJson files into one file?
then project that file all at once
then separate the state, nation outline, and points into separate topojson objects all within the same topojson file
then simplify and topoquantize all at once?
Add tooltip labels for the points.
Basically define a div with some text and class of tooltip. Set the opacity to 0.
Then define mouseover events for each point.
on mouseover - transition to .9 or so opacity
on mousemove - set the text of the tooltip and its coordinates. d3.mouse(this) looks like it returns coordinates that can be used to set the position of the tooltip
on mouseleave - transition to 0 opacity
What should tooltip say?
Name of Featured ride
Location
Rank
Length?
ex.
The Whole Enchilada
Vandalia, UT
# 1
NEXT:
Style those mofo tooltips!
Also should probably give the map a title and explanation.
Look at making a choropleth. Should be pretty simple. Just need create a dict of states and number of featured rides.
Hardest part will probably be picking a color pallete. And deciding whether to give categories or a spectrum. 0 - 31 or something.
In order to get the full name of these rides I think I will need to check for ... or \u2026 and if that is present, need to grab the link to the ride site
itself and get the full name from there.