Make Sankey for Uses Chapter

[ellenbechtel]

Build the first draft of the Sankey in D3

• [x] make the nodes and links diagram

MVP: Design whole-system Sankey in Illustrator, in SVG

• [x] arrange the nodes and links correctly and aesthetically
• [x] make the links somewhat close to proportional to the actual data, if available
• [x] edit the widths of links to reflect flow state (normal, drought, and drought+release)
• [x] label nodes and links appropriately
• [x] style everything so it's in line with the water color asthetic

Investigate and compile data for three views of Whole-DRB Sankey

• [x] List of observation sites (aka, the reservoirs as well as diversions to NYC and NJ) that we can get close approximate data about. Top three are Cannonsville, Pepacton, and Neversink, but ideally we'd get all of them.
• [x] Normal non-drought flow volume
• [x] Late Summer drought flow volume
• [x] Late Summer drought flow volume + release volume, showing how we fill the gap to maintain flow levels at Montague.

Nice To Have:

• [ ] Make the SVG Sankey link widths reflect the actual data collected, and not just be an approximation
• [ ] Make sure all the SVG shapes that could animate are individual compound elements that can be tagged with an ID for flubber animation, if desired
• [ ] animate the transitions with flubber
• [ ] Make additional vis illustrating the different users of water in the DRB, and their impacts on water quantity and quality.

[ellenbechtel]

Here are some helpful links for drawing Sankeys in D3 Version 4: https://bl.ocks.org/d3noob/06e72deea99e7b4859841f305f63ba85 https://www.d3-graph-gallery.com/sankey

Visual Inspiration for making Sankeys Look Good https://www.visualcinnamon.com/portfolio/adyen-report-2019

Extra Plugins for Pretty-fying https://ricklupton.github.io/d3-sankey-diagram/

In D3 Version 3 (not supremely helpful) https://github.com/benlogan/VerticalSankey/blob/master/scripts/sankey.js https://bl.ocks.org/bin-yan/3072c337862c54fbacf49c503a378421 https://bl.ocks.org/wvengen/cab9b01816490edb7083

In D3 Version 5 (not supremely helpful) https://observablehq.com/@d3/parallel-sets?collection=@d3/d3-sankey https://jarrettmeyer.com/2018/05/31/creating-a-d3-sankey-graph https://observablehq.com/@d3/sankey-diagram?collection=@d3/d3-sankey

[ellenbechtel]

I have some thoughts!

1) @jread-usgs I think it was you who said that the final sankey might be really hard to make look good. I tried it using pure code.... and you're so right. It's gonna be very complicated to get it positioned right.

So, I'm thinking that the coded version could be a good way to compare two states - switch between normal flow and drought season flow. But then show a system-level view of the whole network of flow (with a focus on reservoirs) in a still image.

2) I made a quick mass/volume flow diagram in Illustrator that has some promise. But it would be a still image, and not built in code.

A flow-only piece could be really striking, but it does not address the concern that @aappling-usgs brought up that release decisions is just ONE piece of this uses story - there are also things other than reservoirs that use water (land use, ag, industry, drinking water, etc) and dynamics other than flow that drive usgs to monitor water (ie, the volume-quality interplay).

Don't have a great next idea, but I wanted to keep you updated on progress. I'm going to spend a little more time taking this sankey idea as far as I can, and then let's evaluate tomorrow or Monday

• whether the sankey idea is our best shot for the final deliverable, or,
• if sankey is one part of the deliverable for this chapter and we need to something else in addition, or,
• if the sankey really isn't doing it and we need to come up with a better idea for a vis that shows the interplay of dynamics

[aappling-usgs]

I love the colors in your full-DRB mock-up, and I like how the two cities really stand out as major consumers of water.

I've been attempting some variants on key points to think about what's necessary and sufficient to set up the rest of the chapters. Here are some ways I think this chapter could go:

1. We use dams and canals to distribute water to those [humans] who need it. Sankey or plumbing representation emphasizes our control over volumes. Transition: In the next chapters you'll learn that this distribution system affects not just the river's volume but also its water quality. future chapters are then responsible for clarifying that there are factors in addition to the distribution system that also affect water quality

