flutter_map
A versatile mapping package for Flutter. Simple and easy to learn, yet completely customizable and configurable, it's the best choice for mapping in your Flutter app.
Why Choose flutter_map?
See why you should use flutter_map for your project:
Code Demo
Setting up an interactive and map is simpler than making your lunch-time coffee! It can be accomplished in just under 30 lines and a minute or two to install.
This code snippet demonstrates everything you need for a simple map (in under 30 lines!), but of course, FM is capable of much more than just this, and you could find yourself lost in the many options available and possibilities opened!
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
@override
Widget build(BuildContext context) {
return FlutterMap(
options: MapOptions(
initialCenter: LatLng(51.509364, -0.128928), // Center the map over London
initialZoom: 9.2,
),
children: [
TileLayer( // Display map tiles from any source
urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png', // OSMF's Tile Server
userAgentPackageName: 'com.example.app',
// And many more recommended properties!
),
RichAttributionWidget( // Include a stylish prebuilt attribution widget that meets all requirments
attributions: [
TextSourceAttribution(
'OpenStreetMap contributors',
onTap: () => launchUrl(Uri.parse('https://openstreetmap.org/copyright')), // (external)
),
// Also add images...
],
),
],
);
}
Get Help
Not quite sure about something? No worries, we're here to help!
Check the FAQs below, and double check the documentation
Then, for bug reports & feature requests: check for previous issues, then ask in GitHub Issues
Then, for support & everything else: ask in flutter_map Discord server or GitHub Discussions
FAQs
We get quite a lot of similar questions, so please check if your question is here before you ask!
How Does It Work?Last updated
Was this helpful?