mapbox_gl 0.0.5

  • Readme
  • Changelog
  • Example
  • Installing
  • 93

Flutter Mapbox GL Native #

Please note that this project is community driven and is not an official Mapbox product. We welcome feedback and contributions.

This Flutter plugin for mapbox-gl-native enables embedded interactive and customizable vector maps inside a Flutter widget by embedding Android and iOS views.

screenshot.png

Install #

This project is available on pub.dartlang, follow the instructions to integrate a package into your flutter application.

Running example app #

  • Install Flutter and validate its installation with flutter doctor
  • Clone this repository with git clone git@github.com:mapbox/flutter-mapbox-gl.git
  • Run the app with cd flutter_mapbox/example && flutter run

Mapbox Access Token

This project uses Mapbox vector tiles, which requires a Mapbox account and a Mapbox access token. Obtain a free access token on your Mapbox account page.

Android

Add Mapbox read token value in the application manifest android/app/src/main/AndroidManifest.xml:

  <application ...
    <meta-data android:name="com.mapbox.token" android:value="YOUR_TOKEN_HERE" />

iOS

Add these lines to your Info.plist

<key>io.flutter.embedded_views_preview</key>
<true/>
<key>MGLMapboxAccessToken</key>
<string>YOUR_TOKEN_HERE</string>

Supported API #

FeatureAndroidiOS
Style
Camera
Gesture
User Location
Symbol
Circle
Line
Fill

Offline Sideloading #

Support for offline maps is available by "side loading" the required map tiles and including them in your assets folder.

  • Create your tiles package by following the guide available here.

  • Place the tiles.db file generated in step one in your assets directory and add a reference to it in your pubspec.yml file.

   assets:
     - assets/cache.db
  • Call installOfflineMapTiles when your application starts to copy your tiles into the location where Mapbox can access them. NOTE: This method should be called before the Map widget is loaded to prevent collisions when copying the files into place.
    try {
      await installOfflineMapTiles(join("assets", "cache.db"));
    } catch (err) {
      print(err);
    }

Documentation #

This README file currently houses all of the documentation for this Flutter project. Please visit mapbox.com/android-docs if you'd like more information about the Mapbox Maps SDK for Android and mapbox.com/ios-sdk for more information about the Mapbox Maps SDK for iOS.

Getting Help #

  • Need help with your code?: Look for previous questions on the #mapbox tag — or ask a new question.
  • Have a bug to report? Open an issue. If possible, include a full log and information which shows the issue.
  • Have a feature request? Open an issue. Tell us what the feature should do and why you want the feature.

Sample code #

This repository's example library is currently the best place for you to find reference code for this project.

Contributing #

We welcome contributions to this repository!

If you're interested in helping build this Mapbox/Flutter integration, please read the contribution guide to learn how to get started.

0.0.5, December 21, 2019 #

  • iOS support for annotation extensions (circle, symbol, line)
  • Update SDK to 8.5.0 (Android) and 5.5.0 (iOS)
  • Integrate style loaded callback api
  • Add Map click event (iOS)
  • Cache management API (Android/iOS)
  • Various fixes to showing user location and configurations (Android/iOS)
  • Last location API (Android)
  • Throttle max FPS of user location component (Android)
  • Fix for handling permission handling of the test application (Android)
  • Support for loading symbol images from assets (iOS/Android)

v0.0.4, Nov 2, 2019 #

  • Update SDK to 8.4.0 (Android) and 5.4.0 (iOS)
  • Add support for sideloading offline maps (Android/iOS)
  • Add user tracking mode (iOS)
  • Invert compassView.isHidden logic (iOS)
  • Specific swift version (iOS)

v0.0.3, Mar 30, 2019 #

  • Camera API (iOS)
  • Line API (Android)
  • Update codebase to AndroidX
  • Update Mapbox Maps SDK for Android to v7.3.0

v0.0.2, Mar 23, 2019 #

  • Support for iOS
  • Migration to embedded Android and iOS SDK View system
  • Style URL API
  • Style JSON API (Android)
  • Gesture support
  • Gesture restrictions (Android)
  • Symbol API (Android)
  • Location component (Android)
  • Camera API (Android)

v0.0.1, May 7, 2018 #

  • Initial Android surface rendering POC

example/lib/main.dart

// Copyright 2018 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

import 'package:flutter/material.dart';
import 'package:location/location.dart';

import 'animate_camera.dart';
import 'line.dart';
import 'map_ui.dart';
import 'move_camera.dart';
import 'page.dart';
import 'place_circle.dart';
import 'place_symbol.dart';
import 'scrolling_map.dart';

final List<Page> _allPages = <Page>[
  MapUiPage(),
  AnimateCameraPage(),
  MoveCameraPage(),
  PlaceSymbolPage(),
  LinePage(),
  PlaceCirclePage(),
  ScrollingMapPage(),
];

class MapsDemo extends StatelessWidget {
  void _pushPage(BuildContext context, Page page) async {
    final location = Location();
    final hasPermissions = await location.hasPermission();
    if (!hasPermissions) {
      await location.requestPermission();
    }

    Navigator.of(context).push(MaterialPageRoute<void>(
        builder: (_) => Scaffold(
              appBar: AppBar(title: Text(page.title)),
              body: page,
            )));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('MapboxMaps examples')),
      body: ListView.builder(
        itemCount: _allPages.length,
        itemBuilder: (_, int index) => ListTile(
          leading: _allPages[index].leading,
          title: Text(_allPages[index].title),
          onTap: () => _pushPage(context, _allPages[index]),
        ),
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(home: MapsDemo()));
}

Use this package as a library

1. Depend on it

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


dependencies:
  mapbox_gl: ^0.0.5

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

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

3. Import it

Now in your Dart code, you can use:


import 'package:mapbox_gl/mapbox_gl.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
92
Health:
Code health derived from static analysis. [more]
99
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
90
Overall:
Weighted score of the above. [more]
93
Learn more about scoring.

We analyzed this package on Mar 27, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.6
  • Flutter: 1.12.13+hotfix.8

Health suggestions

Fix lib/src/bitmap.dart. (-0.50 points)

Analysis of lib/src/bitmap.dart reported 1 hint:

line 48 col 11: The declaration '_toJson' isn't referenced.

Fix lib/src/controller.dart. (-0.50 points)

Analysis of lib/src/controller.dart reported 1 hint:

line 109 col 13: The value of the field '_id' isn't used.

Format lib/mapbox_gl.dart.

Run flutter format to format lib/mapbox_gl.dart.

Fix additional 6 files with analysis or formatting issues.

Additional issues in the following files:

  • lib/src/camera.dart (Run flutter format to format lib/src/camera.dart.)
  • lib/src/circle.dart (Run flutter format to format lib/src/circle.dart.)
  • lib/src/line.dart (Run flutter format to format lib/src/line.dart.)
  • lib/src/mapbox_map.dart (Run flutter format to format lib/src/mapbox_map.dart.)
  • lib/src/symbol.dart (Run flutter format to format lib/src/symbol.dart.)
  • lib/src/ui.dart (Run flutter format to format lib/src/ui.dart.)

Maintenance suggestions

Package is pre-v0.1 release. (-10 points)

While nothing is inherently wrong with versions of 0.0.*, it might mean that the author is still experimenting with the general direction of the API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.68.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.8
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8