@dmc-cambric and colleagues from Cambric in Scotland need the chart to be wider in landscape the the currently hard-coded width of 1000px
This PR reintroduces height and width optional props to the RCPCHChart component. If not supplied, the chart defaults to 1000px width, 800px height. NOTE: both height and weight must be supplied and the user must work out a sensible aspect ratio themselves. Because the SVG chart will scale to the width and height supplied, but the text (and datapoints) within it will not, the height and weight are used to calculate a scale factor for text to be applied to tooltips and axis labels and the event and legend text. This scaling does not apply to titles, buttons or plotted datapoints.
A further raised issue relates to the use of createGlobalStyles which has had the effect of applying RCPCHChart styles across the DOM. Apologies for this. This has been fixed by using a simpler styled div to wrap the <CentileChart/> and <SDSChart/> components.
Code changes
Please describe the changes you made here.
Documentation changes (done or required as a result of this PR)
The documentation in the mdx story file has been updated with the changes.
Overview
@dmc-cambric and colleagues from Cambric in Scotland need the chart to be wider in landscape the the currently hard-coded width of 1000px
This PR reintroduces height and width optional props to the
RCPCHChart
component. If not supplied, the chart defaults to 1000px width, 800px height. NOTE: both height and weight must be supplied and the user must work out a sensible aspect ratio themselves. Because the SVG chart will scale to the width and height supplied, but the text (and datapoints) within it will not, the height and weight are used to calculate a scale factor for text to be applied to tooltips and axis labels and the event and legend text. This scaling does not apply to titles, buttons or plotted datapoints.A further raised issue relates to the use of
createGlobalStyles
which has had the effect of applying RCPCHChart styles across the DOM. Apologies for this. This has been fixed by using a simpler styled div to wrap the<CentileChart/>
and<SDSChart/>
components.Code changes
Please describe the changes you made here.
Documentation changes (done or required as a result of this PR)
The documentation in the mdx story file has been updated with the changes.
Related Issues
This closes #101 and #110
Mentions
Thanks to @dmc-cambric