flutter_map 0.1.4

  • README.md
  • CHANGELOG.md
  • Example
  • Installing
  • Versions
  • 94

flutter_map

Experimental

A flutter implementation of leaflet.

Video

Screenshot

Usage

Add flutter_map to your pubspec:

dependencies:
  flutter_map: ^0.0.1

Configure the map using MapOptions and layer options:

  Widget build(BuildContext context) {
    return new FlutterMap(
      options: new MapOptions(
        center: new LatLng(51.5, -0.09),
        zoom: 13.0,
      ),
      layers: [
        new TileLayerOptions(
          urlTemplate: "https://api.tiles.mapbox.com/v4/"
              "{id}/{z}/{x}/{y}@2x.png?access_token={accessToken}",
          additionalOptions: {
            'accessToken': '<PUT_ACCESS_TOKEN_HERE>',
            'id': 'mapbox.streets',
          },
        ),
        new MarkerLayerOptions(
          markers: [
            new Marker(
              width: 80.0,
              height: 80.0,
              point: new LatLng(51.5, -0.09),
              builder: (ctx) =>
              new Container(
                child: new FlutterLogo(),
              ),
            ),
          ],
        ),
      ],
    );
  }

see the flutter_map_example/ folder for a working example app.

Mapbox tiles

You can use map tiles from a number of free and paid map suppliers, or you can host your own map tiles.

The example uses OpenStreetMap tiles, which are free but can be slow.

Use TileLayerOptions to configure other tile providers, such as mapbox:

new TileLayerOptions(
  urlTemplate: "https://api.mapbox.com/v4/"
      "{id}/{z}/{x}/{y}@2x.png?access_token={accessToken}",
  additionalOptions: {
    'accessToken': '<PUT_ACCESS_TOKEN_HERE>',
    'id': 'mapbox.streets',
  },
),

To use, you'll need a mapbox key:

  1. Create a mapbox account to get an api key
  2. open leaflet_flutter_example/lib/main.dart and paste the API key into the additionalOptions map.

Offline maps

Follow this guide to grab offline tiles<br> Once you have your map exported to .mbtiles, you can use mbtilesToPng to unpack into /{z}/{x}/{y}.png. Move this to Assets folder and add Asset directories to pubspec.yaml. Minimum required fields for offline maps are:

new FlutterMap(
  options: new MapOptions(
    center: new LatLng(56.704173, 11.543808),
    minZoom: <offline map minimum zoom>,
    maxZoom: <offline map maximum zoom>,
    zoom: 13.0,
    swPanBoundary: LatLng(56.6877, 11.5089),
    nePanBoundary: LatLng(56.7378, 11.6644),
  ),
  layers: [
    new TileLayerOptions(
      offlineMode: true,
      maxZoom: <offline map maximum zoom>,
      urlTemplate: "assets/offlineMap/{z}/{x}/{y}.png",
    ),
  ],
),

Make sure PanBoundaries are within offline map boundary to stop missing asset errors.<br> See the flutter_map_example/ folder for a working example.<br>

Features

This package is under active development. The following roadmap is focused on the features we require at AppTree. We welcome any contributions for items both on and off of the roadmap.

  • [x] Inline maps
  • [x] Pinch to zoom
  • [x] Panning
  • [x] Markers
  • [ ] Package structure cleanup
  • [ ] Improve pinch to zoom ( zoom directly to focal point )
  • [x] Zooming removes too many tiles from other levels
  • [x] Improve image fetching & caching
  • [x] UI Settings support ( disable pan/zoom etc.)
  • [ ] Current location support
  • [ ] Documentation
  • [ ] Polylines
  • [x] Offline map support

