PHP code example of siberfx / backpack-leaflet-drawjs

1. Go to this page and download the library: Download siberfx/backpack-leaflet-drawjs 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/ */

    

siberfx / backpack-leaflet-drawjs example snippets


Schema::create('regions', function (Blueprint $table) {
    $table->id();
    $table->string('name');
    $table->json('coordinates')->nullable(); // GeoJSON
    $table->timestamps();
});

class Region extends Model
{
    use \Backpack\CRUD\app\Models\Traits\CrudTrait;

    protected $fillable = ['name', 'coordinates'];

    protected function casts(): array
    {
        return [
            'coordinates' => 'array',
        ];
    }
}

CRUD::field([
    'name'  => 'coordinates',
    'label' => 'Polygon coordinates',
    'type'  => 'leaflet-draw',
    'hint'  => 'Use the polygon tool to draw an area. Click the edit tool to adjust it.',
]);

CRUD::field([
    'name'    => 'coordinates',
    'label'   => 'Polygon coordinates',
    'type'    => 'leaflet-draw',
    'options' => [
        'provider'          => 'mapbox',             // 'mapbox' or 'openstreetmap'
        'access_token'      => null,                 // overrides the configured Mapbox token
        'style'             => 'mapbox/streets-v12', // Mapbox style id
        'lat'               => 36.9667757,           // initial center (when nothing is stored yet)
        'lng'               => 30.7028187,
        'zoom'              => 12,
        'height'            => '400px',
        'color'             => '#3388ff',            // polygon stroke / fill color
        'multiple'          => false,                // true: allow many polygons, stored as FeatureCollection
        'scroll_wheel_zoom' => false,
    ],
]);

// config/backpack/leaflet-draw.php
return [
    'provider' => env('LEAFLET_DRAW_PROVIDER', 'mapbox'),

    'mapbox' => [
        'access_token' => env('MAPS_MAPBOX_ACCESS_TOKEN'),
        'style' => env('MAPS_MAPBOX_STYLE', 'mapbox/streets-v12'),
    ],

    'default' => [
        'lat' => 36.9667757,
        'lng' => 30.7028187,
        'zoom' => 12,
        'height' => '300px',
    ],
];
json
{
  "type": "Feature",
  "properties": {},
  "geometry": {
    "type": "Polygon",
    "coordinates": [[[30.59967, 36.832371], [30.617523, 36.899391], [30.669708, 36.904882], [30.59967, 36.832371]]]
  }
}
bash
php artisan vendor:publish --provider="Siberfx\LeafletDrawjs\LeafletDrawServiceProvider" --tag="config"
bash
php artisan vendor:publish --provider="Siberfx\LeafletDrawjs\LeafletDrawServiceProvider" --tag="views"