new(xychart): add BarSeries #808
Conversation
| horizontal?: boolean; | ||
| /** | ||
| * Specify bar padding when bar thickness does not come from a `band` scale. | ||
| * Accepted values are [0, 1], 0 = no padding, 1 = no bar, defaults to 0.1. |
There was a problem hiding this comment.
this is backwards and was updated to match d3's band scale logic: 1=no bar, 0=no padding. will fix.
| barPadding?: number; | ||
| }; | ||
|
|
||
| function BarSeries<XScale extends AxisScale, YScale extends AxisScale, Datum extends object>({ |
There was a problem hiding this comment.
most of this logic can become BaseBarSeries in the future to power animated and non-animated bars.
| @@ -1,55 +1,29 @@ | |||
| import React, { useContext, useCallback, useEffect } from 'react'; | |||
| import React, { useContext, useCallback } from 'react'; | |||
There was a problem hiding this comment.
nice. The code in LineSeries looks much cleaner with the HOC.
Pull Request Test Coverage Report for Build 30Details
💛 - Coveralls |
| const [, forceUpdate] = useState(Math.random()); | ||
| const privateRegistry = useMemo(() => new DataRegistry<XScale, YScale, Datum>(), []); | ||
|
|
||
| const registerData = useCallback( |
There was a problem hiding this comment.
as all of these 5 functions depends only on privateRegistry, perhaps a single useMemo block is enough?
or should the first two also depend on the value of forceUpdate?
There was a problem hiding this comment.
good call! initially I didn't have the force update, but you're right that now a single memo works 👌 had to wrap some of the functions for the appropriate this context to work.
This PR adds
BarSeriesto thexychartpackage and refactors / fixes other issues in the process🚀 Enhancements
adds
BarSeriescomponentadds
withRegisteredDataHOC which swapsdata/xAccessor/yAccessorprops for those in theDataRegistryin context. This makes*Seriesimplementation more straight forward because they should always use values from context so they are in sync with the context scales.re-writes
useDataRegistryDataRegistry, which did not result in the necessaryhook=>scales=>context=>componentupdates when the registry was updated.DataRegistryAPI and uses it for its implementationimproves the light/dark theme colors:
📝 Documentation
for the
/xychartdemo:lineorbarseriesrender horizontallytoggleAdds tests for all new components.
@kristw @techniq @hshoff