React Native Mapbox-gl Error Coordinaes must conatin number, I have typecasted the coordinates but its still giving same error. How can I fix it?

I am facing this error. The coordinates stored in the database of App are in String. I have typecasted the String coordinates to Number but still facing this error.

This is my Map Code

import { View, Text, StyleSheet } from "react-native";
import MapView, { Marker } from "react-native-maps";
import MapboxGL from "@react-native-mapbox-gl/maps";


MapboxGL.setConnected(true);

const Map = ({ data, locationData }) => {
  console.log(data);
  useEffect(() => {
    MapboxGL.setTelemetryEnabled(false);
  }, []);
  const [startCoordinate, setStartCoordinate] = useState([
    Number(locationData.startLong),
    Number(locationData.startLat),
  ]);
  const [endCoordinate, setEndCoordinate] = useState([
    Number(locationData.endLong),
    Number(locationData.endLat),
  ]);
  const renderMarkers = data.map((marker, index) => {
    return (
      <MapboxGL.PointAnnotation
        coordinate={[
          Number(marker.longitude),
          Number(marker.latitude),
        ]}
        // key={index}
      >
        <View
          style={{
            height: 30,
            width: 30,
            backgroundColor: "red",
            borderRadius: 50,
            borderColor: "#fff",
            borderWidth: 3,
          }}
        />
      </MapboxGL.PointAnnotation>
    );
  });
  return (
    <View style={styles.page}>
      <View style={(StyleSheet.absoluteFillObject, styles.container)}>
        <MapboxGL.MapView style={styles.map}>
          <MapboxGL.Camera zoomLevel={7} centerCoordinate={startCoordinate} />
          <MapboxGL.PointAnnotation coordinate={startCoordinate} />
          {renderMarkers}
          <MapboxGL.PointAnnotation coordinate={endCoordinate} />
        </MapboxGL.MapView>
      </View>
    </View>
  );
};

const styles = StyleSheet.create({
  page: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#F5FCFF",
    marginBottom: 50,
  },
  container: {
    height: 300,
    width: "100%",
    backgroundColor: "tomato",
 
  },
  map: {
    flex: 1,
  },
});

export default Map;

In the above code you can check that I have typecasted the String to Number but still facing the same error coordinates must contain numbers

Thanks in Advance