Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Migrate other graphs to React + deprecate LineGraph component #2254

Merged
merged 13 commits into from
Mar 2, 2020

Conversation

fbarl
Copy link
Contributor

@fbarl fbarl commented Feb 27, 2020

Part of #1681 (comment).

Tested

  • Graphs render well on small screens (360px) as well as desktop
    • Resizing the screen dynamically rerenders the component
    • Renders well with no data (still showing the hover vertical bar)
    • Axes render well
  • Hovering vertical bar + tooltip behave as expected
  • Tested on live data against different zones
    • Latvia (gradients working)
    • Germany (half empty graphs)
    • Israel (flat + empty graphs)

Changes

  • Deprecated LineGraph component in favor of the extended AreaGraph component
  • Made CountryHistoryCarbonGraph and CountryHistoryPricesGraph into no-prop wrappers around AreaGraph
  • Made tooltips logic in main.js a bit more explicit
  • Put a lot of shared logic in a new history.js helper file
  • New props added to AreaGraph:
    • layerStroke - the prices graph had a light gray stroke, thought we might want to keep it
    • focusFill - the prices graph has a gray fill but the hover focus circle has a shade of orange as a fill, thought we might want to keep it
    • height - as the heights of all 3 graphs are currently different

@fbarl fbarl self-assigned this Feb 27, 2020
@fbarl fbarl force-pushed the fbarl/1681-migrate-line-graph branch from 873e526 to c57d496 Compare February 27, 2020 12:28
@fbarl fbarl mentioned this pull request Feb 27, 2020
@fbarl fbarl changed the title [WIP] Migrate LineGraph to React [WIP] Migrate LineGraph component to React Feb 27, 2020
@fbarl fbarl force-pushed the fbarl/1681-migrate-line-graph branch 2 times, most recently from 7270c60 to bac79d3 Compare February 27, 2020 18:26
@fbarl fbarl changed the title [WIP] Migrate LineGraph component to React Migrate other graphs to React + deprate LineGraph component Feb 28, 2020
@fbarl fbarl changed the title Migrate other graphs to React + deprate LineGraph component Migrate other graphs to React + deprecate LineGraph component Feb 28, 2020
@fbarl fbarl marked this pull request as ready for review February 28, 2020 12:26
@fbarl fbarl requested a review from corradio February 28, 2020 12:28
@fbarl fbarl force-pushed the fbarl/1681-migrate-line-graph branch from 548ef41 to f6f7a00 Compare March 2, 2020 16:56
@fbarl fbarl force-pushed the fbarl/1681-migrate-line-graph branch from f6f7a00 to 8809170 Compare March 2, 2020 22:46
@fbarl fbarl merged commit fb5b0ea into master Mar 2, 2020
@fbarl fbarl deleted the fbarl/1681-migrate-line-graph branch March 2, 2020 23:03
con-cat pushed a commit to con-cat/electricitymap-contrib that referenced this pull request May 18, 2021
…icitymaps#2254)

* Introduced CountryHistoryCarbonGraph wrapper component around AreaGraph

* Introduced CountryHistoryPricesGraph wrapper component around AreaGraph

* Got rid of now unused LineGraph component

* Removed renderOpenTooltips

* Better centering of y-axis label

* Parametrize AreaGraph height

* Extract graph mouse action handlers into helpers/history.js

* Introduce PRICES_GRAPH_LAYER_KEY and CARBON_GRAPH_LAYER_KEY constants

* Better handling of graph background mouse events

* Graph background hover over single layer graphs shows tooltip

* Fixed hover events in mobile mode

* Add more prop explanations

* Rename focusFill -> markerFill
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants