Firestore Geoquery

[@carrillocarlosce]

You just made my day, I've been waiting for this for a long time, I had to use a workaround in my app with firebase realtime database in order to make this feature work, now I can rewrite that code and keep working only with firestore, again thanks for making our developer life easier, keep sharing your knoledge

[@Fireship]

I had a project for a client that simply was not feasible in the RTDB, so that compelled me to package this into a library.

[@carrillocarlosce]

Thats awesome, I hope soon I can become pro member, and keep learning from you!!,

[@louisart92]

And mine!!!, I m gonna try it on ionic but should be exactly the same

[@carlosalvarez4188]

Compatible with both flat earth and round earth theories lol hahah

[@Fireship]

I'm pretty sure the math works the same for both theories :)

[@phillachmann3552]

Compatible with those who are intelligent and those who ignore proven science!

[@andrefortin9917]

Your comment made my day. Hahaha.

[@BenBodan]

I heard Flutter instead of Flat-Earth, happy for no reason.

[@developer-juice-Khailenno]

lmao

[@mateja176]

Amazing, thanks Jeff!! I've recently been working on a location based app and I've decided to go the easy route and differentiate users by city, but the app might just get a level up, thanks to this video.

[@Fireship]

I have a bunch of additional features on another branch for this lib, like a query inside bounding boxes and stuff like that. Please let me know how it goes if you use it :)

[@mateja176]

Angular Firebase Gladly :)

[@satisfakshin]

Same here!

[@carltongordon]

wow!!! you just made me replace my entire ng5 project with ths lol thanks jeff you the best

[@Fireship]

Cool! Let me know if you run into any issues on Github :)

[@RussianBritish]

Great work. Absolutely brilliant I gotta say. I almost made the simular stuff for my last project, but had to give up (not by geo queries though, but filtering) But still it's not as powerful as MongoDB. I mean with firebase it always looks like you fighting against the system limitations rather then developing. You'd probably either very dedicated person or have a nerve for it. Good job anyway. Appreciate it a lot.

[@Fireship]

Thank you. Mongo has better geospatial support but I hope we see Firestore improve in this area in the future.

[@ShufflePetro]

00:08 Building real-time geolocation features using Firestore and Angular Google Maps. 01:07 Geo queries in Firestore are different from normal queries 02:10 Utilizing geohashes for precise geo queries 03:08 Initialize Firebase app and Angular Google Maps in Angular or Ionic. 04:08 Geoqueries allow multiple geo points on a single document. 05:14 Firestore Geoquery enables querying against multiple geo points within a single document. 06:20 Using switch map allows for reactive changes in radius and queries. 07:27 Firestore Geoquery allows real-time updates based on user position.

[@boogiedowngames6893]

Cool!! Was busting my head trying to figure this out. Thanks for the solution. We are pro members as well.

[@Fireship]

Nice! Message me on slack if you need support with it :)

[@ChrisEsplin]

Rad! I hadn't heard of geohashes before. I've never had a use case for them... so I don't feel too bad about it. But now I need to find a good reason to spend a few days building some maps :)

[@Fireship]

I went down a rabbit hole with geohashes recently. You can also use them to build AR features, like Pokemon GO.

[@EwaldDieser]

Fantastic! Exactly what I need to implement right now.

[@yogenp]

Amazing contribution again, Jeff.

[@SolomonKahsai]

well well well, you are simply perfect !!!!

[@storylineteam]

Amazing! Can you please do the same video for flutter?

[@will_abule]

😱Oh! Awesome! I've been waiting for this for a long time. Can I do things like layout, routing, symbology plus you got my star 🌟 all ready thanks. I'll have to go through the your docs to see how far I can actually use this. I ❤️ you and your content.

[@Fireship]

Awesome :) Let me know if there's a feature you want to see, my goal is to make realtime maps as easy as possible.

[@tonyrusignuolo]

@@Fireship data pagination and limits would be great! I'm thinking about working on a fork, so recommendations would be appreciated. Thanks!

[@AbhishekKumar-mq1tt]

Thank you for this awesome video

[@pandarzzz]

Thank you for sharing this informative video! 🐰🖐🏻

[@sanjyotsatvi6954]

i am getting this error - Property 'collection' does not exist on type 'GeoFireClient'

[@requenapolonio]

me too

[@pdela72]

Awesome tutorial Jeff. I have a question, although not totally related to Geo problems: I see you have to initialize AGM with Google Maps API key. What about security? Hard coding the API key directly in the spa makes it visible to whoever wants to look for it. Is there another pattern I can use? Eventually storing the API key in Firestore itself (despite rules shouldn't prevent any user to read the data, thus same problem). Storing in firebase functions config and return on Https trigger? What else to ensure security of the API key? Many thanks!

[@amacodes7347]

storing it in an environment variable would be better.

[@pdela72]

@@amacodes7347 I don't understand what environment variable in a client spa app? Like angular app?

[@humaneBicycle]

iTs CoMpaTibLe wiTh fLat eARTh tHeORiEs.

[@pierojoss]

Awesome!

[@Fireship]

Thank you Pedro :)

[@1amb635]

Amazing! Thank you!

[@j4nch]

How to link the radius with the zoom? I want to display everything that is currently visible in the map? The goal being that the user isn't aware that I don't show everything? Also, how would you do to not only react on a radius change but also on Latitude/Longitude change? Since you can pipe only on one of the 3 elements?

