diff --git a/package.json b/package.json index bfaaf4f..f67ae44 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@gns-science/toshi-nest", - "version": "3.9.4", + "version": "3.9.5", "description": "The toshi-nest is for fledgling work e.g. reusable Node components to share across TUI and other projects", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", diff --git a/src/MfdPlot/MfdPlot.tsx b/src/MfdPlot/MfdPlot.tsx index 89811b2..95ef399 100644 --- a/src/MfdPlot/MfdPlot.tsx +++ b/src/MfdPlot/MfdPlot.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Axis, AnimatedLineSeries, Tooltip, XYChart } from '@visx/xychart'; +import { Axis, AnimatedLineSeries, AnimatedBarSeries, Tooltip, XYChart } from '@visx/xychart'; import { FormControlLabel, Menu, Radio, RadioGroup, MenuItem, IconButton, Typography } from '@mui/material'; import { LegendOrdinal } from '@visx/legend'; import { scaleOrdinal } from '@visx/scale'; @@ -8,9 +8,24 @@ import { Group } from '@visx/group'; import SettingsIcon from '@mui/icons-material/Settings'; import { MfdPlotProps, Datum } from './MfdPlot.types'; -export const MfdPlot = ({ data, width, height, xLabel, yLabel, labelProps, xLabelOffset, yLabelOffset, header, lineColours, xScaleDomain, yScaleDomain, legendDomain }: MfdPlotProps) => { +export const MfdPlot = ({ + data, + width, + height, + xLabel, + yLabel, + labelProps, + xLabelOffset, + yLabelOffset, + header, + lineColours, + xScaleDomain, + yScaleDomain, + legendDomain, + defaultLinesVisible, +}: MfdPlotProps) => { const [anchorEl, setAnchorEl] = useState(null); - const [linesToDisplay, setLinesToDisplay] = useState('Incremental'); + const [linesToDisplay, setLinesToDisplay] = useState(defaultLinesVisible || 'Both'); const handleRadioChange = (event: React.ChangeEvent, value: string) => { setLinesToDisplay(value); }; @@ -74,7 +89,9 @@ export const MfdPlot = ({ data, width, height, xLabel, yLabel, labelProps, xLabe - {['Incremental', 'Both'].includes(linesToDisplay) && d?.bin_center} yAccessor={(d) => d?.rate} stroke={lineColours[0]} />} + {['Incremental', 'Both'].includes(linesToDisplay) && ( + d?.bin_center} yAccessor={(d) => d?.rate} colorAccessor={() => lineColours[0]} /> + )} {['Cumulative', 'Both'].includes(linesToDisplay) && ( d?.bin_center} yAccessor={(d) => d?.cumulative_rate} stroke={lineColours[1]} /> )} diff --git a/src/MfdPlot/MfdPlot.types.ts b/src/MfdPlot/MfdPlot.types.ts index eebb3ee..4dfab94 100644 --- a/src/MfdPlot/MfdPlot.types.ts +++ b/src/MfdPlot/MfdPlot.types.ts @@ -23,4 +23,5 @@ export interface MfdPlotProps { fill?: string; }; header?: string; + defaultLinesVisible?: string; }