Example integrations for PlaceField, a commercial location autocomplete API and JavaScript widget for city, municipality, administrative area, region, and country form fields.
PlaceField itself is not open source. This repository contains sample integration code only.
PlaceField helps production forms collect structured location data without turning a simple location field into a maps, address, routing, or POI search workflow.
Autocomplete results can include:
- Stable PlaceField location ID
- Place type
- Display name and label
- Country
- Administrative hierarchy
- Coordinates when available
PlaceField is not an address autocomplete, address validation, reverse geocoding, routing, map tile, or POI search product.
| Example | Use When |
|---|---|
examples/api-fetch |
You want to call the autocomplete API directly from browser JavaScript. |
examples/basic-js |
You want PlaceField behavior attached to your own input and UI. |
examples/full-widget |
You want a ready-made autocomplete field with bundled UI. |
examples/react-widget |
You want a React/Vite example using the Full Widget. |
- Product: placefield.dev
- Docs: placefield.dev/docs
- API reference: placefield.dev/api
- Location autocomplete API overview: placefield.dev/location-autocomplete-api
- Widget overview: placefield.dev/location-autocomplete-widget
- FAQ: placefield.dev/faq
These examples use placeholder keys such as pf_pub_xxx.
To run them against the hosted PlaceField API:
- Request or create a PlaceField public browser key.
- Replace
pf_pub_xxxwith your public key. - Add the exact local or production origin in the PlaceField dashboard.
Public browser keys use the pf_pub_ prefix and are sent from browser integrations. Secret server keys use the pf_live_ prefix and must stay on your backend.
The examples are configured for worldwide forms. Add country, countries, or countryMode only when your form should bias or filter results for a specific country.
Do not commit real API keys.
For static examples, serve the repository over a local HTTP server with Node:
npx http-server . -p 8080Then open:
http://localhost:8080/http://localhost:8080/examples/api-fetch/http://localhost:8080/examples/full-widget/http://localhost:8080/examples/basic-js/
The sample code in this repository is MIT licensed. PlaceField API and hosted widget usage require a PlaceField key and are governed by PlaceField commercial terms.