[@hartneil93]

This video is AMEZING!, thank you soo much!! Is there a way to do pagination with that?

[@alexanderchele8978]

Hello, could you do with the example of if it leaves the geofence, present an alert with angle and firebase

[@stevengao8345]

Thanks for this great info amd tutorial, Sorry, a noob question, is this geoquery api can be used in ios or android app as long as it is using firebase as backend ? Thanks

[@tonnie7079]

trying to get around this in Android n m stuck ... any leads?

[@satisfakshin]

Thank you for this! 😭

[@ChranMurugapandi]

Great Tutorial, by the way, what program did you use for video editing? The intro was too sick I had to watch it twice lol

[@Fireship]

Thanks! I use adobe aftereffects with the help of some pre-built animation elements

[@vishnuvardhan9300]

Awesomeness

[@urmilshroff]

Hey there! I'm trying to implement something exactly like this in my Flutter app, where I want to create a kind of density hotspot/heatmap wherever there are multiple users in a certain area. Do you have any solutions? Google Maps Flutter package currently does not support displaying heatmaps, so I'm kind of stuck.

[@kawaiifreak97]

thank you so much for this! is there a way to query nested collections? thank you!

[@johnrivelt]

Thank you for this video, you have excellent presentation skill. Does it filter points from client side or server side ? As I need to deal with thousands points on mobile device, I am wondering performance.

[@Fireship]

It actually does a little of both. It calculates the minimum geohash squares guaranteed to cover the radius and filters those server side. This can return extra results that are then filtered client-side, but that depends on the size of the radius and distribution of points.

[@info-namec768]

Aye sir! thanks for this awesome material

[@Fireship]

Thank you, it's a fun area

[@7lnbo7a]

nice video,, As a pro member I adore your tutorials,,for Geo Search I wanted to user Algolia Geo Search,, what do you think about that??? since I am heavily using algolia with my firebase web app.. do u recommend your library over Algolia GEO Search?? Regards

[@Fireship]

Algolia geo search is excellent. If you already have your data indexed there I would definitely consider that the best option.

[@7lnbo7a]

@@Fireship Great,, thanks for feedback

[@iansong1676]

Will I also be able to use the GeoFireX library with native IOS(Swift) and android(Kotlin) apps?

[@DheerajRijhwani]

Sir, How I can load external Html on a single component. I want to build a blog by using MEAN. Please suggest. Happy Coding:)

[@info-namec768]

typescript compile the code, you may load html, but add functionalities into it would not be easy stackoverflow.com/questions/46659860/angular4-load-external-html-page-in-a-div

[@vitikahappy]

Who can help me with geoquering nearby documents in Firebase Firestore in Android Studio (Java)? I've been searching this topic and the results I get are only either it is impossible or there is some solution but no clear example in Android Studio or Java. I know I am a newbie, that's why I am asking for help. Can someone please reply?

[@ekhmoi4552]

Nice video. But it is not that hard to build from scratch thanks to MongoDB's Geospatial Query Operators.

[@Fireship]

I've worked with Mongo's GeoSpatial stuff in the past and this was loosely inspired by it. Firestore has hinted at native geolocation support, so hoping that lands as a feature in the future.

[@runfunmc64]

Anyone know if there is a way to unsubscribe from a real time data stream?

[@Rose-jp7dm]

Is it possible to get a code of this example please!?

[@jasonc6241992]

does not work with firebase 8+

[@MarcPujolGualdo]

It is possible to use it in NodeJS? (Cloud Function) Error: Argument "onNext" is not a valid function.

[@david-tracy]

Marc Pujol Gualdo hey Marc, any update bro?

[@fitzmode]

There's also a port of Geofire for Firestore called Geofirestore. github.com/MichaelSolati/geofirestore

[@Fireship]

That is a very well done port of Geofire and could be a good choice depending on your needs. In our case, we had big collections that needed to be limited by a query first and also needed multiple geopoints on a document, as well as some other specialized internal stuff.

[@chungtommy5128]

is it possibe to implement this to Laravel?

[@abbaskagdi1]

2:39 lol

[@sandeeppatil5925]

Is there one for React Native ?

[@manofleisure5099]

U could make a multi million dollar app with this one tutorial Haha 😂

[@TheGenZProgrammer]

who else thought he or she saw donald glover

[@gunaavanthigai924]

Sir,

[@ibrahimmohammed3484]

this is not ideal at all for any GIS web development or apps that just has any spatial data

[@Fireship]

It's not a fully featured geospatial db, but does provide a basic pathway for features like this. What is ideal for GIS web development?

[@ibrahimmohammed3484]

i understand but even that basic is too complicated using firebase, all that just to query data that falls within a certain buffer distance, the ideal player for such operations here is Postgresql with Postgis extension. i think mongodb have nearly competitive spatial operations now but can't really judge since i haven't used it yet and also it depends really on what purpose your mapping needs, you can use file database like sqlite if your data don't change a lot, but as i said the big player for me here is postgis

[@Fireship]

Thanks for the info. I have used Mongo and it is superior in this area, but Firebase has hinted at native support for Firestore geo in future. Postgis seems like the gold standard for most, but I imagine it's harder to get setup with realtime listeners.

[@garethdavies2308]

Nobody uses Angular how to do this in React Hooks?