npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

geolocator

v2.1.5

Published

A utility for getting geo-location information via HTML5 and IP look-ups, geocoding, address look-ups, distance and durations, timezone information and more...

Downloads

8,470

Readme

Geolocator.js is a utility for getting geo-location information, geocoding, address look-ups, distance & durations, timezone information and more...

Features

  • HTML5 geolocation (by user permission) with improved accuracy.
  • Location by IP
  • Reverse Geocoding (address lookup)
  • Full address information (street, town, neighborhood, region, country, country code, postal code, etc...)
  • Fallback mechanism (from HTML5-geolocation to Geo-IP lookup)
  • Watch geographic position
  • Locate by mobile information
  • Get timezone information
  • Get distance matrix and duration information
  • Calculate distance between two geographic points
  • Various geographic conversion utilities
  • Get client IP
  • Fetched location includes country flag image (SVG) URL
  • Language support (depends on the service provider)
  • Supports Google Loader (loads Google APIs dynamically)
  • Dynamically create Google Maps, on demand (with marker, info window, auto-adjusted zoom)
  • Get static Google Map (image) URL for a location
  • Non-blocking script loading (external sources are loaded on the fly without interrupting page load)
  • No library/framework dependencies (such as jQuery, etc...)
  • Universal module (CommonJS/AMD..)
  • Small file size (9KB minified, gzipped)
  • Browser Support: IE 9+, Chrome, Safari, Firefox, Opera...

See a Live Demo.

Get Geolocator.js

  • Link or download via CDNJS.
  • Download full source code from GitHub releases.
  • Install via Bower: bower install geolocator
  • Install via NPM: npm install geolocator

Usage:

Example below, will attempt to get user's geo-location via HTML5 Geolocation and if user rejects, it will fallback to IP based geo-location.

Inside the <head> of your HTML:

<script type="text/javascript" src="geolocator.min.js"></script>
<script type="text/javascript">

    geolocator.config({
        language: "en",
        google: {
            version: "3",
            key: "YOUR-GOOGLE-API-KEY"
        }
    });

    window.onload = function () {
        var options = {
            enableHighAccuracy: true,
            timeout: 5000,
            maximumWait: 10000,     // max wait time for desired accuracy
            maximumAge: 0,          // disable cache
            desiredAccuracy: 30,    // meters
            fallbackToIP: true,     // fallback to IP if Geolocation fails or rejected
            addressLookup: true,    // requires Google API key if true
            timezone: true,         // requires Google API key if true
            map: "map-canvas",      // interactive map element id (or options object)
            staticMap: true         // get a static map image URL (boolean or options object)
        };
        geolocator.locate(options, function (err, location) {
            if (err) return console.log(err);
            console.log(location);
        });
    };

</script>

If you've enabled map option; include the following, inside the <body> of your HTML:

<div id="map-canvas" style="width:600px;height:400px"></div>

Read API documentation for lots of other features and examples.

Important Notes

  • Since Geolocation API is an HTML5 feature, make sure your doctype is HTML5 (e.g. <!DOCTYPE html>).
  • Make sure you're calling Geolocation APIs (such as geolocator.locate() and geolocator.watch()) from a secure origin (i.e. an HTTPS page). In Chrome 50+, Geolocation API is removed from unsecured origins. Other browsers are expected to follow.
  • Although some calls might work without a key, it is generally required by most Google APIs (such as Time Zone API). To get a free (or premium) key, click here. After getting a key, you can enable multiple APIs for it. Make sure you enable all the APIs supported by Geolocator. (If you don't have a key, you can still use Geolocator like the previous versions, but with limited features.)
  • Geolocator now uses a single Geo-IP provider (GeoJS for locating by IP. You can use geolcoator.setGeoIPSource() method to set a different Geo-IP source, but see the Caveats section before you do so.
  • Most importantly; please use this library for anonymous usage data only. And get consent from your users that you're collecting their personal data and present your reasons.

Caveats

  • Mixed Content Restriction:

    There are alternative Geo-IP services to be used with this library. But most of these services do not provide a free API over HTTPS (SSL/TLS). You need to subscribe for a premium API key to use HTTPS. The caveat is; HTML5 Geolocation API is restricted to HTTPS and when you enable the fallbackToIP option, some browsers (such as Chrome and Firefox) will not allow mixed content. It will block HTTP content when the page is served over HTTPS.

    Currently, Geolocator will use GeoJS by default which is free and supports HTTPS. Please use this service responsibly. For example, do NOT call locate() or .locatebyIP() on every user/request but only on site entrance. Their location or IP will not change suddenly unless they can teleport!..

    Also, support GeoJS if you can so we can continue using this nice free service. If you know other free Geo-IP services over HTTPS, let me know and we can add/use them as alternatives.

  • Isomorphic Applications / SSR Support:

    This library currently only works on client-side (browser). Any kind of server-side functionality (including Server Side Rendering) is not yet oficially supported.

    There is a discussion about at least preventing it from throwing on server; or maybe adding support for some (if not all) methods to work on server. If you're interested and willing to contribute;

    • Continue discussion on this thread,
    • PRs are welcome since I need help improving and maintaining this library.

Under the Hood

Geolocator v2 is written in ES2015 (ES6), compiled with Babel, bundled with Webpack and documented with Docma.

Change Log

See version changes here.

License

MIT. See the Disclaimer and License.