2. We use dams and canals to try to send water where it's needed, but this is complicated by the variability of the natural water cycle. Sankey or similar emphasizes the variability of inputs and the difficulty of guessing correctly about outputs to meet our legally fixed targets. Transition: In the next chapters you'll learn that adjusting flows can also help or hinder our efforts to manage water quality, and that while this is our most direct lever, we have many tools at our disposal to manage quality.

3. Many parties depend on the Delaware River network for its clean water, including (1) cities, which withdraw water using reservoirs that also affect flow downstream, (2) fish, birds, and other organisms, and (3) recreational uses of the river for fishing, boating, scenic views and communities, etc. Visual emphasizes players and happens to mention reservoirs. Transition: These many users depend on smart management of reservoirs, roads, farms, and other infrastructure to ensure the waters of the Delaware are are adequate in quantity and quality to support these uses.

4. Despite the wild and scenic appearance of the Delaware river network throughout much of the basin, humans affect the quantity and quality of these waters in may ways, intentional and unintentional. Visual emphasizes levers, including but not limited to reservoirs. Transition: With great power comes great responsibility and a need to make data-driven management decisions that will effectively balance the needs of the Delaware Basin's many water users.

[jordansread]

Awesome work Ellen! This looks sharp. My comments are separate from Alison’s enough so I don’t think they conflict.

I was thinking about your flubber morph idea. What if you morphed the real river network (the watercolor river fill) into this sankey? This would assume the sankey ended up being the choice (see Alison’s thoughts above) and that this diagram follows the intro, but if both were true, a morph would be a neat way to connect users to the idea that the simplified diagram represents the real system. Plus you could imagine scrolling up to reverse the morph and that would look cool too 😀

[aappling-usgs]

OK, I finished up my earlier comment laying out a few possible directions for this chapter.

The first two are compatible with a Sankey; (1) could be static (and would emphasize the basic fact of city water use rather than highlighting decision complexity) while (2) would benefit from dynamic transitions to show changing inputs over time. They also rely on subsequent chapters to introduce stakeholders other than public/industrial supply, specific water quality needs, and levers on water quality.

(3) would do better with a non-Sankey, I think - perhaps a bunch of pictures/sketches, on a map or not, or a graphic (pie chart???) of economic values from papers such as the one Colleen found. Could we place some key economic numbers on the map using sketched pictures, circles/highlights along certain reaches, etc.? Or what about showing a streamside scene with fish, birds, boaters, and a dam? Regardless of the specific graphic, this general approach would require us to work harder to squeeze in enough information about reservoir releases to get the River Master much attention, if that is a definite need for USGS. We wouldn't want to steal the thunder of the salinity/sediment/temperature chapters, but I think we could avoid that by limiting ourselves to showing the organisms/uses without getting into which water quantity or quality parameters matter for each use.

(4) is not my favorite because I think it will be too hard to introduce all those science/tech ideas in an engaging way before introducing stakeholders, etc.

None of my 4 ideas have a ton of space for reservoir-specific Sankeys. I'm definitely willing to discuss and be persuaded, but at the moment I think we can work with just one Sankey effectively.

Also, none of my 4 ideas goes deeply into the ways that reservoir releases affect water quality, even though I was eager to bring in those ideas a few days ago. I tried and haven't been able to think of a way to bring them in elegantly - I think they're simultaneously too complex and also don't tell enough of the bigger story on their own.

At the moment I lean toward (1) or (2) (depending on how easy it is to animate the sankey for changing inputs) as an MVP. I think (3) would be the next-best substitute, but I also think I like it better as a potential complement that could come before or after the Sankey (probably after it if we want to go for the Flubber transition Jordan suggested above). Earlier in the week I was dreaming of some way to combine the many-users idea into a Sankey, but today I think it'd be cleanest to introduce them in two separate visuals.

What do you think?

[ellenbechtel]

This is super helpful, @aappling-usgs . As I started reading your first comment, I starting coming to another idea to meet the "illustrating multiple uses" part. Do you see any promise in this direction? Ignore the green-ness, it's just the only marker I had.

I'll continue thinking about the balance of sankey + something else and write more after standup.

[jordansread]

that looks cool!

[ellenbechtel]

An update on the original, showing rivers a little better and emphasizing that the reservoirs are "stops" along the tributaries that decide how much flow goes through.

[aappling-usgs]

I like the multiple uses viz idea. What are the dots? Also, want to explore adding fish, fisherpeople, and boaters/swimmers?

