PHP code example of dotswan / filament-map-picker

1. Go to this page and download the library: Download dotswan/filament-map-picker library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.
    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

    

dotswan / filament-map-picker example snippets



namespace App\Filament\Resources;
use Filament\Resources\Resource;
use Filament\Resources\Forms\Form;
use Dotswan\MapPicker\Fields\Map;
...

class FilamentResource extends Resource
{
    ...
    public static function form(Form $form)
    {
        return $form->schema([
            Map::make('location')
                        ->label('Location')
                        ->columnSpanFull()
                        ->defaultLocation(latitude: 40.4168, longitude: -3.7038)
                        ->afterStateUpdated(function (Set $set, ?array $state): void {
                            $set('latitude',  $state['lat']);
                            $set('longitude', $state['lng']);
                            $set('geojson',   json_encode($state['geojson']));
                        })
                        ->afterStateHydrated(function ($state, $record, Set $set): void {
                            $set('location', [
                                    'lat'     => $record->latitude,
                                    'lng'     => $record->longitude,
                                    'geojson' => json_decode(strip_tags($record->description))
                                ]
                            );
                        })
                        ->extraStyles([
                            'min-height: 150vh',
                            'border-radius: 50px'
                        ])
                        ->liveLocation(true, true, 5000)
                        ->showMarker()
                        ->markerColor("#22c55eff")
                        ->markerHtml('<div class="custom-marker">...</div>')
                        ->markerIconUrl('/path/to/marker.png')
                        ->markerIconSize([32, 32])
                        ->markerIconClassName('my-marker-class')
                        ->markerIconAnchor([16, 32])
                        ->showFullscreenControl()
                        ->showZoomControl()
                        ->draggable()
                        ->tilesUrl("https://tile.openstreetmap.de/{z}/{x}/{y}.png")
                        ->zoom(15)
                        ->detectRetina()
                        ->showMyLocationButton()
                        ->geoMan(true)
                        ->geoManEditable(true)
                        ->geoManPosition('topleft')
                        ->drawCircleMarker()
                        ->rotateMode()
                        ->clickable() //click to move marker
                        ->drawMarker()
                        ->drawPolygon()
                        ->drawPolyline()
                        ->drawCircle()
                        ->dragMode()
                        ->cutPolygon()
                        ->editPolygon()
                        ->deleteLayer()
                        ->setColor('#3388ff')
                        ->setFilledColor('#cad9ec')
           ]);
    }
    ...
}


use Filament\Forms\Components\Actions\Action;
use Filament\Forms\Components\Actions;
use Filament\Support\Enums\VerticalAlignment;

Actions::make([
    Action::make('Set Default Location')
        ->icon('heroicon-m-map-pin')
        ->action(function (Set $set, $state, $livewire): void {
            $set('location', ['lat' => '52.35510989541003', 'lng' => '4.883422851562501']);
            $set('latitude', '52.35510989541003');
            $set('longitude', '4.883422851562501');
            $livewire->dispatch('refreshMap');
        })
])->verticalAlignment(VerticalAlignment::Start);


Map::make('location')
  ->defaultLocation(latitude: 40.4168, longitude: -3.7038)
  ->showMarker(true)
  ->clickable(true)
  ->tilesUrl("https://tile.openstreetmap.de/{z}/{x}/{y}.png")
  ->zoom(12)

Fieldset::make('Location')
    ->schema([
        Select::make('membership_distance')
            ->enum(MembershipDistance::class)
            ->options(MembershipDistance::class)
            ->omControl()
            ->tilesUrl("https://tile.openstreetmap.de/{z}/{x}/{y}.png")
            ->zoom(12)
            ->detectRetina()
            ->rangeSelectField('membership_distance')
            ->setFilledColor('#cad9ec'),
    ])
    ->columns(1),

Map::make('location')
    ->liveLocation(true, true, 10000)  // Updates live location every 10 seconds
    ->showMarker()
    ->draggable()

Map::make('location')
    ->showMarker()
    ->boundaries(true,49,11.1,61.0,2.1)
    ->draggable()


use Dotswan\MapPicker\Infolists\MapEntry;

    public static function infolist(Infolist $infolist): Infolist
    {
        return $infolist
            ->schema([
                MapEntry::make('location')
                    ->extraStyles([
                        'min-height: 50vh',
                        'border-radius: 50px'
                    ])
                    ->state(fn ($record) => ['lat' => $record?->latitude, 'lng' => $record?->longitude])
                    ->showMarker()
                    ->markerColor("#22c55eff")
                    ->showFullscreenControl()
                    ->draggable(false)
                    ->zoom(15),

                .....
            ]);
    }


$table->double('latitude')->nullable();
$table->double('longitude')->nullable();

->afterStateHydrated(function ($state, $record, Set $set): void {
    $set('location', ['lat' => $record?->latitude, 'lng' => $record?->longitude]);
})

TextInput::make('latitude')
    ->hiddenLabel()
    ->hidden(),

TextInput::make('longitude')
    ->hiddenLabel()
    ->hidden()

class YourModel extends Model
{
    protected function location(): Attribute
    {
        return Attribute::make(
            get: fn (mixed $value, array $attributes) => [
                'latitude' => $attributes['latitude'],
                'longitude' => $attributes['longitude']
            ],
            set: fn (array $value) => [
                'latitude' => $value['latitude'],
                'longitude' => $value['longitude']
            ],
        );
    }
}