diff --git a/src/charts/ObservedRateDensity.jsx b/src/charts/ObservedRateDensity.jsx index ba30b15..8bd41f8 100644 --- a/src/charts/ObservedRateDensity.jsx +++ b/src/charts/ObservedRateDensity.jsx @@ -75,6 +75,11 @@ export default function ObservedRateDensity({ quadData }) { {modelResults.map((r, i) => { const rowY = margin.top + i * (height / modelResults.length + 8) const barHeight = height / modelResults.length - 6 + // Pre-compute coordinates outside JSX to avoid embedding statements in render output + const obsWidth = (r.observedRate / maxRate) * (width - margin.left - margin.right) + const lowerX = margin.left + (r.modeledLower / maxRate) * (width - margin.left - margin.right) + const upperWidth = ((r.modeledUpper - r.modeledLower) / maxRate) * (width - margin.left - margin.right) + const medX = margin.left + (r.modeledRateMedian / maxRate) * (width - margin.left - margin.right) return ( @@ -82,16 +87,12 @@ export default function ObservedRateDensity({ quadData }) { {/* Observed rate bar (solid) */} - const obsWidth = (r.observedRate / maxRate) * (width - margin.left - margin.right) {/* Model interval (dashed outline showing 95% range) */} - const lowerX = margin.left + (r.modeledLower / maxRate) * (width - margin.left - margin.right) - const upperWidth = ((r.modeledUpper - r.modeledLower) / maxRate) * (width - margin.left - margin.right) {/* Model median marker */} - const medX = margin.left + (r.modeledRateMedian / maxRate) * (width - margin.left - margin.right) {/* Observed rate label */}