Filament Map Picker Laravel Package

Getting Started

Install via Composer: composer require nersus15/filament-map-picker. Publish the config and assets: php artisan vendor:publish --tag="filament-map-picker-config" and php artisan vendor:publish --tag="filament-map-picker-assets". Review config/filament-map-picker.php for map provider, default center, zoom, and API key settings. Add the form field to any Filament resource form: MapPicker::make('location'). The first use case is adding a location picker to a create/edit form so users can drop a pin or use their current location. Look first at the config file and the field’s available methods (e.g. ->liveLocation(), ->defaultCenter()) to tailor behavior.

Implementation Patterns

Use the field in Filament resources where you store coordinates. Common storage patterns: a single JSON column cast to array/collection, or separate latitude/longitude columns with a custom dehydrateStateUsing and afterStateHydrated. Combine with other fields (address, notes) and use the built-in live location button for quick entry. For edit forms, rely on the 1.8.3 behavior: the map loads the record’s saved coordinates instead of automatically requesting the browser’s current location. If you need live location on edit, add an explicit action/button rather than expecting automatic override. Integrate with reverse geocoding by listening to the field’s state updates and calling a geocoder service, or use the package’s hooks if provided. For custom map providers, extend the config and override the field view if necessary.

Gotchas and Tips

• Live location on edit (1.8.3 fix): The live location feature now only activates when creating a new record. When editing, the map uses the stored record coordinates, preventing accidental overwrites. Update any custom workflows that assumed live location would always refresh the pin.
• Asset publishing: Forgetting to publish assets results in a blank map. Re-publish after upgrades if the package’s frontend assets change.
• API keys: If using Google Maps, ensure the key is set in config and has the required APIs enabled. Leaflet/OpenStreetMap may work without a key but check tile provider terms.
• State dehydration: The field may return an array or a formatted string depending on config. Verify your model casts and migration column types match.
• Debugging: Check the browser console for tile loading errors, inspect the field’s state in Livewire, and confirm the config is cached correctly (php artisan config:clear after changes).
• Extension points: Use the config file to swap map providers, adjust default center/zoom, and customise UI options. For deeper customisation, publish and override the field’s Blade view.