A Laravel Nova field that provides an interactive Google Map with Places Autocomplete for picking locations. Users can search for addresses, drag a marker, or enter coordinates manually.
- PHP 8.1+
- Laravel Nova 4.x or 5.x
- A Google Cloud API key with Maps JavaScript API and Places API enabled
composer require ghanem/google-mapPublish the config file:
php artisan vendor:publish --provider="Ghanem\GoogleMap\FieldServiceProvider"Add your Google Maps API key to .env:
GMAPS_API_KEY=your-api-key-hereOptional environment variables with their defaults:
GMAPS_DEFAULT_LATITUDE=41.657523
GMAPS_DEFAULT_LONGITUDE=-101.157292
GMAPS_DEFAULT_ZOOM=3Get your API key from the Google Cloud Console. Make sure to enable both Maps JavaScript API and Places API.
Add the field to your Nova resource:
use Ghanem\GoogleMap\GHMap;
public function fields(NovaRequest $request): array
{
return [
// ...
GHMap::make('Location'),
];
}Your model needs latitude and longitude columns (or custom names — see below).
If your database columns are not named latitude and longitude:
GHMap::make('Location')
->latitude('lat')
->longitude('lng'),GHMap::make('Location')
->hideLatitude()
->hideLongitude(),GHMap::make('Location')
->zoom(10),GHMap::make('Location')
->apiKey('different-api-key'),GHMap::make('Location')
->latitude('lat')
->longitude('lng')
->zoom(12)
->hideLatitude()
->hideLongitude(),You can also use any standard Nova field methods (validation, visibility, etc.):
GHMap::make('Location')
->rules('required')
->hideFromIndex(),When a location is selected (via autocomplete or marker drag), the field emits Nova events that you can listen to in other custom fields:
| Event | Description |
|---|---|
address-update |
Full formatted address |
city-update |
City / locality name |
state-update |
State / administrative area |
country-update |
Country name |
zip-code-update |
Postal code |
latitude-update |
Latitude value (incoming) |
longitude-update |
Longitude value (incoming) |
See CHANGELOG.md for release history.
MIT - see LICENSE for details.
