Flutter 'LatLng' isn't defined

user_192910 0
Viewed 11122

I am making my first baby steps with Leaflet in Flutter, so patience and URLs of tutorials, etc, are welcome.

Every piece of sample code that I can find gives me this error:

The method 'LatLng' isn't defined for the type '_MyHomePageState'. Try correcting the name to the name of an existing method, or defining a method named 'LatLng'.

See for instance the answer to How to setCenter() leaflet map in flutter,which has some very straightforward code.

This part of the code 

  new FlutterMap(
      mapController: _mapController,
      options: MapOptions(
        minZoom: _minzoom,
        maxZoom: _maxzoom,
        center: LatLng(mylatitude,mylongitude),    <=== error here
      ),

gives me the error.

I have had the same error with several code samples, copied from the internet. Could it be because I am using the latest version of the package, and those are old posts?

I am using 

dependencies:
  flutter_map: ^0.9.0

As per the install docs, but perhaps all the demos I found used something earlier?

I have the same problem with the code from https://github.com/johnpryan/flutter_map.

It must be something very basic, but, as I said, I am just starting out. Despite familiarity with Leaflet in AngularJs, I am stumped.

What's my problem, and where can I find a good, in-depth, full-featured, tutorial?

[Update] I have completely uninstalled Visual Studio Code (using Revo Uninstaller Pro, which thoroughly scours the registry & file system for left overs. After reinstalling VSC and adding only the Flutter plugin, I still get the problem.

I also installed Android Studio and only the Flutter plugin, with the same result :-(

leaflet flutter visual-studio-code
4 Answers

Import Latlong like below:

import "package:latlong/latlong.dart" as latLng;

Now you can call Latlong with latLng alias


new FlutterMap(
      mapController: _mapController,
      options: MapOptions(
        minZoom: _minzoom,
        maxZoom: _maxzoom,
        center: latLng.LatLng(mylatitude,mylongitude),   
      ),

I have similar project which implements MapBox map which is similar to Leaflet map, do check out, here is the link:

https://github.com/TheKetan2/covid19_flutter_app

user_56691200

For flutter_map 0.13.1 and above, this line should work

import 'package:latlong2/latlong.dart' as latLng;

You can then call LatLng using the alias,

FlutterMap(
options: MapOptions(
  center: latLng.LatLng(51.5, -0.09),
  zoom: 13.0,
),
layers: [
  TileLayerOptions(
    urlTemplate: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
    subdomains: ['a', 'b', 'c']
  ),
  MarkerLayerOptions(
    markers: [
      Marker(
        width: 80.0,
        height: 80.0,
        point: latLng.LatLng(51.5, -0.09),
        builder: (ctx) =>
        Container(
          child: FlutterLogo(),
        ),
      ),
    ],
  ),
],

);

user_110260550

dependencies: google_maps_flutter: ^2.1.8 flutter_polyline_points: ^1.0.0

Add these packages properly.

user_112136810

The latlong2 package makes it more straight forward.

LatLng instead of latLng.LatLng reduces the risk of human error. simply add:

dependencies:
  latlong2: ^0.8.0

and

import 'package:latlong2/latlong.dart';

to get you started, plus you also get these options:

import 'package:latlong2/latlong/Circle.dart';
import 'package:latlong2/latlong/Distance.dart';
import 'package:latlong2/latlong/LatLng.dart';
import 'package:latlong2/latlong/LengthUnit.dart';
import 'package:latlong2/latlong/Path.dart';
import 'package:latlong2/latlong/calculator/Haversine.dart';
import 'package:latlong2/latlong/calculator/Vincenty.dart';
import 'package:latlong2/latlong/interfaces.dart';
import 'package:latlong2/spline.dart';
import 'package:latlong2/spline/CatmullRomSpline.dart';
user_32365220
Related