Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Web implementation #223

Merged
merged 28 commits into from
Jun 3, 2020
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
b6d07be
migrate to platform interface
andrea689 Feb 12, 2020
11d8435
fix lint analysis
andrea689 Feb 12, 2020
937491f
update example project to support web
andrea689 Feb 13, 2020
ee8f0ab
remove test from example
andrea689 Feb 13, 2020
1cc4492
add web implementation of:
andrea689 Feb 21, 2020
ad1a0ac
add matchMapLanguageWithDeviceDefault
andrea689 Mar 3, 2020
147b111
add SymbolManager
andrea689 Mar 6, 2020
a7a1794
add lineManager and circleManager
andrea689 Mar 6, 2020
14fdf1d
fix ios build
andrea689 Mar 6, 2020
d2479ec
fix path of symbol_manager
andrea689 Mar 12, 2020
82d88b4
add queryRenderedFeatures, queryRenderedFeaturesInRect and onMapClick…
andrea689 Mar 12, 2020
e71255c
add onCameraMoveStarted, onCameraMove and onCameraIdle
andrea689 Mar 12, 2020
23e80c4
add updateMyLocationTrackingMode
andrea689 Mar 13, 2020
202d344
add setCompassEnabled
andrea689 Mar 13, 2020
0c0e257
update mapbox_gl_dart dependency
andrea689 Mar 13, 2020
ac3b48f
update Supported API
andrea689 Mar 13, 2020
8daf3df
Merge branch 'master' into av-web
andrea689 Mar 13, 2020
e6cdd3f
fix onPlatformViewCreated callbacks
andrea689 Mar 28, 2020
5883c13
update mapbox_gl_dart to 0.1.4
andrea689 Apr 2, 2020
c7e364e
Merge branch 'master' into av-web
andrea689 Apr 2, 2020
1bc72b8
Merge branch 'master' into av-web
andrea689 Jun 3, 2020
048cb29
add console log for onDrag method not implemented
andrea689 Jun 3, 2020
fb1219c
fix web compile error
andrea689 Jun 3, 2020
618215f
add web implementation of addImage()
andrea689 Jun 3, 2020
ba7ad86
fix readme
andrea689 Jun 3, 2020
5818c31
fix image version conflict
andrea689 Jun 3, 2020
fea7778
fix addImage
andrea689 Jun 3, 2020
f3f5769
add sdf to ios style#addImage
andrea689 Jun 3, 2020
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ embedded interactive and customizable vector maps inside a Flutter widget by emb
![screenshot.png](screenshot.png)

## Install

