Skip to content

Commit

Permalink
Support "bumpX" and "bumpY" curve types (#3617)
Browse files Browse the repository at this point in the history
<!--- Provide a general summary of your changes in the Title above -->

## Description

<!--- Describe your changes in detail -->
This PR adds support for using the curve types `bump`, `bumpX` and
`bumpY`. These values have been added to the `CurveType` type and map to
the `curveBumpX` and `curveBumpY` curve factories. Just like `monotone`,
omitting the `X` or `Y` will apply a relevant axis depending on the
`layout`

## Related Issue

<!--- This project only accepts pull requests related to open issues -->
<!--- If suggesting a new feature or change, please discuss it in an
issue first -->
<!--- If fixing a bug, there should be an issue describing it with steps
to reproduce -->
<!--- Please link to the issue here: -->
Fixes #3616

## Motivation and Context

<!--- Why is this change required? What problem does it solve? -->
See related issue. The existing supported curves overlap when used in a
stacked area chart.

## How Has This Been Tested?

<!--- Please describe in detail how you tested your changes. -->
<!--- Include details of your testing environment, and the tests you ran
to -->
<!--- see how your change affects other areas of the code, etc. -->
I have verified this change for stacked area charts, checked all tests
pass and checked if I needed to write a new test for this curve type. I
found no tests for existing curve types, so did not add any for this
type.

## Screenshots (if appropriate):

![Screenshot 2023-06-08 at 11 11
33](https://github.com/recharts/recharts/assets/19165624/5d3f257b-6600-41c7-8dc3-837f1fa7d6af)


## Types of changes

<!--- What types of changes does your code introduce? Put an `x` in all
the boxes that apply: -->

- [ ] Bug fix (non-breaking change which fixes an issue)
- [x] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to change)

## Checklist:

<!--- Go over all the following points, and put an `x` in all the boxes
that apply. -->
<!--- If you're unsure about any of these, don't hesitate to ask. We're
here to help! -->

- [x] My code follows the code style of this project.
- [x] My change requires a change to the documentation.
- [x] I have updated the documentation accordingly.
- [ ] I have added tests to cover my changes.
- [x] All new and existing tests passed.
  • Loading branch information
jacknevitt committed Jun 9, 2023
1 parent 00e9344 commit 36b75d4
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 1 deletion.
9 changes: 8 additions & 1 deletion src/shape/Curve.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ import {
curveBasisClosed,
curveBasisOpen,
curveBasis,
curveBumpX,
curveBumpY,
curveLinearClosed,
curveLinear,
curveMonotoneX,
Expand All @@ -32,6 +34,8 @@ const CURVE_FACTORIES: CurveFactories = {
curveBasisClosed,
curveBasisOpen,
curveBasis,
curveBumpX,
curveBumpY,
curveLinearClosed,
curveLinear,
curveMonotoneX,
Expand All @@ -46,6 +50,9 @@ export type CurveType =
| 'basis'
| 'basisClosed'
| 'basisOpen'
| 'bumpX'
| 'bumpY'
| 'bump'
| 'linear'
| 'linearClosed'
| 'natural'
Expand Down Expand Up @@ -73,7 +80,7 @@ const getCurveFactory = (type: CurveType, layout: LayoutType) => {

const name = `curve${_.upperFirst(type)}`;

if (name === 'curveMonotone' && layout) {
if ((name === 'curveMonotone' || name === 'curveBump') && layout) {
return CURVE_FACTORIES[`${name}${layout === 'vertical' ? 'Y' : 'X'}`];
}
return CURVE_FACTORIES[name] || curveLinear;
Expand Down
3 changes: 3 additions & 0 deletions storybook/stories/API/props/Styles.ts
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,9 @@ export const LineStyle: Args = {
'basis',
'basisClosed',
'basisOpen',
'bumpX',
'bumpY',
'bump',
'linear',
'linearClosed',
'natural',
Expand Down

0 comments on commit 36b75d4

Please sign in to comment.