diff --git a/web/src/Components/Bridging/BridgeContainer.tsx b/web/src/Components/Bridging/BridgeContainer.tsx
index ea27080..1558c6a 100644
--- a/web/src/Components/Bridging/BridgeContainer.tsx
+++ b/web/src/Components/Bridging/BridgeContainer.tsx
@@ -75,8 +75,7 @@ export default ({ bridges, mode, setMode, bridgeValue, setValue }) => {
}
return (
- //
-
+
{
bridgeValueVariant={bridgeValueVariant}
bridgeValueHelperText={bridgeValueHelperText}
/>
-
)
diff --git a/web/src/Components/Bridging/BridgeGraph.tsx b/web/src/Components/Bridging/BridgeGraph.tsx
index 29ad405..86cfac0 100644
--- a/web/src/Components/Bridging/BridgeGraph.tsx
+++ b/web/src/Components/Bridging/BridgeGraph.tsx
@@ -1,14 +1,13 @@
import React, { useContext, useEffect, useState } from 'react'
-import { Area, AreaChart, CartesianGrid, Legend, Tooltip, XAxis, YAxis } from 'recharts'
-import { ParticleSizeContext } from "../../Context"
+import { Area, AreaChart, CartesianGrid, Legend, ResponsiveContainer, Tooltip, XAxis, YAxis } from 'recharts'
+import { ParticleSizeContext } from '../../Context'
import { findGraphData } from '../../Utils'
import { graphColors } from './styles'
-
export function BridgeGraph({ bridges, sizeFractions }) {
const [graphData, setGraphData] = useState([])
- const [particleFromPercentage, setParticleFromPercentage] = useState("")
- const [particleToPercentage, setParticleToPercentage] = useState("")
+ const [particleFromPercentage, setParticleFromPercentage] = useState('')
+ const [particleToPercentage, setParticleToPercentage] = useState('')
const particleRange = useContext(ParticleSizeContext)
useEffect(() => {
@@ -22,7 +21,7 @@ export function BridgeGraph({ bridges, sizeFractions }) {
function particleSizeOffsetPercentage(offsetSize) {
const index = sizeFractions.findIndex(size => size > offsetSize)
- if (index === -1) return ""
+ if (index === -1) return ''
const percentage = Math.round(index / sizeFractions.length) * 100
return `${percentage}%`
}
@@ -33,37 +32,37 @@ export function BridgeGraph({ bridges, sizeFractions }) {
}, [bridges, sizeFractions])
return (
-
-
+
+
{/* Defines a gradient applied to the areaPlot to highlight selected particle size range*/}
-
-
-
-
-
+
+
+
+
+
-
+
-
+
- {/*