Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter 'LatLng' isn't defined

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 :-(

like image 228
Mawg says reinstate Monica Avatar asked Jun 07 '20 10:06

Mawg says reinstate Monica


2 Answers

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(),
        ),
      ),
    ],
  ),
],

);

like image 81
Vince Calo Avatar answered Sep 29 '22 03:09

Vince Calo


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

like image 43
Ketan Ramteke Avatar answered Sep 29 '22 01:09

Ketan Ramteke