At a high level, I really like this. Some UX concerns are all that stop it from being amazing:
- The mouse should be a pointer, not a hand. Not only is that the expectation when an element is interactive, but it helps with precision clicking.
- The map almost made me sick when it starting moving. It needs to be slower and smoother. You already let people speed it up, but start slower.
- Dragging the map should be possible. I wanted to scroll back to something that had moved off-screen, and the map dragged a few pixels, then snapped back. If it is supposed to be draggable, let it drag. If not, don't let a drag start and then snap it back.
But really, those concerns aside, this is a nice tool.
Hey, thanks for the feedback. I actually struggled on what to do with the cursor, since the map is draggable (when not at min zoom level) prior to a click and the default mapbox cursor is denoting that. On balance, I think you're right that a default cursor might be better.
Re: interaction during the run, I thought about allowing you to interact and just pausing the run while you do, but thought that too many people would interact accidentally, pause the run and then not understand that they had to click somewhere to resume. It's a feature that would technically be ideal, but practically would throw a lot of people off-track with incidental interaction I think (I had this same issue with the decision to start the run right away instead of giving the user and overview at the beginning. Technically, I think it would be ideal, practically, I think a lot of people could miss the main feature of the site altogether).
Speed-wise, I've already slowed it down a good amount from the original iteration, if you can believe that, but I could take it down a little more. There's a weird kind of balance in perceptual speed between camera height and true speed, so I've tried to not give a user full control over speed/zoom, because most options are very bad. I can, at least, take the base speed down a little, and maybe give more precise speed control than what's there. Fundamentally, though, I don't want the default setting to take ten minutes for a run, and I also want you to really be able to see the mountains and canyons.
Just wanted to say thank you for this tool! I hope you keep it online as I want to use this for my kids as they grow up to teach them this when they reach it in school.
Also, as it stands right now as of this post I found the UI to be fine, the speed was decent and did a good job of following the path without taking too long or being too fast, I think its at a good balance right now.
It's actually an interesting regional issue, because the allocation of Great Lakes water is ultimately governed by a treaty with Canada. Taking water out of the Great Lakes watershed is prohibited without being granted by an exception.
This became a local issue in Waukesha, because the town is on the boundary, so they have two water systems, and the one on the Mississippi side got contaminated. They eventually got permission to connect the whole town to the Lake Michigan side, by agreeing to return all of the drain water back to that side.
Since no one else has done it I will ask for features: sometimes it takes a while for it to determine the route, there is no way to cancel that to go back to trying a new raindrop location
Wish there was a different way to get back to raindrop location instead of closing the existing route. Would prefer some kind of click/tap-state or gesture. More easily noticeable of an inconvenience on an ultrawide screen.
I struggled with this a lot. Originally set that ending overview at the beginning, but was worried that practically a lot of users might miss the main feature. I've heard from a lot of people that they were surprised it went into the 3D view, and I think some people might see the plot and just assume that's it.
One thing which I suppose isn't surprising, but still was amazing to see at scale, is I put a drop in Colorado that ended up in the Gulf of Mexico. As the camera followed the path, it's nothing but farms, with the odd city sprinkled in. I got bored and left in Nebraska, but I imagine it's like that the whole way.
It's obvious it takes a lot of land to feed everyone, but to see it like that really drove it home.
Depending on where you placed that drop in Colorado it also could've ended up in the Pacific. The continental divide is in Colorado and all water west of the divide will eventually drain into the Pacific and all water east will drain to the Atlantic.
Another fun, if more subtle divide is right around Hibbing, MN -- step west and water flows down the Mississippi to the Gulf of Mexico, step north and water flows up to Hudson Bay, step southeast and water flows through the Great Lakes to the Atlantic Ocean. https://www.google.com/maps/@47.4206243,-93.0430116,12.7z
The Great Basin is an endorheic basin (no outflow) located west of the Rockies, so not quite all the water.
From Wikipedia: “ The hydrographic Great Basin is a 209,162-square-mile (541,730 km2) area that drains internally. All precipitation in the region evaporates, sinks underground or flows into lakes (mostly saline). As observed by Fremont, creeks, streams, or rivers find no outlet to either the Gulf of Mexico or the Pacific Ocean. ”
I've been enjoying placing a drop right along the divide and seeing which way it goes. For example, up near Lenawee Mountain (aka A-basin). I've also noticed that up there, sometimes there is no route to either ocean. I guess it ends up in a high-alpine catchment and stays on the divide.
Another neat thing about the eastern half of Colorado is the division between the Platte/Missouri and the Arkansas. A small difference in starting point has a huge impact on the route you travel to get to the Mississippi.
This is amazing, outstanding project! Interestingly, I got it "stuck" when I clicked somewhere random in California (Pope Valley, apparently): https://i.imgur.com/deOsIt2.png
The path, having almost reached the mouth of the Sacramento River, seems to have been captured by the very artificial Mallard Reservoir in Concord, Contra Costa. As to be expected, it seems that anything draining into the Sacramento will do the same.
Really nice work. However, I would really love to have a no animation option. Just show me the route from the continental view. I pretty much have to reload to get it back to the starting point reliably. Fun to click into the animation, but not every time. Thanks for putting this up!
There's a small part of North Dakota (and a teeny part of Montana) that drain into Hudson Bay. This led to the odd fact that these parts of the Midwest USA were for a while British territory (until 1818). https://en.wikipedia.org/wiki/Pembina_Region
It would be an interesting problem to see / solve where in this map would a drop travel the most. By just clicking, I got one that travels from Cavour, South Dakota to Gulf of Mexico over a 3523 Kms journey. I am sure there must be something that is longer!
Edit - some of the routes stop at border of Canada - is this due to lack of dataset?
The source of the Missouri River - Brower's Spring apparently - is probably close to the point where it's longest. I can't find it exactly on this map, but have got up to 5790km, from a point just by Yellowstone Airport.
Ha I appreciate you sharing the repo, but if someone is interested in finding a longest route, they should probably just go straight to the data source (USGS NHDPlus data/NLDI API)
The longest route in this dataset is almost certainly from Northwest Montana to the Gulf of Mexico; see, eg. the beautiful illustration of watersheds in North America at [1]. Example: [2]
This is cool! Did you have some info on this or use some data to find this? I was randomly clicking points on center of US and many were just ending in a nearby lake. I only found a few that ended up in the sea..
- The mouse should be a pointer, not a hand. Not only is that the expectation when an element is interactive, but it helps with precision clicking.
- The map almost made me sick when it starting moving. It needs to be slower and smoother. You already let people speed it up, but start slower.
- Dragging the map should be possible. I wanted to scroll back to something that had moved off-screen, and the map dragged a few pixels, then snapped back. If it is supposed to be draggable, let it drag. If not, don't let a drag start and then snap it back.
But really, those concerns aside, this is a nice tool.
Re: interaction during the run, I thought about allowing you to interact and just pausing the run while you do, but thought that too many people would interact accidentally, pause the run and then not understand that they had to click somewhere to resume. It's a feature that would technically be ideal, but practically would throw a lot of people off-track with incidental interaction I think (I had this same issue with the decision to start the run right away instead of giving the user and overview at the beginning. Technically, I think it would be ideal, practically, I think a lot of people could miss the main feature of the site altogether).
Speed-wise, I've already slowed it down a good amount from the original iteration, if you can believe that, but I could take it down a little more. There's a weird kind of balance in perceptual speed between camera height and true speed, so I've tried to not give a user full control over speed/zoom, because most options are very bad. I can, at least, take the base speed down a little, and maybe give more precise speed control than what's there. Fundamentally, though, I don't want the default setting to take ten minutes for a run, and I also want you to really be able to see the mountains and canyons.
https://developer.mozilla.org/en-US/docs/Web/CSS/cursor
Also, as it stands right now as of this post I found the UI to be fine, the speed was decent and did a good job of following the path without taking too long or being too fast, I think its at a good balance right now.
It's actually an interesting regional issue, because the allocation of Great Lakes water is ultimately governed by a treaty with Canada. Taking water out of the Great Lakes watershed is prohibited without being granted by an exception.
This became a local issue in Waukesha, because the town is on the boundary, so they have two water systems, and the one on the Mississippi side got contaminated. They eventually got permission to connect the whole town to the Lake Michigan side, by agreeing to return all of the drain water back to that side.
Since no one else has done it I will ask for features: sometimes it takes a while for it to determine the route, there is no way to cancel that to go back to trying a new raindrop location
Wish there was a different way to get back to raindrop location instead of closing the existing route. Would prefer some kind of click/tap-state or gesture. More easily noticeable of an inconvenience on an ultrawide screen.
It's obvious it takes a lot of land to feed everyone, but to see it like that really drove it home.
https://en.wikipedia.org/wiki/Continental_Divide_of_the_Amer...
From Wikipedia: “ The hydrographic Great Basin is a 209,162-square-mile (541,730 km2) area that drains internally. All precipitation in the region evaporates, sinks underground or flows into lakes (mostly saline). As observed by Fremont, creeks, streams, or rivers find no outlet to either the Gulf of Mexico or the Pacific Ocean. ”
https://goo.gl/maps/s9Gep775ZLDgddzz7
[1]: https://en.wikipedia.org/wiki/Watersheds_of_North_America
Love the visualization!
And in Montana it's Triple Divide Peak https://en.m.wikipedia.org/wiki/Triple_Divide_Peak_(Montana)
Edit - some of the routes stop at border of Canada - is this due to lack of dataset?
The code is at https://github.com/sdl60660/river-runner/, it would be quite possible to base a solver on that.
[1] https://www.visualcapitalist.com/maps-worlds-watersheds/
[2] https://river-runner.samlearner.com/?lng=-113.26136901231438...