0

I'm doing React Native App uses Maps, And work with Real-time DB Firebase to get all data contained latitude, longitude, etc.

I get current location [latitude and longitude] calculate the distance between the current location and the nearest I get in with TurfJs

My issue is I need to display all Users from DB which are nearest to my current location. but the function just gets the first one nearest! How To Handle this?

Node Node

Function

handleNearby = () => {
const { region, providers } = this.state;
  let points = providers.map(p =>
    turf.point([p.coordinates.latitude, p.coordinates.longitude])
  );
  let collection = turf.featureCollection(points);
  let currentPoint = turf.point([region.longitude, region.latitude]);
  let nearest = turf.nearestPoint(currentPoint, collection);
  let addToMap = [currentPoint, points, nearest];
  console.log(nearest);
  console.log(Math.floor(nearest.properties.distanceToPoint)); // let's say 50Km
};

<MapView
  style={[styles.map, { width: this.state.width }]}
  style={StyleSheet.absoluteFill}
  // onMapReady={() => console.log(this.state.region)}
  showsUserLocation={true}
  region={region}
  loadingEnabled={true}
  // style={StyleSheet.absoluteFill}
  textStyle={{ color: "#bc8b00" }}
  containerStyle={{ backgroundColor: "white", borderColor: "#BC8B00" }}
>
  <Marker
    coordinate={region}
    title="Hello"
    description="description"
    pinColor="navy"
    // onPress={() => alert("Provider Profile")}
    // icon={require('../assets/camera-icon.png')}
    onCalloutPress={() => alert("Provider Profile")}
  />
  //
  {this.state.providers.map((marker, index) => (
    <Marker
      key={index}
      coordinate={marker.coordinates}
      title={marker.username}
    />
  ))}
  // Nearest Point Marker Should Be Here
</MapView>;
user9088454
  • 1,076
  • 1
  • 15
  • 45
DevAS
  • 807
  • 2
  • 15
  • 41
  • `nearestPoint` here behaves as intended. What I would do to resolve your issue would be to : 1) go throught your points collection and calculate the distance between `currentPoint` and each point of your collection and append this `distance` information to each point 2) filter and keep every point in the array that has a `distance` property < 50 km This way you'll have a list of points within a certain radius. – Gaël S Apr 29 '19 at 15:02
  • hmmm, I think this will reduce application performance! – DevAS Apr 29 '19 at 15:20
  • In any case, on the frontend side, either Turf or you do this kind of heavy computing but it has to be done. One good alternative could be to move this logic on your backend and create a geospatial request directly in your DB query. This way, you'll get only points that you indeed want to display. – Gaël S Apr 29 '19 at 15:22
  • You mean used Cloud Function Firebase right? – DevAS Apr 29 '19 at 15:32
  • And if you check this Q, you will save my head :3,https://stackoverflow.com/questions/55890775/cant-update-state-after-reloading-the-app-in-react-native-firebase?noredirect=1#comment98466859_55890775 – DevAS Apr 29 '19 at 15:37
  • I was thinking about something like this: https://stackoverflow.com/questions/46607760/how-to-query-closest-geopoints-in-a-collection-in-firebase-cloud-firestore – Gaël S Apr 29 '19 at 15:44
  • @GaëlS Great, I will Check It, Are you checked my another Question? – DevAS Apr 29 '19 at 15:58
  • you mean you have the same issue : `Can't update state after reloading the app in react native firebase?` ? – Gaël S Apr 29 '19 at 15:59
  • Indeed, https://stackoverflow.com/questions/55890775/cant-update-state-after-reloading-the-app-in-react-native-firebase?noredirect=1#comment98466859_55890775 – DevAS Apr 29 '19 at 16:01
  • Sorry but just played with turf, never tried `react native firebase` :/ – Gaël S Apr 29 '19 at 16:04
  • I Think it's React problem :/ – DevAS Apr 29 '19 at 16:06
  • you should post another issue with some code to show. Hard to help from here :) – Gaël S Apr 29 '19 at 16:07
  • @GaëlS hey, can you check here , it's turf problem, https://stackoverflow.com/questions/55974083/attempting-to-a-configurable-attribute-of-a-configurable-property-issue-in-turfj – DevAS May 04 '19 at 09:01

0 Answers0