All tutorials
JavaScript
The JavaScript API wrapper is useful for JavaScript developers who wish to seamlessly integrate the what3words API into their JavaScript applications, without the hassle of having to manage the low level API calls themselves.
The what3words API is a fast, simple interface which allows you to convert 3 word addresses such as ///index.home.raft to latitude and longitude coordinates such as (-0.203586, 51.521251) and vice versa. It features a powerful autosuggest function, which can validate and autocorrect user input and limit it to certain geographic areas (this powers the search box on our map site). It allows you to request a section of the what3words grid (which can be requested as GeoJSON for easy display on online maps), and to request the list of all languages supported by what3words. For advanced users, autosuggest can be used to post-process voice output. See links on the left to navigate.
All coordinates are latitude,longitude pairs in standard WGS-84 (as commonly used worldwide in GPS systems). All latitudes must be in the range of -90 to 90 (inclusive).
Installation
To load the what3words JavaScript API, use a script tag like the one in the following example:
<script src="https://assets.what3words.com/sdk/v3/what3words.js?key=YOUR_API_KEY"></script>
The URL contained in the script tag is the location of a JavaScript file that loads everything you need for using the JavaScript wrapper for the what3words API.
The key parameter contains your application’s API key. Sign up to obtain your free API key.
Usage
Convert to 3 word address
Convert coordinates, expressed as latitude and longitude to a 3 word address.
More info about convertTo3wa, including returned results is available in the what3words REST API documentation.
Return standard response:
/** * Converts a coordinate to a 3 word address * @param {Object} coordinates - The coordinate object * @param {number} coordinates.lat - The latitude * @param {number} coordinates.lng - The longitude * @param {string} [language=en] - The language to return the 3 word address in * @returns {Promise} Promise 3 word address response */ what3words.api.convertTo3wa({lat:51.508344, lng:-0.12549900}, 'en') .then(function(response) { console.log("[convertTo3wa]", response); });
Return as GeoJSON:
/** * Converts a coordinate to 3 word address (GeoJson) * @param {Object} coordinates - The coordinate object * @param {number} coordinates.lat - The latitude * @param {number} coordinates.lng - The longitude * @param {string} [language=en] - The language to return the 3 word address in * @returns {Promise} Promise 3 word address response */ what3words.api.convertTo3waGeoJson({lat:51.508344, lng:-0.12549900}, 'en') .then(function(response) { console.log("[convertTo3wa]", response); });
Convert to coordinates
This function converts a 3 word address to a position (expressed as coordinates of latitude and longitude).
It takes the words parameter as a string of 3 words 'table.book.chair'
More info about convertToCoordinates, including returned results is available in the what3words REST API documentation.
Return standard response:
/** * Returns coordinates for a 3 word address * @param {string} words - The 3 word address words to convert to coordinates * @returns {Promise} - Promise coordinates response */ what3words.api.convertToCoordinates("filled.count.soap") .then(function(response) { console.log("[convertToCoordinates]", response); });
Return as GeoJSON:
/** * Returns coordinates for a 3 word address (GeoJson) * @param {string} words - The 3 word address words to convert to coordinates (GeoJson) * @returns {Promise} - Promise coordinates response */ what3words.api.convertToCoordinatesGeoJson("filled.count.soap") .then(function(response) { console.log("[convertTo3wa]", response); });
AutoSuggest
When presented with a 3 words address which may be incorrectly entered, AutoSuggest returns a list of potential correct 3 word addresses. It needs the first two words plus at least the first character of the third word to produce suggestions.
This method provides corrections for mis-typed words (including plural VS singular), and words being in the wrong order.
Optionally, clipping can narrow down the possibilities, and limit results to:
- One or more countries
- A geographic area (a circle, box or polygon)
This dramatically improves results, so we recommend that you use clipping if possible.
To improve results even further, set the focus to user’s current location. This will make autosuggest return results which are closer to the user.
More information about autosuggest, including returned results is available in the what3words REST API documentation.
Example: Basic Autosuggest call
/** * Returns autosuggest results for a search term * @param {string} input - The input to search for autosuggests * @param {Object} [options] - The result filter and clipping options * @param {Object} [options.focus] - The coordinates for the focus of the search * @param {number} [options.focus.lat] - The latitude of the focus * @param {number} [options.focus.lng] - The longitude of the focus * @param {string} [options.nFocusResults] - The number of focused results * @param {string[]} [options.clipToCountry] - The countries to clip results to * @param {Object} [options.clipToBoundingBox] - The bounding box to clip results within * @param {Object} [options.clipToBoundingBox.southwest] - The coordinates of the southwest corner of the clipping box * @param {Object} [options.clipToBoundingBox.southwest.lat] - The latitude of the southwest corner of the clipping box * @param {Object} [options.clipToBoundingBox.southwest.lng] - The longitude of the southwest corner of the clipping box * @param {Object} [options.clipToBoundingBox.northeast] - The coordinates of the northeast corner of the clipping box * @param {Object} [options.clipToBoundingBox.northeast.lat] - The latitude of the northeast corner of the clipping box * @param {Object} [options.clipToBoundingBox.northeast.lng] - The longitude of the northeast corner of the clipping box * @param {Object} [options.clipToCircle] - The circle to clip results within * @param {Object} [options.clipToCircle.center] - The center of the circle to clip results within * @param {number} [options.clipToCircle.center.lat] - The latitude of the center of the circle to clip results within * @param {number} [options.clipToCircle.center.lng] - The longitude of the center of the circle to clip results within * @param {number} [options.clipToCircle.radius] - The radius of the circle to clip results within * @param {number[]} [options.clipToPolygon] - An array of polygon coordinates to clip results within * @param {string} [options.inputType] - 'text' | 'vocon-hybrid' | 'nmdp-asr' | 'generic-voice' * @param {string} [options.language] - The language to return autosuggest results in * @param {boolean} [options.preferLang] - Whether to bias towards results that are over land vs over the sea. * @returns {Promise} - Promise 3 word address autosuggestions response */ what3words.api.autosuggest("fun.with.code") .then(function(response) { console.log("[autosuggest]", response); });
Example: AutoSuggest, clipping the results returned to France and Germany
what3words.api.autosuggest("fun.with.code", { clipToCountry: ["FR", "DE"] }) .then(function(response) { console.log("[autosuggest]", response); } );
Example: AutoSuggest, clipping to a circle
what3words.api.autosuggest("fun.with.code", { clipToCircle: {center: {lat:51.4243877, lng:-0.34745}, radius:50} }) .then(function(response) { console.log("[autosuggest]", response); } );
Example: AutoSuggest, clipping to a polygon
what3words.api.autosuggest("fun.with.code", { clipToPolygon: [51.421,-0.343,52.6,2.3324,54.234,8.343,51.421,-0.343] }) .then(function(response) { console.log("[autosuggest]", response); } );
Example: AutoSuggest, clipping to a bounding box
what3words.api.autosuggest("fun.with.code", { clipToBoundingBox:{ southwest: { lat: 51.521, lng: -0.343 }, northeast: { lat: 52.6, lng: 2.3324 } }}) .then(function(response) { console.log("[autosuggest]", response); } );
Example: AutoSuggest, Focus on (51.4243877,-0.34745)
what3words.api.autosuggest("fun.with.code", { focus: {lat:51.4243877, lng:-0.34745} }) .then(function(response) { console.log("[autosuggest]", response); } );
Example: AutoSuggest, Focus on (51.4243877,-0.34745) and then determine how many results within the response it applies to
what3words.api.autosuggest("fun.with.code", {focus: {lat:51.4243877, lng:-0.34745},nFocusResults: 2}) .then(function(response) { console.log("[autosuggest]", response); } );
Example: AutoSuggest, with Generic Voice input type
what3words.api.autosuggest("fun with code", {inputType: "generic-voice", language: "en"}) .then(function(response) { console.log("[autosuggest]", response); } );
Grid section
Grid section returns a section of the what3words 3m x 3m grid as a set of horizontal and vertical lines covering the requested area, which can then be drawn onto a map.
The requested box must not exceed 4km from corner to corner, or a BadBoundingBoxTooBig error will be returned.
More information about gridSection, including returned results is available in the what3words REST API documentation.
Return standard response:
/** * Returns a section of the what3words grid * @param {Object} boundingBox - The bounding box for the grid to return * @param {Object} [boundingBox.southwest] - The coordinates of the southwest corner of the bounding box * @param {Object} [boundingBox.southwest.lat] - The latitude of the southwest corner of the bounding box * @param {Object} [boundingBox.southwest.lng] - The longitude of the southwest corner of the bounding box * @param {Object} [boundingBox.northeast] - The coordinates of the northeast corner of the bounding box * @param {Object} [boundingBox.northeast.lat] - The latitude of the northeast corner of the bounding box * @param {Object} [boundingBox.northeast.lng] - The longitude of the northeast corner of the bounding box * @return {Promise} - Promise the grid section */ what3words.api.gridSection({ southwest: { lat: 51.508341, lng: -0.125499 }, northeast: { lat: 51.507341, lng: -0.124499 } }) .then(function(response) { console.log("[gridSection]", response); } );
Return as GeoJSON:
/** * Returns a section of the what3words grid (GeoJson) * @param {Object} boundingBox - The bounding box for the grid to return * @param {Object} [boundingBox.southwest] - The coordinates of the southwest corner of the bounding box * @param {Object} [boundingBox.southwest.lat] - The latitude of the southwest corner of the bounding box * @param {Object} [boundingBox.southwest.lng] - The longitude of the southwest corner of the bounding box * @param {Object} [boundingBox.northeast] - The coordinates of the northeast corner of the bounding box * @param {Object} [boundingBox.northeast.lat] - The latitude of the northeast corner of the bounding box * @param {Object} [boundingBox.northeast.lng] - The longitude of the northeast corner of the bounding box * @return {Promise} - Promise the grid section response */ what3words.api.gridSectionGeoJson({ southwest: { lat: 51.508341, lng: -0.125499 }, northeast: { lat: 51.507341, lng: -0.124499 } }) .then(function(response) { console.log("[gridSection]", response); } );
Available languages
This function returns the currently supported languages. It will return the two letter code, and the name of the language both in that language and in English.
More information about availableLanguages, including returned results is available in the what3words REST API documentation.
/** * Returns the available languages supported by what3words API * @returns {Promise} - Promise the available languages response */ what3words.api.availableLanguages().then(function(n) { console.log("[availableLanguages]",n) });
Handling errors
Errors returned from the API can be caught with the wrapper through the use of a catch function.
Within the catch function, code and message values which represent the error, are accessible from the error object parameter
what3words.api.convertToCoordinates("filled.count.soap") .then(function(response) { console.log("[convertToCoordinates]", response); }) .catch(function(error) { // catch errors here console.log("[code]", error.code); console.log("[message]", error.message); });