[ellenbechtel]

Dots are just vague visual reference to a "trace" or "influence" ... maybe a different temperature, maybe a trace chemical, maybe some sediment, or some other measure of the water quality changing. The focus here is quality, since it doesn't really encode flow quantity.

Here are three more sketches of it, with variations on labeling and dots and flow loops. I'd put this idea closer to the "illustration" end of the spectrum, near where simplified diagrams go. It's not particularly data-driven, it's meant to show conceptual connections. I'd say does align with the purpose of this chapter, but just wanted to name that that's where this idea is headed, if we decide to go this direction.

Otherwise, here is an update on whole-system sankey, with River names drawn in, and with new emphasis on the concept that the reservoirs are "stops" along the flow.

[ellenbechtel]

@aappling-usgs What do we think of these categorizations? My train of thought has wandered to see what might be possible closer to the data-driven end of the spectrum of visuals.

Aside from how interesting it is that the categorization schema that USGS uses for water use metrics has changed, I wonder if we can take water use data, give each category an encoding (a visual cue, as well as a quality impact), and diagram it out.

https://www.usgs.gov/mission-areas/water-resources/science/changes-water-use-categories?qt-science_center_objects=0#qt-science_center_objects

Sending a sketch of my idea in a few minutes.

[aappling-usgs]

Love it. I think a conceptual diagram would be sufficient for the water users idea - and we won't be able to capture the non-human or recreational users with the water use data - but I'm definitely intrigued and looking forward to your sketch. If we can make it work, data is always cooler than not-data IMO.

BTW - we've spent a lot of time with these water use data in the past - linking to our two water use vizzies here in case they help with inspiration or data exploration: https://owi.usgs.gov/vizlab/water-use-15/#view=USA&category=total has spatial detail, and while I don't think we need to include water use history in the DRB viz, the temporal bit is visualized here: https://owi.usgs.gov/vizlab/water-use/. Note that both vizzies settled on using only the coarsest categorization of water use so that we could harmonize over space and time, but for the DRB viz maybe we could use more detailed categories because we're only talking about one spatiotemporal snapshot and more space to elaborate.

[aappling-usgs]

A couple of minor thoughts:

You're working with a pretty rectangular design aesthetic here - that's totally cool for now, but I'm also curious if you have any watercolorey versions in mind if we decide to go for adding this figure to the viz.

Also, this might be getting more literal than necessary, but the boaters, birds, and fish don't really take water out and then return it - would there be a useful and simple way of avoiding the implication that they divert and return water? Make their angular take-outs more like eddies or edges of the main channel rather than totally separate channels?

[ellenbechtel]

Totally hear you on your last comments. I agree that if we're making any sort of visual diagram, we shouldn't be misleading people by insuating "fish take water out and put it back in." Future versions will definitely have that part thought through better.

And, agree, rectangles are just easier to draw in Illustrator...low investment right now. Future versions will definitely be organic.

[ellenbechtel]

Okay, a crappy brain dump.

With encoding like:

I'm with you on the sentiment of trying to be data driven. However, I'm not sure if this categorization hits all the things we want to hit (recreation isn't included, nor is driving/road salt, and the use categories have a ton of extra categories that we don't talk about anywhere else in the story).

What do we think about those two different categorizations? One (the water use data one) is USGS-driven, but isn't necessarily holistic. The other is more conceptually complete (land use, cities, households, ecosystems, fisherpeople...they all use water and have impacts on quality/quantity) but doesn't have great data around it.

Anyway...things to think about over the weekend!

[aappling-usgs]

Cool! My gut says to stay simple and elegant on this one. Kinda curious how many numbers we could attach using that economics paper that Colleen found, but also comfortable with a numbers-free graphic here.

[ellenbechtel]

My gut says the same - let's keep it simple. What about something like this? We could make a list of a bunch of common activities and their general impact on water quality/quantity, then have an interactive table that lets users sort by category (ag, industry, municipal, etc) or impact (temperature, salinity, sediment, etc) and see all the things that have that impact. Or all the things that don't have a big impact (like canoeing!)

I have another idea coming in a few minutes, where this information is plugged into a sankey. Give me half an hour and I'll send it.

Otherwise, what's your schedule like tomorrow morning? I've got nothing on my schedule, but I'd love to spend 20-ish mins with you in a huddle to make some decisions about next steps (build? draw? keep thinking? etc). Let me know!

