Update map center

[zigapk]

Hi there,

first of all, thank you for such a great widget that enabled our transition to Flutter. I have a question/feature request: I've integrated user's position into the map as a marker (which seems to work fine). However, I'd like to have have a button for moving the map's center to the the current user's location. But simply setting map's center won't work. So I'm interested in any suggestions about the options I have (might include modifying flutter_map code).

Thank you for your support,
Ziga Patacko Koderman

[johnpryan]

Good catch!

Yes this is definitely something we want to support. I am thinking the best API for this is to optionally include a "controller" (similar to a TextField's TextEditingController) that allows users to programmatically change things that are stateful, like the current zoom level and position.

This is opposed to things stateless things like markers, which can be updated with a setState() on the parent widget.

[avioli]

I've forked the plugin and exposed the MapState (which in Flutter lingo should be called a controller) and then:

...
class _LocationPickerDialogState extends State<_LocationPickerDialog> {
  MapState _mapState;

  Location _location;
  double _zoom;

  Location get center {
    LatLng center = _mapState.center;
    if (center == null) return null;
    return new Location(
      latitude: center.latitude,
      longitude: center.longitude,
    );
  }

  @override
  void initState() {
    super.initState();

    final location = widget.initialLocation ?? Location.zero;

    _mapState = new MapState(new MapOptions(
      center: location.latLng,
      zoom: _zoom,
    ));

    _mapState.onMoved.listen((_) {
      final location = center;
      if (location != null) {
        setState(() {
          _location = center;
        });
      }
    });
  }

  Widget _buildPicker() {
    return new FlutterMap(
      mapState: _mapState,
      layers: [
        new TileLayerOptions(
          urlTemplate: widget.urlTemplate,
          additionalOptions: widget.additionalOptions,
        ),
        _getMarkerLayerOptions(),
      ],
    );
  }
...

This way I can query all the MapState props or even move the map programatically - win win.

Awesome widget guys.

[johnpryan]

pull requests welcome!

[avioli]

https://github.com/apptreesoftware/flutter_map/pull/24

[johnpryan]

closed by #25 - thanks for the help!

[gimox]

please add a example or documentation!!!

[johnpryan]

@gimox can you file a separate issue for documentation? thanks!

[gimox]

Ok

[zhen1991]

Hi !
I have a question about zooming in and zooming out the flutter map !
I create two button one for zooming in and another for zooming out and im using
mapController.move(LatLng(lat,lng),zoom);
and its working fine but every time i click the button so it will zoomin to the ceter and zoom out to the cenetr too!
So i am wondering if there a method only doing zoom function with out latlng??
thnx for helping:)

[gimox]

try this:

 final MapController controller;
...

 FlutterMap(
                mapController: controller,
...

controller.move(controller.center, controller.zoom + 1); // zoom in
controller.move(controller.center, controller.zoom - 1); // zoom out