Skip to content

PolarisMapEditor is an intuitive and powerful area editor built with Flutter Map. Easily create and edit polygons that form areas, with advanced drawing and editing tools.

License

Notifications You must be signed in to change notification settings

cosmos-in-code/polaris_map_editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Polaris Map Editor

PolarisMapEditor is a Flutter library for creating map editors with a celestial touch, allowing users to interactively draw areas on the map. The library is inspired by the concept of Polaris, the North Star, providing a reliable point of reference.

Example

Getting started

Import the library into your Dart code:

  import 'package:polaris_map_editor/polaris_map_editor.dart';

How to Use

PolarisMapEditor Widget

import 'package:polaris_map_editor/polaris_map_editor.dart';

PolarisMapEditor(
  mapController: mapController,
  options: PolarisOptions.defaultOptions(
    color: Colors.deepPurple,
    // optional: enable search places
    googlePlaceApiKey: Platform.isMacOS || Platform.isIOS
        ? Config.googlePlaceIosKey
        : Config.googlePlaceAndroidKey,
  ),
  onAreaChanged: print,
  child: FlutterMap(
    mapController: mapController,
    options: MapOptions(
      interactionOptions: InteractionOptions(
        cursorKeyboardRotationOptions:
            CursorKeyboardRotationOptions.disabled(), // prevent shortcuts
      ),
    ),
    children: const [ 
      OpenStreeTileLayer(), // replace with your tile layer
      PolarisLayer(), // <===== Polaris widget, includes AreaLayer, LinesLayer and PointsLayer
    ],
  ),
)

PolarisOptions

The core widget responsible for customizing the Polaris map editor. Integrates seamlessly with Flutter Map and provides customization options.

factory PolarisOptions.defaultOptions({
  Color color = Colors.blue,
  String? googlePlaceApiKey,
}) {
  return PolarisOptions(
    menu: const MenuOptions(
      enabled: true,
    ),
    area: AreaOptions(
      color: color.withOpacity(0.3),
      isFilled: true,
    ),
    line: LineOptions(
      color: color,
      strokeWidth: 3,
    ),
    draggedLine: LineOptions(
      color: color,
      strokeWidth: 3,
      isDotted: true,
    ),
    point: PointOptions(
      icon: Icon(
        Icons.circle,
        color: color,
        size: 14,
      ),
      lastPointIcon: Stack(
        fit: StackFit.expand,
        children: [
          Icon(
            Icons.circle,
            color: color,
            size: 10,
          ),
          Icon(
            Icons.circle_outlined,
            color: color,
            size: 19,
          ),
        ],
      ),
    ),
    place: googlePlaceApiKey != null
        ? PlaceOptions.googleMapService(apiKey: googlePlaceApiKey)
        : null,
    mouse: const MouseOptions(),
    shortcut: const ShortcutOptions(
      undo: [
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.keyZ],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.keyZ],
      ],
      redo: [
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.keyY],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.keyY],
        [
          LogicalKeyboardKey.controlLeft,
          LogicalKeyboardKey.shiftLeft,
          LogicalKeyboardKey.keyZ
        ],
        [
          LogicalKeyboardKey.metaLeft,
          LogicalKeyboardKey.shiftLeft,
          LogicalKeyboardKey.keyZ
        ],
      ],
      search: [
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.keyF],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.keyF],
      ],
      zoomIn: [
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.add],
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.equal],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.add],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.equal],
        [
          LogicalKeyboardKey.controlLeft,
          LogicalKeyboardKey.shiftLeft,
          LogicalKeyboardKey.add
        ],
        [
          LogicalKeyboardKey.metaLeft,
          LogicalKeyboardKey.shiftLeft,
          LogicalKeyboardKey.add
        ],
      ],
      zoomOut: [
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.minus],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.minus],
      ],
      fitCameraToArea: [
        [LogicalKeyboardKey.controlLeft, LogicalKeyboardKey.keyH],
        [LogicalKeyboardKey.metaLeft, LogicalKeyboardKey.keyH],
      ],
      deletePoint: [
        [LogicalKeyboardKey.controlLeft],
      ],
    ),
  );
}

Contributing

Contributions are welcome! If you encounter any issues or have suggestions, feel free to open an issue or submit a pull request.

License

This project is licensed under the BSD 3-Clause License.

About

PolarisMapEditor is an intuitive and powerful area editor built with Flutter Map. Easily create and edit polygons that form areas, with advanced drawing and editing tools.

Resources

License

Stars

Watchers

Forks

Packages

No packages published