PHPackages                             siberfx/backpack-leaflet-drawjs - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [API Development](/categories/api)
4. /
5. siberfx/backpack-leaflet-drawjs

ActiveLibrary[API Development](/categories/api)

siberfx/backpack-leaflet-drawjs
===============================

LeafletDrawjs for Laravel Backpack ^6.x

1.3.1(1y ago)23MITBladePHP ^8.1

Since Oct 7Pushed 1y ago1 watchersCompare

[ Source](https://github.com/siberfx/backpack-leaflet-drawjs)[ Packagist](https://packagist.org/packages/siberfx/backpack-leaflet-drawjs)[ Docs](https://github.com/siberfx/backpack-leaflet-drawjs)[ RSS](/packages/siberfx-backpack-leaflet-drawjs/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (9)Dependencies (2)Versions (9)Used By (0)

Leaflet Draw Polygon with mapbox
--------------------------------

[](#leaflet-draw-polygon-with-mapbox)

Leaflet Drawing Polygon field and storing as json for Laravel Backpack ^6.x

[](#leaflet-drawing-polygon-field-and-storing-as-json-for-laravel-backpack-6x)

 [![](https://raw.githubusercontent.com/siberfx/backpack-leaflet-drawjs/refs/heads/main/img/preview.png)](https://raw.githubusercontent.com/siberfx/backpack-leaflet-drawjs/refs/heads/main/img/preview.png)

[![Stars](https://camo.githubusercontent.com/fc4b1359bfe5fdef6d2f047b78f20bb1870872e7ccc599a39f711163316a65b6/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f736962657266782f6261636b7061636b2d6c6561666c65742d647261776a733f7374796c653d706c6173746963266c6162656c436f6c6f723d333433623431)](https://camo.githubusercontent.com/fc4b1359bfe5fdef6d2f047b78f20bb1870872e7ccc599a39f711163316a65b6/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f736962657266782f6261636b7061636b2d6c6561666c65742d647261776a733f7374796c653d706c6173746963266c6162656c436f6c6f723d333433623431)

[![Forks](https://camo.githubusercontent.com/1888226e60c4b1fb38418923722eaaba71461751f0493f12b4520400f8e9891f/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f666f726b732f736962657266782f6261636b7061636b2d6c6561666c65742d647261776a733f7374796c653d706c6173746963266c6162656c436f6c6f723d333433623431)](https://camo.githubusercontent.com/1888226e60c4b1fb38418923722eaaba71461751f0493f12b4520400f8e9891f/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f666f726b732f736962657266782f6261636b7061636b2d6c6561666c65742d647261776a733f7374796c653d706c6173746963266c6162656c436f6c6f723d333433623431)

 \[!\[Latest Version on Packagist\]([https://img.shields.io/packagist/dt/siberfx/backpack-leaflet-drawjs?style=plastic)\](https://packagist.org/packages/siberfx/backpack-leaflet-drawjs](https://img.shields.io/packagist/dt/siberfx/backpack-leaflet-drawjs?style=plastic)](https://packagist.org/packages/siberfx/backpack-leaflet-drawjs)) ## Installation You can install the package via composer:

```
composer require siberfx/backpack-leaflet-drawjs
```

Usage
-----

[](#usage)

```
// config/leaflet.php file content, you can modify it by your own settings.
return [

    'mapbox' => [
        'access_token' => env('MAPS_MAPBOX_ACCESS_TOKEN', 'xxxxxxxxxxxxxxxxxxxxx'),
    ],
];
```

backpack usage example

```
 CRUD::addField([
            'name' => 'coordinates',
            'label' => 'Poligon coordinates',
            'type' => 'leaflet-draw',
            'options' => [
                'provider' => 'mapbox',
                'marker_image' => null
            ],

        ]);
```

the stored data structure example;

```
{"type": "Feature", "geometry": {"type": "Polygon", "coordinates": [[[30.59967, 36.832371], [30.617523, 36.899391], [30.669708, 36.904882], [30.702667, 36.91696], [30.768585, 36.910372], [30.809784, 36.878522], [30.838623, 36.853252], [30.775452, 36.848857], [30.730133, 36.856549], [30.697174, 36.878522], [30.662842, 36.885113], [30.59967, 36.832371]]]}, "properties": []}
```

### Publish files

[](#publish-files)

```
php artisan vendor:publish --provider="Backpack\LeafletDrawjs\LeafLetDrawServiceProvider" --tag="all"
```

### Add Leaflet drawing polygon as json and store as json

[](#add-leaflet-drawing-polygon-as-json-and-store-as-json)

you will have to need a migration with json or text type to store the data, as in the example below;

```
 public function up()
    {
        Schema::create('polygons', function (Blueprint $table) {
            $table->id();
            $table->json('geojson'); // Store GeoJSON data
            $table->timestamps();
        });
    }
```

the model should be like;

```
namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Polygon extends Model
{
    use HasFactory;

    protected $fillable = ['geojson'];

    // Optionally, if you want to decode the GeoJSON automatically
    public function getGeojsonAttribute($value)
    {
        return json_decode($value);
    }
}
```

the controller example should be like;

```
namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Polygon;

class PolygonController extends Controller
{
    public function store(Request $request)
    {
        // Validate the incoming data (optional)
        $request->validate([
            'polygon' => 'required|array'
        ]);

        // Store the polygon data as GeoJSON or serialized data
        $polygon = new Polygon();
        $polygon->geojson = json_encode($request->polygon); // Save GeoJSON
        $polygon->save();

        return response()->json(['message' => 'Polygon saved successfully']);
    }
}
```

the route example;

```
Route::post('/store-polygon', [PolygonController::class, 'store'])->name('store-polygon');
```

### Call it inside your controller like this or

[](#call-it-inside-your-controller-like-this-or)

or add in your Crud controller manually where you want to see it as shown below.

```
 $this->crud->addField([
        'label' => 'Location',
        'name' => 'location',
        'type' => 'leaflet-draw',
        'options' => [
            'provider' => 'mapbox',
            'marker_image' => null
        ],
        'tab' => 'General'
        'hint' => 'You can also drag and adjust your mark by clicking'
 ]);
```

```

### Security

If you discover any security related issues, please email info@siberfx.com instead of using the issue tracker.

## Credits

- [Selim Gormus](https://github.com/siberfx)

```

###  Health Score

28

—

LowBetter than 54% of packages

Maintenance37

Infrequent updates — may be unmaintained

Popularity6

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity53

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~0 days

Total

8

Last Release

577d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/319c5a3ca014236bc2d28e3e37825e1ec467b51455c020c6666d1f40f493c2e1?d=identicon)[siberfx](/maintainers/siberfx)

---

Top Contributors

[![siberfx](https://avatars.githubusercontent.com/u/10257240?v=4)](https://github.com/siberfx "siberfx (13 commits)")

---

Tags

backpackmapboxopenstreetmapslaravel 9.xleafjslaravel 10.xlaravel 11.xleaflet-drawjsleaflet-polygonleaflet polygon json

### Embed Badge

![Health badge](/badges/siberfx-backpack-leaflet-drawjs/health.svg)

```
[![Health](https://phpackages.com/badges/siberfx-backpack-leaflet-drawjs/health.svg)](https://phpackages.com/packages/siberfx-backpack-leaflet-drawjs)
```

###  Alternatives

[esign/laravel-conversions-api

A laravel wrapper package around the Facebook Conversions API

69145.4k](/packages/esign-laravel-conversions-api)[didww/didww-api-3-php-sdk

PHP SDK for DIDWW API 3

1218.2k](/packages/didww-didww-api-3-php-sdk)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)