Google Map Drawer #

A Flutter package to draw polygons on Google Maps easily, save them as areas, and manage location markers with metadata.

Features #

• Draw polygons directly on Google Maps.
• Undo last point or clear polygon.
• Save drawn polygons with a name.
• Manage multiple saved areas.
• Supports custom markers with LocationInfo.
• Easy-to-use controller for managing drawing.

Installation #

Add to your pubspec.yaml:

dependencies:
  google_map_drawer: ^0.0.2

## Usage
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:google_map_drawer/google_map_drawer.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Google Map Drawer Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MapScreen(),
    );
  }
}

class MapScreen extends StatefulWidget {
  const MapScreen({super.key});

  @override
  State<MapScreen> createState() => _MapScreenState();
}

class _MapScreenState extends State<MapScreen> {
  // 1️⃣ Create controller
  final GoogleMapDrawController mapController = GoogleMapDrawController();

  bool isDrawingMode = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Google Map Drawer Demo")),
      body: Column(
        children: [
          // 2️⃣ Google Map Drawer widget
          Expanded(
            child: GoogleMapDrawer(
              controller: mapController,
              initialCamera: const CameraPosition(
                target: LatLng(11.5564, 104.9282),
                zoom: 13,
              ),
              polygonColor: Colors.blue,
              polygonOpacity: 0.3,
            ),
          ),

          // 3️⃣ User-controlled buttons
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Wrap(
              spacing: 8,
              children: [
                ElevatedButton(
                  onPressed: () {
                    setState(() {
                      isDrawingMode = !isDrawingMode;
                    });
                  },
                  child: Text(isDrawingMode ? "Stop Drawing" : "Start Drawing"),
                ),
                ElevatedButton(
                  onPressed: () {
                    mapController.removeLastPoint();
                    setState(() {}); // Refresh map
                  },
                  child: const Text("Undo"),
                ),
                ElevatedButton(
                  onPressed: () {
                    mapController.clearPoints();
                    setState(() {}); // Refresh map
                  },
                  child: const Text("Clear"),
                ),
                ElevatedButton(
                  onPressed: () {
                    final area = mapController.saveArea("My Property");
                    // Print JSON
                    print(area.toJson());
                    ScaffoldMessenger.of(context).showSnackBar(
                      const SnackBar(content: Text("Area saved!")),
                    );
                  },
                  child: const Text("Save"),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}