[0.1.4] - 9/24/2018

  • Polygon Support (#118)

Thanks to @JulianBerger for this release!

[0.1.3] - 9/18/2018

  • fix identical map position callbacks (#111)
  • Prune tiles bug fix (#112)

Thanks to @IhorKlimov and @tomwyr for this release!

[0.1.2] - 8/21/2018

  • Added polyline customisation options (#94)
  • Expose map bounds (#99)
  • Added onTap example (#103)
  • route bugfix (#104)
  • options is now required (#105)
  • Project refactor and changes to offline map #85

Thanks to @LJaraCastillo, @ubilabs, @xqwzts, @vinicentus, and @lsaudon for this release!

[0.1.0] - 8/21/2018

  • Set Dart SDK to ">=2.0.0 <3.0.0"

[0.0.11] - 8/2/2018

  • upgrade to latlong from 0.4.0 to 0.5.3

[0.0.11] - 7/31/2018

  • fix LICENSE spelling error
  • double-tap to zoom (#62)
  • Fix polyline overlap issue (#67)
  • Offline map example (#53)

Thanks to contributors @alfanhui, @avioli, @solid-software, and @vinicentus for this release!

[0.0.10] - 6/7/2018

  • update .gitignore (#40)
  • Applied constraints to zoom on gesture update if min or max options set (#46)
  • Pan Boundary with 2 new MapOptions variables: swPanBoundary and nePanBoundary (#47)
  • OfflineMode bool variable added to TileLayerOptions for AssetImage Widget use (#48)
  • remove quiver dep (#32)

Thanks to contributors @avioli, @bcko, and @alfanhui for this release!

[0.0.9] - 5/31/2018

  • add LatlngBounds.contains, avoid rendering out-of-view markers in MarkerLayer

[0.0.8] - 5/31/2018

  • bug: rendering far-away tiles was causing a GPU crash on the simulator. add tile pruning to TileLayer

[0.0.7] - 5/29/2018

  • bug: TileLayer not listening to onMoved events from MapController

[0.0.6] - 5/11/2018

  • fitBounds, onPositionChanged (#39)

[0.0.5] - 3/11/2018

  • make tile background customizable (#36)
  • use transparent_image as placeholder image (#37)

[0.0.4] - 4/18/2018

  • Add marker anchor support (#27, #30)

[0.0.3] - 4/18/2018

  • fixed Dart 2.0 type errors (#23)
  • add MapController API (#24 + #25)

[0.0.2] - 2/21/2018

  • subdomain support
  • move gesture detection into map widget
  • improved tile layer support
  • improved examples
  • Polyline layers
  • fix marker redraw on map rotation

[0.0.1] - 2/5/2018

  • inital release

example/lib/main.dart

import 'package:flutter/material.dart';
import './pages/esri.dart';
import './pages/home.dart';
import './pages/map_controller.dart';
import './pages/animated_map_controller.dart';
import './pages/marker_anchor.dart';
import './pages/plugin_api.dart';
import './pages/polyline.dart';
import './pages/tap_to_add.dart';
import './pages/offline_map.dart';
import './pages/on_tap.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Map Example',
      theme: new ThemeData(
        primarySwatch: mapBoxBlue,
      ),
      home: new HomePage(),
      routes: <String, WidgetBuilder>{
        TapToAddPage.route: (context) => new TapToAddPage(),
        EsriPage.route: (context) => new EsriPage(),
        PolylinePage.route: (context) => new PolylinePage(),
        MapControllerPage.route: (context) => new MapControllerPage(),
        AnimatedMapControllerPage.route: (context) => new AnimatedMapControllerPage(),
        MarkerAnchorPage.route: (context) => new MarkerAnchorPage(),
        PluginPage.route: (context) => new PluginPage(),
        OfflineMapPage.route: (context) => new OfflineMapPage(),
        OnTapPage.route: (context) => new OnTapPage(),
      },
    );
  }
}

// Generated using Material Design Palette/Theme Generator
// http://mcg.mbitson.com/
// https://github.com/mbitson/mcg
const int _bluePrimary = 0xFF395afa;
const MaterialColor mapBoxBlue = const MaterialColor(
  _bluePrimary,
  const <int, Color>{
    50: const Color(0xFFE7EBFE),
    100: const Color(0xFFC4CEFE),
    200: const Color(0xFF9CADFD),
    300: const Color(0xFF748CFC),
    400: const Color(0xFF5773FB),
    500: const Color(_bluePrimary),
    600: const Color(0xFF3352F9),
    700: const Color(0xFF2C48F9),
    800: const Color(0xFF243FF8),
    900: const Color(0xFF172EF6),
  },
);

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  flutter_map: ^0.1.4

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter packages get

Alternatively, your editor might support flutter packages get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_map/flutter_map.dart';
  
Version Uploaded Documentation Archive
0.1.4 Sep 24, 2018 Go to the documentation of flutter_map 0.1.4 Download flutter_map 0.1.4 archive
0.1.3 Sep 18, 2018 Go to the documentation of flutter_map 0.1.3 Download flutter_map 0.1.3 archive
0.1.2 Sep 14, 2018 Go to the documentation of flutter_map 0.1.2 Download flutter_map 0.1.2 archive
0.1.1 Sep 4, 2018 Go to the documentation of flutter_map 0.1.1 Download flutter_map 0.1.1 archive
0.1.0 Aug 21, 2018 Go to the documentation of flutter_map 0.1.0 Download flutter_map 0.1.0 archive
0.0.11+1 Aug 2, 2018 Go to the documentation of flutter_map 0.0.11+1 Download flutter_map 0.0.11+1 archive
0.0.11 Jul 31, 2018 Go to the documentation of flutter_map 0.0.11 Download flutter_map 0.0.11 archive
0.0.10 Jun 7, 2018 Go to the documentation of flutter_map 0.0.10 Download flutter_map 0.0.10 archive
0.0.9 May 31, 2018 Go to the documentation of flutter_map 0.0.9 Download flutter_map 0.0.9 archive
0.0.8+1 May 31, 2018 Go to the documentation of flutter_map 0.0.8+1 Download flutter_map 0.0.8+1 archive

All 23 versions...

Popularity:
Describes how popular the package is relative to other packages. [more]
97
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
80
Overall:
Weighted score of the above. [more]
94
Learn more about scoring.

We analyzed this package on Oct 10, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.0.0
  • pana: 0.12.4
  • Flutter: 0.9.5

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Health suggestions

Fix lib/src/layer/polygon_layer.dart. (-0.50 points)

Analysis of lib/src/layer/polygon_layer.dart reported 1 hint:

line 129 col 8: The function '_dist' isn't used.

Format lib/src/core/center_zoom.dart.

Run flutter format to format lib/src/core/center_zoom.dart.

Format lib/src/core/point.dart.

Run flutter format to format lib/src/core/point.dart.

Fix additional 4 files with analysis or formatting issues.

Additional issues in the following files:

  • lib/src/geo/crs/crs.dart (Run flutter format to format lib/src/geo/crs/crs.dart.)
  • lib/src/layer/layer.dart (Run flutter format to format lib/src/layer/layer.dart.)
  • lib/src/layer/polyline_layer.dart (Run flutter format to format lib/src/layer/polyline_layer.dart.)
  • lib/src/layer/tile_layer.dart (Run flutter format to format lib/src/layer/tile_layer.dart.)

Maintenance suggestions

The description is too short. (-20 points)

Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0 <3.0.0
flutter 0.0.0
latlong ^0.6.1 0.6.1
transparent_image ^0.1.0 0.1.0
tuple ^1.0.1 1.0.2
Transitive dependencies
ansicolor 1.0.2
collection 1.14.11
console_log_handler 1.1.3
intl 0.15.7
logging 0.11.3+2
matcher 0.12.4
meta 1.1.6
path 1.6.2
quiver 2.0.0+1
sky_engine 0.0.99
stack_trace 1.9.3
typed_data 1.1.6
validate 1.7.0
vector_math 2.0.8