Closed dabreegster closed 3 years ago
I don't have an easy way to deploy the changes, so here's 3 screenshots at least. The contour map one is very vertical; if we go with it, maybe should size down.
Personally I find the elevation profiles the easiest to read, but it'll be more persuasive if you lock both Y axes to the same scale. I think with that the decreased steepness and total climb will be intuitive from looking at the charts.
but it'll be more persuasive if you lock both Y axes to the same scale.
This makes sense! The axis labels are a little too specific right now anyway. We have some code lying around for picking better intervals for axes; I'll apply it here and report back. Thanks!
Personally I find the elevation profiles the easiest to read, but it'll be more persuasive if you lock both Y axes to the same scale. I think with that the decreased steepness and total climb will be intuitive from looking at the charts.
Exactly what I was thinking!
re: elevation-profiles.png
Sounds like we're going to change this to adjust the axes anyway, but one more difference that we should address is the font.
Should I use two separate images for the two elevation profiles? I just quickly squished them together and added the header in kolourpaint. Indeed styling with CSS might be easier.
Should I use two separate images for the two elevation profiles?
Oh, I didn't realize they were one image. I haven't run it locally, but I imagine the image would be pretty small on mobile.
I'd recommend doing like with the "Time Saved / Lost" diagrams so that they are side-by-side on wides screens, but one on top of the other on mobile using the "wrap-two" class.
PTAL:
Nice! This definitely improves the impact. Can we also lock X axes to the same scale in both? That will reinforce the distance message, and sidestep a possible grumble about steepness distortion.
Getting better!
Can we also lock X axes to the same scale in both? That will reinforce the distance message, and sidestep a possible grumble about steepness distortion.
Agreed that this would be nice!
I think currently it's just two different screenshots - one taken before the proposal, and one taken after. I'm not sure how trivial it would be to plumb all that through.
Using a consistent elevation was relatively easy because we used a map-wide constant to determine the max-Y, but I think we'll have to do some per-trip comparison for trip-length, so might be a relatively larger change.
I'd love to have a proper comparative elevation chart showing before vs. after in a single chart. Even with the uniform max-Y, it's a little hard to see... but that would be creeping our scope even more.
One quick compromise could be to, just for the purposes of this screenshot, hardcode the x-axis to (e.g.) 3 miles, and deliberately work on a proper comparative elevation chart for a future proposal.
As you mentioned, having an odd number of labels for the y-axis produced awkward labels.
Personally I'd favor just two, so instead of [0, 133.3, 266.7, 400]
, I think it would be more useful to have [0, 200, 400]
. My understanding is that we're rounding the y-max to a power of ten, so dividing by 2 should always produce a nice round value.
Is it easy to remove a bucket? WDYT?
I just hardcoded the X-axis for the moment, as suggested. And lowered the number of buckets. Looking better?
much better!
One final note: did you intentionally change trips or reverse the trip direction somehow?
I picked a different trip that goes in the opposite direction; agreed it looks a little funny. Let me pick a bit more carefully..
One more try
Nice! This makes the strongest, easiest-to-follow case yet.
I noticed the y-axis of the two charts, though they had the same units, didn't align vertically (just due to how the images were cropped)
I addressed this here if you'd like to merge them in: https://github.com/a-b-street/docs/compare/main...michaelkirk:mkirk/elevation_broadmoor?expand=1
But in the process, I had the two charts overlayed in krita anyway, and thought maybe this would be a better way to compare anyway, especially on mobile where the two charts won't be side by side:
WDYT?
I had the two charts overlayed in krita anyway, and thought maybe this would be a better way to compare anyway, especially on mobile where the two charts won't be side by side:
Thank you for the edits! Seeing the two lines together is the most clear, honestly. I think the text caption suffices to explain blue/green (along with the picture above it), so no need to squeeze in labels.
I think this looks pretty solid:
Agreed. This feels like of discussion of 2 small charts, but I think each revision has successively told the story better.
There are 3 things we might show -- the contour map, the steep street coloring, or elevation profiles. I'm guessing we want to pick just one of them. Any opinions? And is this the place in the article where this information best fits?
@eldang, your opinion is more than welcome here of course. :)