How to use Y-Axis values for Recharts linear gradient

    const targetPercent =
      highestValue.percentage - (100 - this.props.subjectData.targetGrade * 10);
    // highestValue.percentage is the percentage value of the highest data point and subjectData.targetGrade returns a value from 1-8 (Irish grading system). 1 = 90%, 4 = 60%, etc.
...

<linearGradient id="colorUv" x1="0" y1="0" x2="0" y2="1">
            <stop offset="0%" stopColor="#FFF" stopOpacity={0.2} />
            <stop
              offset={`${targetPercent}%`}
              stopColor="#399be3"
              stopOpacity={0.2}
            />
            <stop
              offset={`${targetPercent}%`}
              stopColor="red"
              stopOpacity={0.15}
            />
            <stop
              offset={`${targetPercent + 40}%`}
              stopColor="#FFF"
              stopOpacity={0.2}
            />
</linearGradient>