Closed gmencz closed 1 year ago
this is how i did mine
export const AxisLabel = ({ value, index, arrayLength }): JSX.Element => {
const textColor = useColorScheme() === "dark" ? "#fff" : "#000"
const location =
(index / arrayLength) * (Dimensions.get("window").width - 40) || 0
return (
value && (
<View style={{ transform: [{ translateX: Math.max(location - 40, 5) }] }}>
<Text color={textColor}>{`$${value.toFixed(6)}`}</Text>
</View>
)
)
}
in this functional component, you need to provide:
value
- the point's valuearrayLength
- the array's lengthindex
- the array index of the point
The README says you can use TopAxisLabel / BottomAxisLabel to show labels of min and max but how would we figure out the x position of the min and max and then position it next to the graph's highest/lowest?