Add reverse geocoding detection

Estimated reading time: 1 minute

This example uses JawgPlaces.Input to initialize a Jawg Places Input inside an HTML element on a webpage. It will allow you to perform Reverse Geocoding with your <input> element using Jawg Places API.

You can paste coordinates in the form {lat}/{lon} in the input. The separation can be either / (slash), , (comma) or (space).

You can try with these examples:

48.8680678/2.3129868 (Avenue des Champs Élysées, Paris, France)
40.6891761,-74.0445886 (Statue of Liberty, New York, NY, USA)
-33.8569 151.215212 (Sydney Opera House, Sydney, NSW, Australia)

You can see all reverse options here.

The value <YOUR_ACCESS_TOKEN> in the <script> tag must be replaced by your own access token from the Jawg Lab.

View on GitHub

<html>
  <head>
    <script src="https://api.jawg.io/libraries/jawg-places@latest/jawg-places.js?access-token=<YOUR_ACCESS_TOKEN>"></script>
  </head>
  <body>
    <input id="my-input" type="text" placeholder="Search" />
    <script>
      new JawgPlaces.Input({
        input: '#my-input',
        searchOnTyping: true,
        showResultIcons: true,
        reverse: true,
      });
    </script>
  </body>
</html>