[ellenbechtel]

One quick update on the individual sankey, which we can tweak to show how flux in inputs means that we have to flux outputs.

We could encode the text for inputs, central text, and outputs to change for a few different activities. Such as.... (coming in a few mins)

[ellenbechtel]

Maybe a rotating slidedeck (auto-transitioning every 3 seconds or so) to show a sankey for each kind of water quality/quantity impact? Some examples are:

To be honest, I'm not sold on any of these ideas. I think it's really hard to do justice to a complex dynamic in visuals - I'm not sure I've seen anybody do a mind blowingly novel "water cycle" diagram, though I could of course be wrong!

I just want to be honest about my ability to pull off something visual-based to describe dynamics as nuanced as this, where it's less about the data we can collect about it and more about the intertangled relationships that we can observe. Which, by nature, are complex, and hard to simplify in a clean, elegant way.

I'll keep my thinking hat on until tomorrow, but let's huddle and make a game plan about it.

[ellenbechtel]

Okay, here's what we've decided. I'm updating the checklist in the original issue to reflect the following:

MVP	Nice To Have
Intro and the Uses chapter make written AND visual reference to the big picture concept that 1) water is important and 2) water in the DRB is used by many different users.  -                Visual could be a slideroom/array of pictures of people/animals/industries using water in the DRB	-                Visual could be a graphic or diagram illustrating a bunch of the main users and the impacts they have on water quantity and quality
Uses chapter has three whole-system Sankey diagrams, one for each state (normal winter, summer drought low-flow, and summer drought + releases) -                MVP is to look into the data to encode real flow data into the widths of the Sankey.  Whether it’s used or not is NOT MVP. -                Points to highlight are 1) how much water is diverted for NYC and NJ, 2) how the downstream flow amount changes seasonally, and 3) how we can use reservoirs to fill the gap.	-                Sankey could encode actually flow data via the widths of each link, if the data is accurate/meaningful/shows what we want to illustrate. -                Flows could morph into each other via Flubber, if we tag the right SVG paths to interpolate from one state to the next.
Uses chapter has text that creates a flow of ideas from the intro through this chapter and into the next. Possible main points to select among: DRB has many users and those users redistribute water using dams, canals, and withdrawals.                   (1) and also the Supreme Court tells us wht to do                   (2) and also it's helpful/critical to have monitoring and modeling to support water quantity management                   (3) and also quantifying the impacts of our decisions on both water quality and quantity - keeping a watchful eye on the before-and-after of water management.                   (4) and also supporting water quality management                   (5) and also quantifying the impacts of our decisions on both water quality and quantity - keeping a watchful eye on the before-and-after of water management.

[ellenbechtel]

Here's the latest, but I'd like to do a better job indicating that the reservoirs are actually reservoirs, and making a distinction between the watercolor river flow and the inked reservoir names.

[ellenbechtel]

What do we think about these three views? These were relatively easy style edits, and we can edit again once we look at water budget data and discuss feedback about flow from the demo with Kendra and Brian. But wanted to get a sense if this was in line with where this is headed.

View 1: Normal flow!

View 2: Drought!

View 3: Release!

