Not compatible with flutter_map v5.0.0

Because flutter_map_dragmarker 4.1.3 depends on flutter_map >=3.0.0 <5.0.0 and no versions of flutter_map_dragmarker match >4.1.3 <5.0.0, flutter_map_dragmarker ^4.1.3 requires flutter_map >=3.0.0 <5.0.0. So, because app depends on both flutter_map ^5.0.0 and flutter_map_dragmarker ^4.1.3, version solving failed.

Is it possible to change the color of marker after it created? Or even more change the icon?

Not compatible with flutter_map v4.0.0

Because flutter_map_dragmarker 4.1.2 depends on flutter_map ^3.0.0 and no versions of flutter_map_dragmarker match >4.1.2 <5.0.0, flutter_map_dragmarker ^4.1.2 requires flutter_map ^3.0.0. So, because app depends on both flutter_map ^4.0.0 and flutter_map_dragmarker ^4.1.2, version solving failed.

Platform : macOS
Dependencies :
flutter_map: ^3.1.0
flutter_map_dragmarker: ^4.1.2
Flutter Version : Flutter 3.3.10 • channel stable • https://github.com/flutter/flutter.git
Dart Version : Dart 2.18.6 • DevTools 2.15.0

Bug

Sometimes when zooming in on a map the drag marker does not respond to drag or touch events. This does not occur every time, but only in certain instances.
Note : In the video below (@ 4 seconds), when trying to drag the marker the map is moved instead. Also the onTap callback is not triggered when this happens.

Reproducing the Bug:

import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map/plugin_api.dart';
import 'package:flutter_map_dragmarker/dragmarker.dart';
import 'package:latlong2/latlong.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: FlutterMap(
            options: MapOptions(
              absorbPanEventsOnScrollables: false,
              center: LatLng(45.5231, -122.6765),
              zoom: 6.4,
            ),
            children: [
              TileLayer(
                  urlTemplate:
                      'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                  subdomains: const ['a', 'b', 'c']),
              DragMarkers(
                markers: [
                  DragMarker(
                    key: const ValueKey(1),
                    point: LatLng(45.2131, -122.6765),
                    width: 80.0,
                    height: 80.0,
                    offset: const Offset(0.0, -8.0),
                    builder: (ctx) => const Icon(Icons.location_on, size: 50),
                    onDragUpdate: (details, point) {
                      debugPrint("Dragged position: $point");
                    },
                    onTap: (point) {
                      debugPrint("Marker Tapped");
                    },
                    feedbackBuilder: (ctx) =>
                        const Icon(Icons.edit_location, size: 75),
                    feedbackOffset: const Offset(0.0, -18.0),
                    updateMapNearEdge: true,
                    nearEdgeRatio: 2.0,
                    nearEdgeSpeed: 1.0,
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Because flutter_map_dragmarker 4.1.3 depends on latlong2 ^0.8.0 and no versions of flutter_map_dragmarker match >4.1.3 <5.0.0, flutter_map_dragmarker ^4.1.3 requires latlong2 ^0.8.0. So, because app depends on both latlong2 ^0.9.0 and flutter_map_dragmarker ^4.1.3, version solving failed.

pub get:
Because flutter_map_dragmarker 3.1.0 depends on flutter_map ^2.0.0 and no versions of flutter_map_dragmarker match >3.1.0 <4.0.0, flutter_map_dragmarker ^3.1.0 requires flutter_map ^2.0.0.
So, because ......... depends on both flutter_map ^3.0.0 and flutter_map_dragmarker ^3.1.0, version solving failed.
pub get failed (1; So, because ......... depends on both flutter_map ^3.0.0 and flutter_map_dragmarker ^3.1.0, version solving failed.)
Process finished with exit code 1

Flutter Doctor:
C:\src\flutter\bin\flutter.bat doctor --verbose
[√] Flutter (Channel stable, 3.3.1, on Microsoft Windows [Version 10.0.22000.856], locale en-ZA)
• Flutter version 3.3.1 on channel stable at C:\src\flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 4f9d92fbbd (2 days ago), 2022-09-06 17:54:53 -0700
• Engine revision 3efdf03e73
• Dart version 2.18.0
• DevTools version 2.15.0
• No issues found!

Hello. Is it possible to create a button to center the marker in view of the map?
I manage to send it the coordinates for the center when loading my map but not to interact with it with a floatingActionButton ...
In any case, thank you for this very useful plugin !!

Not compatible with flutter_map v6.0.0

Because flutter_map_dragmarker 5.0.0 depends on flutter_map ^5.0.0 and no versions of flutter_map_dragmarker match >5.0.0 <6.0.0, flutter_map_dragmarker ^5.0.0 requires flutter_map ^5.0.0. So, because app depends on both flutter_map ^6.0.0 and flutter_map_dragmarker ^5.0.0, version solving failed.

I understand this repo is for Markers so may be off topic here but I'm looking for a way to drag Circle Layer objects. I can use Drag Marker to draw circles no problem, but they don't re-size when the map zooms in and out, like a Circle Layer does. Alternatively is there a way to re-size a Drag Marker as the map zooms in and out?

Due to the use of latlong2: ^0.8.0. this plugin is incompatible with flutter_map_tappable_polyline: any.

Because every version of flutter_map_dragmarker from git depends on latlong2 0.8.0 and flutter_map_tappable_polyline >=3.1.0 depends on latlong2 ^0.8.1, flutter_map_dragmarker from git is incompatible with flutter_map_tappable_polyline >=3.1.0.

Would it be possible to change the dependency to latlong2 0.8.1?

Bug

Whenever a rebuild is triggered while dragging a DragMarker it returns to its initial position. The example below shows two such dragMarkers. Although the position of Marker1 (black) should change on dragging, rebuilding the widget causes it to always return to its initial position. Maker2 (red) on the other hand is continuously updated on Drag update which allows for it to be moved around, but when it is dragged outside the border of the map it sometimes gets stuck even though its still being dragged.

Expected Output:

A rebuild should not cause any change in the position of a Drag Marker while it is being dragged.

Reproducing the Bug:

import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map/plugin_api.dart';
import 'package:flutter_map_dragmarker/dragmarker.dart';
import 'package:latlong2/latlong.dart';

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

class DragMarkerTest extends StatefulWidget {
  const DragMarkerTest({Key? key}) : super(key: key);

  @override
  DragMarkerTestState createState() => DragMarkerTestState();
}

class DragMarkerTestState extends State<DragMarkerTest> {
  LatLng _marker1Position = LatLng(44.1461, 9.6400);
  LatLng _marker2Position = LatLng(44.1461, 9.6412);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        floatingActionButton: Text(' Marker1 Position : $_marker1Position \n Marker2 Position : $_marker2Position'),
        body: FlutterMap(
          options: MapOptions(
            allowPanningOnScrollingParent: false,
            plugins: [
              DragMarkerPlugin(),
            ],
            center: _marker1Position,
            zoom: 18,
          ),
          layers: [
            TileLayerOptions(
              urlTemplate:
              'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
              subdomains: ['a', 'b', 'c'],
            ),
            DragMarkerPluginOptions(
              markers: [
                DragMarker(
                  point: LatLng(44.1461, 9.6400),
                  width: 80.0,
                  height: 80.0,
                  offset: const Offset(0.0, -8.0),
                  builder: (ctx) =>
                  const Icon(Icons.location_on, size: 50),
                  feedbackBuilder: (ctx) =>
                  const Icon(Icons.edit_location, size: 50),
                  feedbackOffset: const Offset(0.0, -8.0),
                  onDragUpdate: (details, point) {
                    setState(() {
                      _marker1Position = point;
                    });
                  },
                ),
                DragMarker(
                  point: _marker2Position,
                  width: 80.0,
                  height: 80.0,
                  offset: const Offset(0.0, -8.0),
                  builder: (ctx) =>
                  const Icon(Icons.location_on, size: 50, color : Colors.red),
                  feedbackBuilder: (ctx) =>
                  const Icon(Icons.edit_location, size: 50, color: Colors.red),
                  feedbackOffset: const Offset(0.0, -8.0),
                  onDragUpdate: (details, point) {
                    setState(() {
                      _marker2Position = point;
                    });
                  },
                )
              ],
            ),
          ],
        ),
      ),
    );
  }
}

pub get

Running "flutter pub get" in .....
Because flutter_map_dragmarker 2.0.0 depends on flutter_map ^1.0.0 and no versions of flutter_map_dragmarker match >2.0.0 <3.0.0, flutter_map_dragmarker ^2.0.0 requires flutter_map ^1.0.0.
So, because ..... depends on both flutter_map ^2.0.0 and flutter_map_dragmarker ^2.0.0, version solving failed.
pub get failed (1; So, because ..... depends on both flutter_map ^2.0.0 and flutter_map_dragmarker ^2.0.0, version solving failed.)
Process finished with exit code 1

Flutter Doctor:
[√] Flutter (Channel stable, 3.0.2, on Microsoft Windows [Version 10.0.22000.795], locale en-ZA)
• Flutter version 3.0.2 at C:\src\flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision cd41fdd495 (5 weeks ago), 2022-06-08 09:52:13 -0700
• Engine revision f15f824b57
• Dart version 2.17.3
• DevTools version 2.12.2
• No issues found!

Hello,

Thank you for this much needed feature.

I have implemented this in mobile app, but when I try to drag marker, almost all the times it is the map which moves, is there anything I need to make, to make marker easily draggable?

Thanks in advance!

Readme example is out of sync with main function. Took me a while to realize that the Readme is outdated.
Great job otherwise, works for me in the first attempts to integrate it.

Hi,
I was trying to implement it on my app, but apparently i can't because Anchor and custompoint are missing. Is it because i am on stable ? Is there any way to use it on stable version ? I really don't want to migrate now for a single feature as it's a very big project

Thanks to the author’s contribution, support for flutter_map's Children Widgets is added here

FlutterMap(
  options: MapOptions(
    allowPanningOnScrollingParent: false, /// IMPORTANT for dragging
    center: LatLng(45.5231, -122.6765),
    zoom: 6.4,
  ),
  children: [
    TileLayerWidget(
      options: TileLayerOptions(
        urlTemplate:
            'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
        subdomains: ['a', 'b', 'c'],
        maxZoom: 19,
      ),
    ),
    DragMarkerPluginWidget(
      options: DragMarkerPluginOptions(
        markers: [
          DragMarker(
            point: LatLng(45.2131, -122.6765),
            width: 80.0,
            height: 80.0,
            offset: const Offset(0.0, -8.0),
            builder: (ctx) {
              return const Icon(Icons.location_on, size: 50);
            },
            onDragStart: (details, point) =>
                debugPrint("Start point $point"),
            onDragEnd: (details, point) =>
                debugPrint("End point $point"),
            onDragUpdate: (details, point) {},
            onTap: (point) {
              debugPrint("on tap");
            },
            onLongPress: (point) {
              debugPrint("on long press");
            },
            feedbackBuilder: (ctx) {
              return const Icon(Icons.edit_location, size: 75);
            },
            feedbackOffset: const Offset(0.0, -18.0),
            updateMapNearEdge: true,
            nearEdgeRatio: 2.0,
            nearEdgeSpeed: 1.0,
          ),
          DragMarker(
            point: LatLng(45.535, -122.675),
            width: 80.0,
            height: 80.0,
            builder: (ctx) {
              return const Icon(Icons.location_on, size: 50);
            },
            onDragEnd: (details, point) {
              debugPrint('Finished Drag $details $point');
            },
            updateMapNearEdge: false,
          )
        ],
      ),
    )
  ],
),

see more: https://github.com/jiazeh/flutter_map_dragmarker

I couldn't find this plugin on https://pub.dev/packages.
Should I copy the files into my project?

I can change the marker anchorPos and the marker is always anchored in the center. I can see that the offset is handled in the dragmarker.dart, but it makes no difference. Any idea of how to get the anchorPos to be utilized? I am trying to add a rotation element to the draggable marker and I need the origin to be at the bottom center.

Previously I implemented my draggable marker on my own. So I was able to react on the tap to open a popup using the PopupMarker plugin.

Since their update from v3 to v4 the onPanUpdate is not called anymore (funny enough: all other events still work as onVerticalDragUpdate).

I tried to implement the onVerticalDragUpdate and onHorizontalDragUpdate instead as you did, but it worked not as expected. I only was able to drag the marker in exact horizontal and vertical direction. Reading your code did not make it clear to me how you bypassed this behaviour to enable panning in all directions, unfortunately. (Moreover it seems to me more like a dirty workaround to use these two events instead the plain onPanUpdate, which worked quite well all the time...)

However, I tried to integrate your plugin directly but I am not sure how to keep the popup functionality because both plugins are different kind of layers...

Do you see a way around this?

Once I know how to include this plugin into my project (#3) I will need it to be sound null safe.

As the project is not very big I could give it a go myself. But beware: I am a dart/flutter noob.

@ibrierley What do you think?

the newest version of FLutter_Map (2.2.0) no longer has the following parameters on MapOptions :

• allowPanningOnScrollingParent
• plugins

with this being the case, how are we supposed to implement dragmarkers plugin with this version?

Not compatible with flutter_map v7.0.0

This message has been sent to multiple plugin authors, so it is not personalised

As part of fleaflet/flutter_map#992 & fleaflet/flutter_map#927 (reply in thread), I (a documentation author) am contacting plugin authors to ensure the information about this plugin on the new documentation is correct; or alternatively, if this plugin is not yet on the existing list, to check whether you would like to add your plugin to the new documentation.

I would also like you to check you conform to these new rules:

• this plugin is available via a pub.dev installation to make it easier for developers - if your plugin does not currently have a pub.dev page, please add one or let me know otherwise,
• the plugin documentation includes enough information for installation and basic setup/functionality,
• the plugin includes a runnable example and/or screenshots,
• the plugin description contains the words ' - IN BETA' after the author link on the same line if your plugin is in beta,

Currently I have copied over the existing plugin descriptions, and you can see these here: https://flutter-map.vercel.app/plugins/list. Please note that this documentation is currently unapproved and should not be used unless otherwise directed, as some information may be incorrect or missing, or might change in the future. There is no ETA at the moment, but things seem to be moving along.

Should you wish for the description to remain the same as current on the page linked above, you do not have to reply, you can close this issue.

If you wish to change any information, please leave this issue open and add your reply as a comment.

flutter_map maintainers do not take any responsibility for this message, I am the sole author.

On behalf of myself and the flutter_map community thank you for your excellent plugin :).

I'm facing the same issue #25. None of those solution work for me.. absorbPanEventsOnScrollables no longer available. Any update on this issue?

As far as I can tell, you can't update the position of a marker that already exists. Is this correct?
If so, I'll try to implement it in a good way and make a PR.

I use two layers, MarkerLayer of flutter_map and DragMarkers of flutter_map_dragmarker, as shown in the code below.

FlutterMap(
  ...
  children: [
    ...
    MarkerLayer(markers: markers),
    DragMarkers(markers: dragMarkers,),
    ...
  ],
  ...
)

I have given these arguments, markers and dragMarkers, points with the same latitude and longitude, but in the actual display, the two points are displayed misaligned as shown in the figure.
(The blue icon is element of markers and the purple icon is element of dragMarkers.)

I thought about adjusting the offset of dragMarker to correct the misalignment, but this parameter does not seem to work (i.e., changing the offset value from (0, 0) to (10, 10), for example, does not change the position of the icon).

Is this a bug in the library? Or is there any way to deal with this?
Now I'm using version ^6.0.0.

Hello. I'm developing a Flutter web app and have encountered a serious bug when using flutter_map_dragmarker v4.0.2 and flutter_map 3.0.0. When I'm dragging the map sometimes and randomly dragmarkers will disappear from the map. When I drag back to where I was they will re-appear. Don't know why this is happening, the dragmarker that disappears isn't deleted, it is still there, it just disappears from the map. I tried using different icon for the drag marker but the issue persists. This occurs both on a desktop and on a mobile. Here are some screenshots depicting the bug:

Using a Container with BoxDecoration and with text the number of the marker on a mobile phone:

How FlutterMap and drag markers are used in my Scafold:

body: Stack(
	children: <Widget>[
	  FlutterMap(
		options: MapOptions(
			absorbPanEventsOnScrollables: false,
			center: LatLng(XX.XX, YY.YY),
			zoom: 8.5,
			maxZoom: 17.0,
			onTap: (tapPosition, location) => addMarker(location),
		),
		nonRotatedChildren: [
			AttributionWidget.defaultWidget(
				source: 'OpenStreetMap contributors',
				onSourceTapped: null,
			),
		],
		children: [
			TileLayer(
				urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
				userAgentPackageName: 'com.antoniskes.tsp_app',
			),
			DragMarkers(
			  markers: Data.locations,
			)
		],
	  ),
),

where locations are stored and the addMarker method:

  class Data{
	  static List<DragMarker> locations = List.empty(growable: true);
	  static int locationsCount = 0;
  }

void _addLocation(LatLng latLng){
	String markerText = Data.locationsCount.toString();
	TextStyle markerTextStyle = const TextStyle(fontSize: 26, fontWeight: FontWeight.bold, color: Colors.white);
	Color markerColor = markerText == '0' ? Colors.red : Colors.blue;

	Container markerIcon = Container(
	width: 60,
	height: 60,
	decoration: BoxDecoration(
	  borderRadius: BorderRadius.circular(32.0),
	  color: markerColor,
	),
	child: Center(
	  child: Text(
		markerText,
		style: markerTextStyle,
		textAlign: TextAlign.center,
	  ),
	),
	);

	DragMarker dragMarker = DragMarker(
	point: latLng,
	width: 60,
	height: 60,
	builder: (context) => markerIcon
	);
	Data.locations.add(dragMarker);
	Data.locationsCount++;

	setState(() {});
}