Search code examples
flutterdartlocationfluttermap

Why does centering a flutter_map not work?


I am using flutter_map in a form in my Flutter app and centering the map does not work. The map just shows a piece of the ocean. That's because my fallback value (coordinates) is 0, 0. The marker then get's updated to the correct position from value[0] and value1, but the center isn't updated.

new FlutterMap(
            options: new MapOptions(
              // TODO: Center doesn't refresh
              // https://github.com/fleaflet/flutter_map/issues/10
              center: new latlong.LatLng(value[0], value[1]),
              zoom: 13.0,
            ),
            layers: [
              new TileLayerOptions(urlTemplate: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", subdomains: ['a', 'b', 'c']),
              new MarkerLayerOptions(
                markers: [
                  new Marker(
                    width: 20.0,
                    height: 20.0,
                    point: new latlong.LatLng(value[0], value[1]),
                    builder: (ctx) => new Container(
                      child: Icon(
                        Icons.location_on,
                        color: primaryColor,
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),

I have no idea why center: new latlong.LatLng(value[0], value[1]), does not work. Can someone help me with that? Here is the Flutter package: https://pub.dev/packages/flutter_map


Solution

  • The parameter 'center' will be used only on start, it's not updated.

    You must use a controller to move to your new position.

    https://pub.dev/documentation/flutter_map/latest/flutter_map/MapController-class.html

    Initialize your controller and add it to your FlutterMap

    FlutterMap(controller:myController)