Ionic 2 and GeoFire and Typescript


Hello Ionics,
i tryed now for days to implement Geofire in my learning app. But as beginner in Ionic and Typescript i failed.
There are no typings for it aviable and i am not able to convert the examples from GeoFire Javascript examples to run in my Typescript project.

var firebaseRef = firebase.database().ref().push();
this.geoFire = new GeoFire(firebaseRef);

This is the last code that not provide any error. But when i try to set values the troubles beginn.

Does anybody have a simple example (or code snippet) or knows a link to a Typescript Geofire example? My scenario is to set the long/lat keys and make a search in a radius(distance).

Sorry for my bad english and thank you in advance



Here is an interesting read


We just had this same issue… for now to get it going, just include the geofire file in your index html

<script src=""></script>

and in the component file declare it

 declare var GeoFire: any

 var firebaseRef = firebase.database().ref().push();

 // Create a new GeoFire instance at the random Firebase location
 var geoFire = new GeoFire(firebaseRef);


Hi Aaron,
thank you so much. The script in the index.html was the solution :slight_smile:, the other parts i already had.
Thank you that you are such an active forum member.

Best Regards from Austria


no problem, I know there is a better solution, when we figure it out i will post it here.


Is it already possible to use the library with a npm install?


Check out my answer I just posted at


@awynham Thank you so much! Your solution works.
(Ionic 2 RC4)


Glad to help. Please upvote answer on SO to make it easier for others to find.


I’m using ionic2 Rc4 and I declare the variable with this line
declare var GeoFire: any;
(right before the @Component declaration)

And right after the constructor I define this function:
this.latUser = 46.310774;
this.lngUser = 2.423515;
this.radius = 2000;
var geoFire = new GeoFire(this.geoPlacesUrl);
var geoQuery = geoFire.query({
center: [this.latUser, this.lngUser],
radius: this.radius//kilometers
var keysEntered = false;
geoQuery.on(“key_entered”, (key, location, distance) => {
keysEntered = true;

But it does not find thevariable and I get this :
Can’t find variable GeoFire

I call the geofire script in the index.html from the cdn.

What is wrong ?