I tinkered a lot with what layers are visible at any time, what is faded out, etc. Even tinkered with how to make visual reference to salt without talking about it. Not super happy with what I made, but still, options. (Ignore the gray line in the middle...again, that's a default Illustrator background that snuck into my screenshot).

All goes to say is - there's a lot we can do!

That's it for today.

[aappling-usgs]

I love the use of brown and blue to contribute the different sources/volumes of water. I also really like the Gaging Station icons, though I am confused about why Trenton varies between light and dark gray - does that change have a physical meaning?

Maybe this is a difference between what works best for static vs animated versions of this visual, but I had been imagining that we'd show releases from just one or a few reservoirs rather than all of them simultaneously. I also think it would be more accurate, and maybe conceptually useful, to show part but not all of the flow difference between "normal" and drought being made up by releases - the mainstem probably stays relatively low flow even with the releases, but the releases keep the flow from being painfully low.

The salinity/estuary part of the visual is looking challenging to me - I agree that it's not quite there at this point, though I appreciate that you've tried out some ideas. I'd be content waiting until the next chapter to introduce salinity.

[ellenbechtel]

Good points, AA. What do you think about this version, showing a single release from Cannonsville?

As for the gaging station, I had "faded out" words that might not be the main focus of the story at that point. Those are all up to change based on the text! But for example, if we're talking in View 2 about the gaging stations, we should fade out the other labels and make the gaging stations solid. Then in View 3 if we talk about a release from Cannonsville, we should fade out everything except the Cannonsville label.

more thoughts about flow state coming soon

[ellenbechtel]

You make an interesting point about marking "very low but not bad" vs "painfully low, not legal."

My concern is that for the sake of this visual, unless we make the change drastic enough, people might not be able to notice that the three states of river flow (plenty of flow, low, and painfully low). The current version does that. But it's not super obvious. What do you think?

But maybe it's clearer to change the gaging station markings to indicate that the flow is just too low:

It's subtle, but does indicate that in the "low flow" state, the river flow is "too low" or something. I'm not sure. Maybe I'm getting to abstract with this gaging indicator idea. What do you think?

[aappling-usgs]

I liked the combo of side-by-side brown and blue in the reservoir release image - what do you think about bringing that part back? I think the just-Cannonsville version of that one could be pretty cool because you could have one vertical blue strip running through the channel that would show that Cannonsville's release affects flow all along the rest of the mainstem.

[aappling-usgs]

I like the use of the gaging station icon width to indicate "legally sufficient" and then have the images show plenty, too low, and just right. I think you're doing that in both of the 3-panel versions you shared in your last comment, so I'm confused about

maybe it's clearer to change the gaging station markings to indicate that the flow is just too low

to distinguish the second set from the first set - can you spell out for me what is different?

[aappling-usgs]

Oh, wait, now I see it - the second set has "just right" on the righthand side, whereas in the first set the markings still extend beyond the channel width. I like the second set better for that.

[jordansread]

I liked the combo of side-by-side brown and blue in the reservoir release image - what do you think about bringing that part back?

This may be related to my comment during the demo, which was asking how physically realistic it should look vs communicate the different water masses. I noted that this isn't how water looks or flows in a channel, and also that it contrasts with how we'd be showing the salt wedge in the later sections. I am supportive of making comprehension vs realism tradeoffs, I just wanted to make sure the tradeoff was known and considered.

[aappling-usgs]

Got it. I'm not especially worried about that loss of realism in light of all the other simplifications that are happening here, but if one version fits better with the salt wedge graphic then I'm supportive of that choice.

[aappling-usgs]

Random thought as I'm working on text: should we include Philadelphia as a third major destination for DRB water? Ideally we'd answer this question with data, but for the moment I'm just thinking about how prominently the DR flows through Philly.

[ellenbechtel]

The latest for demo!

• clarified color transitions
• clarified the Cannonsville release
• added Philadelphia
• removed "brushing" (fading out one area to focus on others...that can be done in css later and doesn't have to cloud our decisions here)

[ellenbechtel]

I think a comment about the blue "release" from cannonsville got lost, so I can't remember what exactly the feedback was, but I knew that I needed to make the release a little more clear. What do we think of these as the final sankeys?

[aappling-usgs]

Beautiful! We might get clarity feedback from reviewers who are less familiar with the viz, but I bet that what you have above, in conjunction with the text, will work just fine. I really like how the colors mix all throughout the river.

[aappling-usgs]

One thing I've been thinking about but holding my tongue on is the choice to make the headwaters brown. It makes sense from a brown-means-less-water intuition, and maybe that's how most others will see it. One thing I think of, though, is that water below dams is often artificially clear because the dam inhibits sediment movement, so you could make the case that the colors ought to be flipped: blue near the dams, brown in the main channel. I've kept quiet thus far because I like the looks of the current design, and I think our best approach is to wait to see if the coloring bothers any reviewers...but here's your heads-up that I think we might get a comment on it.

[ellenbechtel]

Thank you Alison!! That's a super astute observation. That's definitely easy to change too, so if we do get pushback from reviewers (or we decide to change it ourselves) then it's not a huge deal.

[ellenbechtel]

Here are the final files, as SVGs and PNGs sankeyViews.zip

[abriggs-usgs]

Pull Request - https://github.com/usgs-makerspace/delaware-basin-story/pull/40 reduced the file to 1080px high, used the Portable Network Graphics format (PNG), and redeployed project