1
votes

I have a Cloud Firestore Collection (Locations) that have GeoPoint fields, and I want to query based on the current users location to find nearby places.

It appears that Cloud Firestore can't do this yet, but geofirestore seems to be the viable option. I'm trying to query the Cloud Firestore Collection (Locations) with the coordinates 34.0103, 118.4962. However, I'm getting the following error:

[2019-05-26T19:28:26.891Z] @firebase/firestore:, Firestore (6.0.4): INTERNAL UNHANDLED ERROR: , configureNetworkMonitoring

Here's what I've looked at:

  • The data Collection (Locations) is loaded to Cloud Firestore is correct
  • The Cloud Firestore GeoPoint is syntax & data is correct
  • The Geoquery is not working

Cloud Firestore Data:

{
  city: "Santa Monica",
  geopoint: [34.0103, 118.4962],
  location_id: "LA_00012",
  location_name: "Santa Monica Pier",
  state: "CA",
  street: "200 Santa Monica Pier,
  zip_code: "90401",
}

React Component (Search):

// Imports: Dependencies
import React, { Component } from 'react';
import { Button, SafeAreaView, StyleSheet, Text, View } from 'react-native';
import 'firebase/firestore';
import { GeoCollectionReference, GeoFirestore, GeoQuery, GeoQuerySnapshot } from 'geofirestore';

// Screen: Search
class Search extends Component {
  constructor (props) {
    super(props);

    this.state = {
      location: null,
      errorMessage: null,
    };
  }

  // Get Nearest Locations
  getNearestLocations = async () => {
    try {
    // Create Firestore Reference
    const collection = firebase.firestore().collection('locations');

    // Query Limit (10)
    const limitQuery = collection.limit(10);

    // Geo Query
    const query = new GeoQuery(limitQuery).near({
      center: new firebase.firestore.GeoPoint(34.0103, 118.4962),
      radius: 10,
    });

    query.get().then((value) => {
      value.docs.forEach(doc => {
        console.log(doc);
      });
    });

    }
    catch (error) {
      console.log(error);
    }
  }

  render() {
    return (
      <SafeAreaView style={styles.container}>
        <Text>Search</Text>

        <Button title="Search" onPress={this.getNearestLocations} />
      </SafeAreaView>
     );
    }
  }

  // Styles
  const styles = StyleSheet.create({
    container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

// Exports
export default Search
1
geofirestore documents need to be structured in a certain way, i'd say check this out => github.com/geofirestore/geofirestore-js/tree/… - MichaelSolati

1 Answers

-1
votes

As @MichaelSolati pointed out, your data must be structured like below:

{
  city: "Santa Monica",
  g: [34.0103, 118.4962],
  l: "wwh32rqk3e",
  location_id: "LA_00012",
  location_name: "Santa Monica Pier",
  state: "CA",
  street: "200 Santa Monica Pier,
  zip_code: "90401",
}

Your geopoint must be replaced by g and you must add a geohash children named l.

I hope it helps!