-
Notifications
You must be signed in to change notification settings - Fork 525
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
VictoryChart: adds an option for adding background for chart area #1558
Merged
Merged
Changes from all commits
Commits
Show all changes
20 commits
Select commit
Hold shift + click to select a range
4a339c8
Added new Background primitive, set up methods in VictoryChart to ren…
maddles 26554d9
Rendering background as first child in charts if background property …
maddles f41363a
Make sure background property remains on style prop for VictoryChart …
maddles 6c6253a
Get the chart background rendering in correct range, fix bug with zer…
maddles 5fdf2cf
Adds additional stories to show the background property on the style …
wsparsons 1856706
React proptypes for Chart Background, Polar chart background
maddles 0493017
Make sure getHeight and getRangeBounds return the right values in bac…
maddles e0e0f1f
Remove an unused import in Background, alphebetise props
maddles fc8cf42
Adds additional stories to show background style on circle and rect c…
wsparsons 0142050
Removes uninvoked functions
wsparsons ce270ae
Adds background property to the style prop for VictoryChartProps inte…
wsparsons 8ddb47c
Add separate props for VictoryChart background
maddles 95cd939
Refactors backgroundProps to take into account the x and y coordinate…
wsparsons f0c280e
Adds a few more UI tests for chart background (stack, group, and hori…
maddles 1e824ec
Undefined check for style in victory-chart
maddles bdd6128
Remove background styles from props passed to other children of chart…
maddles a28aa7d
Remove disused cx and cy props from Background, ensure that backgroun…
maddles 226d9a2
Adds a few more demos to victory charts
wsparsons 6e0f1b3
defaults object for background props in chart helper methods, export …
maddles ee88dbd
Remove disused import from chart js demo
maddles File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,31 +1,32 @@ | ||
import * as React from "react"; | ||
import { | ||
CategoryPropType, | ||
EventPropTypeInterface, | ||
DomainPropType, | ||
EventPropTypeInterface, | ||
StringOrNumberOrCallback, | ||
VictoryCommonProps, | ||
VictoryStyleInterface | ||
VictoryStyleInterface, | ||
VictoryStyleObject | ||
} from "victory-core"; | ||
|
||
export type AxesType = { | ||
independent?: React.ReactElement; | ||
dependent?: React.ReactElement; | ||
independent?: React.ReactElement; | ||
}; | ||
|
||
export interface VictoryChartProps extends VictoryCommonProps { | ||
defaultAxes?: AxesType; | ||
defaultPolarAxes?: AxesType; | ||
categories?: CategoryPropType; | ||
children?: React.ReactNode | React.ReactNode[]; | ||
defaultAxes?: AxesType; | ||
defaultPolarAxes?: AxesType; | ||
domain?: DomainPropType; | ||
endAngle?: number; | ||
events?: EventPropTypeInterface<string, string[] | number[] | string | number>[]; | ||
eventKey?: StringOrNumberOrCallback; | ||
events?: EventPropTypeInterface<string, string[] | number[] | string | number>[]; | ||
innerRadius?: number; | ||
prependDefaultAxes?: boolean; | ||
startAngle?: number; | ||
style?: Pick<VictoryStyleInterface, "parent">; | ||
style?: Pick<VictoryStyleInterface, "parent"> & { background?: VictoryStyleObject }; | ||
} | ||
|
||
export class VictoryChart extends React.Component<VictoryChartProps, any> {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -7,6 +7,7 @@ export { default as VictoryTheme } from "./victory-theme/victory-theme"; | |
export { default as VictoryPortal } from "./victory-portal/victory-portal"; | ||
export { default as Portal } from "./victory-portal/portal"; | ||
export { default as Arc } from "./victory-primitives/arc"; | ||
export { default as Background } from "./victory-primitives/background"; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The main |
||
export { default as Border, default as Box } from "./victory-primitives/border"; | ||
export { default as ClipPath } from "./victory-primitives/clip-path"; | ||
export { default as LineSegment } from "./victory-primitives/line-segment"; | ||
|
47 changes: 47 additions & 0 deletions
47
packages/victory-core/src/victory-primitives/background.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,47 @@ | ||
import React from "react"; | ||
import PropTypes from "prop-types"; | ||
import CommonProps from "../victory-util/common-props"; | ||
import Rect from "./rect"; | ||
import Circle from "./circle"; | ||
|
||
const Background = (props) => { | ||
return props.polar | ||
? React.cloneElement(props.circleComponent, { | ||
...props.events, | ||
style: props.style, | ||
role: props.role, | ||
shapeRendering: props.shapeRendering, | ||
cx: props.x, | ||
cy: props.y, | ||
r: props.height | ||
}) | ||
: React.cloneElement(props.rectComponent, { | ||
...props.events, | ||
style: props.style, | ||
role: props.role, | ||
shapeRendering: props.shapeRendering, | ||
x: props.x, | ||
y: props.y, | ||
width: props.width, | ||
height: props.height | ||
}); | ||
}; | ||
|
||
Background.propTypes = { | ||
...CommonProps.primitiveProps, | ||
circleComponent: PropTypes.element, | ||
height: PropTypes.number, | ||
rectComponent: PropTypes.element, | ||
width: PropTypes.number, | ||
x: PropTypes.number, | ||
wsparsons marked this conversation as resolved.
Show resolved
Hide resolved
|
||
y: PropTypes.number | ||
}; | ||
|
||
Background.defaultProps = { | ||
circleComponent: <Circle />, | ||
rectComponent: <Rect />, | ||
role: "presentation", | ||
shapeRendering: "auto" | ||
}; | ||
|
||
export default Background; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Please add
scale
to the list of backgroundProps.