This project is available on [pub.dev](https://pub.dev/packages/mapbox_gl), follow the [instructions](https://flutter.dev/docs/development/packages-and-plugins/using-packages#adding-a-package-dependency-to-an-app) to integrate a package into your flutter application.

## :new: :new: Who's using this SDK :new: :new:
Expand Down Expand Up @@ -48,6 +49,13 @@ Add these lines to your Info.plist
<string>YOUR_TOKEN_HERE</string>
```

If you access your users' location, you should also add the following key to your Info.plist to explain why you need access to their location data:

```xml
<key>NSLocationWhenInUseUsageDescription</key>
<string>[Your explanation here]</string>
```

##### Web

Add mapbox-gl.js library in the `<head>` of your html page:
Expand All @@ -70,6 +78,8 @@ Add your `accessToken` in a script tag at the end of your body:
</body>
```

Mapbox [recommends](https://docs.mapbox.com/help/tutorials/first-steps-ios-sdk/#display-the-users-location) the explanation "Shows your location on the map and helps improve the map".
andrea689 marked this conversation as resolved.
Show resolved Hide resolved

## Supported API

| Feature | Android | iOS | Web |
Expand Down
14 changes: 1 addition & 13 deletions example/ios/Runner.xcodeproj/project.pbxproj
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,6 @@
1498D2341E8E89220040F4C2 /* GeneratedPluginRegistrant.m in Sources */ = {isa = PBXBuildFile; fileRef = 1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */; };
1C318FD9FE81A3CF826CB6E0 /* Pods_Runner.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = E9C618A260D4CE68F2F89632 /* Pods_Runner.framework */; };
3B3967161E833CAA004F5970 /* AppFrameworkInfo.plist in Resources */ = {isa = PBXBuildFile; fileRef = 3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */; };
3B80C3941E831B6300D905FE /* App.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 3B80C3931E831B6300D905FE /* App.framework */; };
3B80C3951E831B6300D905FE /* App.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 3B80C3931E831B6300D905FE /* App.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
9705A1C61CF904A100538489 /* Flutter.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 9740EEBA1CF902C7004384FC /* Flutter.framework */; };
9705A1C71CF904A300538489 /* Flutter.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 9740EEBA1CF902C7004384FC /* Flutter.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
978B8F6F1D3862AE00F588F7 /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 7AFFD8EE1D35381100E5BB4D /* AppDelegate.m */; };
97C146F31CF9000F007C117D /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 97C146F21CF9000F007C117D /* main.m */; };
97C146FC1CF9000F007C117D /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FA1CF9000F007C117D /* Main.storyboard */; };
Expand All @@ -28,8 +24,6 @@
dstPath = "";
dstSubfolderSpec = 10;
files = (
3B80C3951E831B6300D905FE /* App.framework in Embed Frameworks */,
9705A1C71CF904A300538489 /* Flutter.framework in Embed Frameworks */,
);
name = "Embed Frameworks";
runOnlyForDeploymentPostprocessing = 0;
Expand All @@ -41,15 +35,13 @@
1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = GeneratedPluginRegistrant.m; sourceTree = "<group>"; };
33EB4B753D90FC406A268B9A /* Pods-Runner.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.release.xcconfig"; path = "Pods/Target Support Files/Pods-Runner/Pods-Runner.release.xcconfig"; sourceTree = "<group>"; };
3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = AppFrameworkInfo.plist; path = Flutter/AppFrameworkInfo.plist; sourceTree = "<group>"; };
3B80C3931E831B6300D905FE /* App.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = App.framework; path = Flutter/App.framework; sourceTree = "<group>"; };
647A9CC8EAD456F68D57F590 /* Pods-Runner.profile.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.profile.xcconfig"; path = "Pods/Target Support Files/Pods-Runner/Pods-Runner.profile.xcconfig"; sourceTree = "<group>"; };
77F62DAA39FA47F19A7FF5D8 /* Pods-Runner.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Runner.debug.xcconfig"; path = "Pods/Target Support Files/Pods-Runner/Pods-Runner.debug.xcconfig"; sourceTree = "<group>"; };
7AFA3C8E1D35360C0083082E /* Release.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; name = Release.xcconfig; path = Flutter/Release.xcconfig; sourceTree = "<group>"; };
7AFFD8ED1D35381100E5BB4D /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = AppDelegate.h; sourceTree = "<group>"; };
7AFFD8EE1D35381100E5BB4D /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = AppDelegate.m; sourceTree = "<group>"; };
9740EEB21CF90195004384FC /* Debug.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; name = Debug.xcconfig; path = Flutter/Debug.xcconfig; sourceTree = "<group>"; };
9740EEB31CF90195004384FC /* Generated.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; name = Generated.xcconfig; path = Flutter/Generated.xcconfig; sourceTree = "<group>"; };
9740EEBA1CF902C7004384FC /* Flutter.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = Flutter.framework; path = Flutter/Flutter.framework; sourceTree = "<group>"; };
97C146EE1CF9000F007C117D /* Runner.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = Runner.app; sourceTree = BUILT_PRODUCTS_DIR; };
97C146F21CF9000F007C117D /* main.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = main.m; sourceTree = "<group>"; };
97C146FB1CF9000F007C117D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
Expand All @@ -64,8 +56,6 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
9705A1C61CF904A100538489 /* Flutter.framework in Frameworks */,
3B80C3941E831B6300D905FE /* App.framework in Frameworks */,
1C318FD9FE81A3CF826CB6E0 /* Pods_Runner.framework in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
Expand All @@ -84,9 +74,7 @@
9740EEB11CF90186004384FC /* Flutter */ = {
isa = PBXGroup;
children = (
3B80C3931E831B6300D905FE /* App.framework */,
3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */,
9740EEBA1CF902C7004384FC /* Flutter.framework */,
9740EEB21CF90195004384FC /* Debug.xcconfig */,
7AFA3C8E1D35360C0083082E /* Release.xcconfig */,
9740EEB31CF90195004384FC /* Generated.xcconfig */,
Expand Down Expand Up @@ -232,7 +220,7 @@
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "/bin/sh \"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh\" thin";
shellScript = "/bin/sh \"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh\" embed_and_thin";
};
61A6A5795B0A22D55417D672 /* [CP] Check Pods Manifest.lock */ = {
isa = PBXShellScriptBuildPhase;
Expand Down

This file was deleted.

1 change: 1 addition & 0 deletions example/lib/generated_plugin_registrant.dart
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import 'package:mapbox_gl_web/mapbox_gl_web.dart';

import 'package:flutter_web_plugins/flutter_web_plugins.dart';

// ignore: public_member_api_docs
void registerPlugins(PluginRegistry registry) {
MapboxMapPlugin.registerWith(registry.registrarFor(MapboxMapPlugin));
registry.registerMessageHandler();
Expand Down
2 changes: 1 addition & 1 deletion example/lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ final List<ExamplePage> _allPages = <ExamplePage>[
];

class MapsDemo extends StatelessWidget {
void _pushPage(BuildContext context, Page page) async {
void _pushPage(BuildContext context, ExamplePage page) async {
if (!kIsWeb) {
final location = Location();
final hasPermissions = await location.hasPermission();
Expand Down
2 changes: 2 additions & 0 deletions lib/mapbox_gl.dart
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ library mapbox_gl;

import 'dart:async';
import 'dart:math';
import 'dart:typed_data';
import 'dart:ui';

import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
Expand Down
27 changes: 10 additions & 17 deletions lib/src/controller.dart
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,12 @@ class MapboxMapController extends ChangeNotifier {
}
});

MapboxGlPlatform.instance.onMapLongClickPlatform.add((dict) {
if (onMapLongClick != null) {
onMapLongClick(dict['point'], dict['latLng']);
}
});

MapboxGlPlatform.instance.onCameraTrackingChangedPlatform.add((mode) {
if (onCameraTrackingChanged != null) {
onCameraTrackingChanged(mode);
Expand Down Expand Up @@ -549,12 +555,12 @@ class MapboxMapController extends ChangeNotifier {
}

/// Adds an image to the style currently displayed in the map, so that it can later be referred to by the provided name.
///
///
/// This allows you to add an image to the currently displayed style once, and from there on refer to it e.g. in the [Symbol.iconImage] anytime you add a [Symbol] later on.
/// Set [sdf] to true if the image you add is an SDF image.
/// Returns after the image has successfully been added to the style.
/// Note: This can only be called after OnStyleLoadedCallback has been invoked and any added images will have to be re-added if a new style is loaded.
///
///
/// Example: Adding an asset image and using it in a new symbol:
/// ```dart
/// Future<void> addImageFromAsset() async{
Expand All @@ -569,7 +575,7 @@ class MapboxMapController extends ChangeNotifier {
/// );
/// }
/// ```
///
///
/// Example: Adding a network image (with the http package) and using it in a new symbol:
/// ```dart
/// Future<void> addImageFromUrl() async{
Expand All @@ -584,19 +590,6 @@ class MapboxMapController extends ChangeNotifier {
/// }
/// ```
Future<void> addImage(String name, Uint8List bytes, [bool sdf = false]) {
try {
return _channel.invokeMethod('style#addImage', <String, Object>{
"name": name,
"bytes": bytes,
"length": bytes.length,
"sdf": sdf
});
} on PlatformException catch (e) {
return new Future.error(e);
}
return MapboxGlPlatform.instance.addImage(name, bytes, sdf);
}




}
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
library mapbox_gl_platform_interface;

import 'dart:math';
import 'dart:typed_data';
import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,9 @@ abstract class MapboxGlPlatform {
final ArgumentCallbacks<Map<String, dynamic>> onMapClickPlatform =
ArgumentCallbacks<Map<String, dynamic>>();

final ArgumentCallbacks<Map<String, dynamic>> onMapLongClickPlatform =
ArgumentCallbacks<Map<String, dynamic>>();

final ArgumentCallbacks<MyLocationTrackingMode>
onCameraTrackingChangedPlatform =
ArgumentCallbacks<MyLocationTrackingMode>();
Expand Down Expand Up @@ -168,4 +171,9 @@ abstract class MapboxGlPlatform {
Future<LatLngBounds> getVisibleRegion() async {
throw UnimplementedError('getVisibleRegion() has not been implemented.');
}

Future<LatLngBounds> addImage(String name, Uint8List bytes,
andrea689 marked this conversation as resolved.
Show resolved Hide resolved
[bool sdf = false]) async {
throw UnimplementedError('addImage() has not been implemented.');
}
}
23 changes: 23 additions & 0 deletions mapbox_gl_platform_interface/lib/src/method_channel_mapbox_gl.dart
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,15 @@ class MethodChannelMapboxGl extends MapboxGlPlatform {
onMapClickPlatform(
{'point': Point<double>(x, y), 'latLng': LatLng(lat, lng)});
break;
case 'map#onMapLongClick':
final double x = call.arguments['x'];
final double y = call.arguments['y'];
final double lng = call.arguments['lng'];
final double lat = call.arguments['lat'];
onMapLongClickPlatform(
{'point': Point<double>(x, y), 'latLng': LatLng(lat, lng)});

break;
case 'map#onCameraTrackingChanged':
final int mode = call.arguments['mode'];
onCameraTrackingChangedPlatform(MyLocationTrackingMode.values[mode]);
Expand Down Expand Up @@ -346,4 +355,18 @@ class MethodChannelMapboxGl extends MapboxGlPlatform {
return new Future.error(e);
}
}

Future<LatLngBounds> addImage(String name, Uint8List bytes,
andrea689 marked this conversation as resolved.
Show resolved Hide resolved
[bool sdf = false]) async {
try {
return _channel.invokeMethod('style#addImage', <String, Object>{
"name": name,
"bytes": bytes,
"length": bytes.length,
"sdf": sdf
});
} on PlatformException catch (e) {
return new Future.error(e);
}
}
}
1 change: 1 addition & 0 deletions mapbox_gl_web/lib/mapbox_gl_web.dart
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import 'dart:async';
// ignore_for_file: avoid_web_libraries_in_flutter
import 'dart:html';
import 'dart:js';
import 'dart:typed_data';
import 'dart:ui' as ui;

import 'package:flutter/foundation.dart';
Expand Down
14 changes: 14 additions & 0 deletions mapbox_gl_web/lib/src/mapbox_map_controller.dart
Original file line number Diff line number Diff line change
Expand Up @@ -259,6 +259,11 @@ class MapboxMapController extends MapboxGlPlatform
);
}

Future<LatLngBounds> addImage(String name, Uint8List bytes,
andrea689 marked this conversation as resolved.
Show resolved Hide resolved
[bool sdf = false]) async {
//TODO: add addImage web implementation
}

CameraPosition _getCameraPosition() {
if (_trackCameraPosition) {
final center = _map.getCenter();
Expand All @@ -278,6 +283,8 @@ class MapboxMapController extends MapboxGlPlatform
circleManager = CircleManager(map: _map, onTap: onCircleTappedPlatform);
onMapStyleLoadedPlatform(null);
_map.on('click', _onMapClick);
// long click not available in web, so it is mapped to double click
_map.on('dblclick', _onMapLongClick);
_map.on('movestart', _onCameraMoveStarted);
_map.on('move', _onCameraMove);
_map.on('moveend', _onCameraIdle);
Expand All @@ -290,6 +297,13 @@ class MapboxMapController extends MapboxGlPlatform
});
}

void _onMapLongClick(e) {
onMapLongClickPlatform({
'point': Point<double>(e.point.x, e.point.y),
'latLng': LatLng(e.lngLat.lat, e.lngLat.lng),
});
}

void _onCameraMoveStarted(_) {
onCameraMoveStartedPlatform(null);
}
Expand Down
3 changes: 1 addition & 2 deletions mapbox_gl_web/pubspec.yaml
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
name: mapbox_gl_web
description: Web platform implementation of mapbox_gl_web
version: 0.1.0
author:
homepage:
homepage: https://github.com/tobrun/flutter-mapbox-gl/mapbox_gl_web

flutter:
plugin:
Expand Down
You are viewing a condensed version of this merge commit. You can view the full changes here.