README

A Filament field to enable you select location in map and return geo coordinates.

Status Note

This package still in beta and not full tested. please use at your own risk.

Supported Maps

1. Open Street Map (OSM)

More will be added to package once proven it's needed.

Installation

You can install the package via composer:

composer require humaidem/filament-map-picker

Basic usage

Resource file

<?php
namespace App\Filament\Resources;
use Filament\Resources\Resource;
use Filament\Resources\Forms\Form;
use Humaidem\FilamentMapPicker\Fields\OSMMap;
...
class FilamentResource extends Resource
{
    ...
    public static function form(Form $form)
    {
        return $form->schema([
            OSMMap::make('location')
                ->label('Location')
                ->showMarker()
                ->draggable()
                ->extraControl([
                    'zoomDelta'           => 1,
                    'zoomSnap'            => 0.25,
                    'wheelPxPerZoomLevel' => 60
                ])
                // tiles url (refer to https://www.spatialbias.com/2018/02/qgis-3.0-xyz-tile-layers/)
                ->tilesUrl('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}')
           ]);
    }
    ...
}

Manipulating data

We will be using grimzy/laravel-mysql-spatial:^4.0 as example, you can use any other package as you please.

After State Hydrated

once data loaded from database you will need to convert it to correct format as livewire don't accept class base format.

...
OSMMap::make('location')
    ->afterStateHydrated(function ($state, callable $set) {
            if ($state instanceof Point) {
                /** @var Point $state */
                $set('location', ['lat' => $state->getLat(), 'lng' => $state->getLng()]);
            }
        });
...

mutate Dehydrated State

convert array to Point class before storing data.

...
OSMMap::make('location')
   ->mutateDehydratedStateUsing(function ($state) {
                if (!($state instanceof Point))
                    return new Point($state['lat'], $state['lng']);

                return $state;
            });
...

After State Updated

Make sure to convert data into array after each time updated.

...
OSMMap::make('location')
    ->afterStateUpdated(function ($state, callable $set) use ($name) {
            if ($state instanceof Point) {
                /** @var Point $state */
                $set($name, ['lat' => $state->getLat(), 'lng' => $state->getLng()]);
            }
        });
...

Options

License

MIT © Humaid Al Mansoori

Thanks for use

Hopefully, this package is useful to you.