🎉 (slope) feature parity with line charts / TAS-708

[sophiamersmann]

Adds line chart features to slope charts.

Designs are implemented in a later PR. For now, I removed all custom rendering logic and used the line chart's line legend for labelling. The details of the layout, the slope style, the entity and value labels will change in a future PR, so no need to review the rendering. This also includes rendering bugs like dots overflowing, misaligned labels, etc.

Summary

• Switched from showing all entities by default to only plotting the selected ones
• Added support for multiple y-dimensions (behaves like line charts, i.e. multiple entities and columns can be plotted at the same time)
• Added support for specifying a missing data strategy
• Added support for relative mode
• Added support for "entity name attributions" (the explanations that sometimes appear next to a label in the line legend)
• Added tooltips
• Enabled timeline animation for slope charts
• Switched to the labelling algorithm used by line charts
• Dropped support for focusing lines (will be added back later in a different form)
• Dropped support for a categorical colour dimension (could be a nice to have but not strictly necessary if only a small subset of entities are rendered at a time)
• Migrated all existing slope charts (changes have been reviewed by Fiona)

Might be addressed later

• Faceting! (would be nice but not strictly necessary, so will look into it maybe later)

Not addressed

• Some line charts have a numerical colour dimension, but slope charts ignore the colour channel for now. It wouldn't be very useful in slope charts and we have so few line charts that use a colour channel that I don't feel it's worth the effort

Testing

I enabled slope tabs for all line charts on staging for testing.

Example charts:

• With relative mode toggled: http://staging-site-redesign-slopes-viz/grapher/gdp-per-capita-worldbank?tab=slope&stackMode=relative
• With daily data and entity annotations: http://staging-site-redesign-slopes-viz/grapher/daily-tests-per-thousand-people-smoothed-7-day?tab=slope&time=2021-04-27..2021-11-25
• With No Data section: http://staging-site-redesign-slopes-viz/grapher/ratio-of-female-to-male-labor-force-participation-rates-slopes?time=1960..latest&country=AGO~OWID_WRL
• Without any plottable entities: http://staging-site-redesign-slopes-viz/grapher/ratio-of-female-to-male-labor-force-participation-rates-slopes?country=AGO~OWID_WRL~AUT
• With missing data strategy set to "hide": http://staging-site-redesign-slopes-viz/grapher/production-vs-consumption-co2-emissions?tab=slope&country=~MKD
• With multiple y-columns: http://staging-site-redesign-slopes-viz/grapher/antibiotic-usage-by-surveillance-category-time?tab=slope&country=~CIV
• With multiple columns where some columns don't have data for the selected entity (note that they don't appear in the No Data section): http://staging-site-redesign-slopes-viz/grapher/consumption-of-inhaled-antibiotics-by-type?tab=slope&time=earliest..latest
• With faceted line chart that is a bar chart initially: http://staging-site-redesign-slopes-viz/grapher/antibiotic-usage-by-surveillance-category
• Without legend: http://staging-site-redesign-slopes-viz/grapher/number-of-countries-reporting-data-on-vaccinations

Bugs

• http://staging-site-redesign-slopes-viz/grapher/consumption-of-inhaled-antibiotics-by-type?country=~BLR
  • Reproduce by switching to the slope chart tab, then switch back
  • Not sure how to fix this
  • This is a side effect of modifying the start/end time when switching from a line to a slope chart – not sure that's worth it, we could also just remove that
  • Even if there is no bug, it's a bit weird to go from discrete bar chart, to slope chart, to line chart (example: http://staging-site-redesign-slopes-viz/grapher/consumption-of-inhaled-antibiotics-by-type)
  • Not sure what the right thing to do here is. Curious what you think!

[sophiamersmann]

• 🎉 make line/slope switching available to authors / TAS-720 #4207 : 2 dependent PRs (#4210 , #4266 )
• 🎉 (slope) support facetting / TAS-734 #4247
• ✨ (slope) redesign / TAS-722 #4222
• 🎉 (slope) add tolerance / TAS-719 #4205
• 🎉 (slope) feature parity with line charts / TAS-708 #4192 👈 (View in Graphite)
• 🔨 migrate slope chart configs #4275
• master

This stack of pull requests is managed by Graphite. Learn more about stacking.

[owidbot]

Quick links (staging server):

Site Dev	Site Preview	Admin	Wizard	Docs

Login: ssh owid@staging-site-redesign-slopes-viz

• Site-screenshots: https://github.com/owid/site-screenshots/compare/redesign-slopes-viz
• SVG tester: https://github.com/owid/owid-grapher-svgs/compare/redesign-slopes-viz

SVG tester:

Number of differences (default views): 26 (6e7e21) ❌
Number of differences (all views): 22 (a01c5e) ❌

Edited: 2024-12-11 12:42:34 UTC
Execution time: 1.34 seconds

[notion-workspace]

Make slope charts as powerful as line chats

[sophiamersmann]

Merge activity

• Dec 11, 7:47 AM EST: A user started a stack merge that includes this pull request via Graphite.
• Dec 11, 7:47 AM EST: A user merged this pull request with Graphite.