Tooltips in React to show in single box on hover

Question

I'm having a Chart Bullet component which has tooltips on hover. The problem is i had to point to the exact line to see the tooltip. Hence i want both the tooltips to show in a single box when hovered. When i disable the prop "allowtooltip" which is showing the data like this without the tooltip.

This is the Bulletchart Component - https://www.patternfly.org/2020.11/documentation/react/charts/chartbullet

I'm expecting something like this. To show the average and max in one box.

<ChartBullet
 ariaDesc={pDescr}
 ariaTitle={pDescr}
 bulletSize={135}
 axisComponent={<ChartAxis  tickValues={[-1]} />}
 comparativeWarningMeasureData={[{ name: 'Max', y: this.data }]}
     
 labels={({ datum }) =>  datum.name ? `${datum.name}: ${datum.y}` : `${datum.y}`}
 maxDomain={{ y: 100 }}
 primarySegmentedMeasureData={[{ name: 'Average', y: this.dataAvg }]}
 width={width}
 height={37}
 title={pDescr}
 titlePosition={"left"}
 qualitativeRangeData={[{ y: 100 }]}
 allowTooltip={false}
 responsive={true}
 padding={{top:0, bottom:100, right:0, left: paddingLeft}}
/>