Reverse Geocoding

Example showing how to utilize the temporalData endpoint for reverse geocoding.

by Breinify

HTML

<script src="https://cdn.rawgit.com/Breinify/brein-api-library-javascript-browser/90bb431e/dist/breinify-api.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css">
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
<div id="map"></div>

CSS

#map { height: 500px; }

JavaScript

// set the configuration for Breinify and leafLet
Breinify.setConfig({ 'apiKey': '938D-3120-64DD-413F-BB55-6573-90CE-473A', 'timeout': 10000 });
initLeafLetMap();

/*
 * Now we define the location we want to look-up, we also want 
 * the shapes of the city and the neighborhood the location points to.
 */
var latLon = [37.7609295, -122.4194155];
var loc = {
  latitude: latLon[0],
  longitude: latLon[1],
  shapeTypes: ['CITY', 'NEIGHBORHOOD']
};

Breinify.temporalData({additional: { location: loc }}, false, function(data) {

	// let's visualize the returned data in the leafLet map
	window.map.setView(latLon, 11);
  
  // add the geoJsons
	L.geoJSON(data.location.geojson.CITY, {style: { 'color': 'grey' } }).addTo(window.map);
	L.geoJSON(data.location.geojson.NEIGHBORHOOD).addTo(window.map);
  
  // let's also add a nice popup
  var name = data.location.geojson.NEIGHBORHOOD.name;
  L.marker(latLon).addTo(window.map).bindPopup('your lat/lon:<br/><b>' + name + '</b>').openPopup();
});

function initLeafLetMap() {

  // simplify access
  window.map = L.map('map');
  
	var url = 'https://api.mapbox.com';
  url += '/styles/v1/mapbox/outdoors-v10/tiles/256/{z}/{x}/{y}?access_token=';
  url += 'pk.eyJ1IjoiYnJlaW5pZnkiLCJhIjoiY2owd3ZjdHJwMDAydzMyc2Q3MWI0MXZkdCJ9.sf4BzE0VIlIQ-vp-mpatbw'
  var c = 'Map data &copy; ';
  c += ' <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ';
  c += ' <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ';
  c += 'Imagery © <a href="http://mapbox.com">Mapbox</a>';
  
  L.tileLayer(url, { attribution: c, maxZoom: 15 }).addTo(window.map);
}

/*
 * The following is not part of the example and just used to measure how many
 * people actually look at this example.
 */
var sId = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
	var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);
});
if (Breinify.UTL.cookie.check('breinify_jsFiddle')) {
	sId =...