Tweet
Tweet

Slide 1

Slide 1 text

Embrace The Journey Pablo Guardiola
 @Guardiola31337

Slide 2

Slide 2 text

•Mapping platform for developers Mapbox

Slide 3

Slide 3 text

•Mapping platform for developers Mapbox •Work in the open

Slide 4

Slide 4 text

•Mapping platform for developers Mapbox •Work in the open •SDK for Android, iOS, Qt, Node.js, Unity…

Slide 5

Slide 5 text

Mapbox - Mobile •Similar SDK as Google Maps and Apple Maps

Slide 6

Slide 6 text

Mapbox - Mobile •Similar SDK as Google Maps and Apple Maps •Custom features

Slide 7

Slide 7 text

Mapbox - Mobile •Custom features •Free up to 50,000 monthly active users •Similar SDK as Google Maps and Apple Maps

Slide 8

Slide 8 text

Survey (55 responses) Platforms 5 % 9 % 86 % Android iOS Both Maps 47 % 53 % Yes No

Slide 9

Slide 9 text

What are/were the worst problems/features missing you find/found developing with maps?

Slide 10

Slide 10 text

Markers - Add mapView.getMapAsync(new OnMapReadyCallback() {
 @Override
 public void onMapReady(MapboxMap mapboxMap) {
 mapboxMap.addMarker(new MarkerViewOptions()
 .position(new LatLng(-37.821629, 144.978535)));
 }
 });

Slide 11

Slide 11 text

mapView.getMapAsync(new OnMapReadyCallback() {
 @Override
 public void onMapReady(MapboxMap mapboxMap) {
 final Marker marker = mapboxMap.addMarker(new MarkerViewOptions()
 .position(new LatLng(64.900932, -18.167040)));
 mapboxMap.setOnMapClickListener(new MapboxMap.OnMapClickListener() {
 @Override
 public void onMapClick(@NonNull LatLng point) {
 ValueAnimator markerAnimator = ObjectAnimator.ofObject(marker, "position",
 new LatLngEvaluator(), marker.getPosition(), point);
 markerAnimator.setDuration(2000);
 markerAnimator.start();
 }
 });
 }
 }); Markers - Animate

Slide 12

Slide 12 text

Markers - Animate

Slide 13

Slide 13 text

Custom maps - Styles

Slide 14

Slide 14 text

Custom maps - Styles

Slide 15

Slide 15 text

Publish to fleet Property pane Live map preview Layer selector Watching a designer create a night style within minutes with Mapbox Studio. Custom maps - Mapbox Studio

Slide 16

Slide 16 text

Drawing - Map matching MapboxMapMatching client = new MapboxMapMatching.Builder()
 .setAccessToken(Mapbox.getAccessToken())
 .setProfile(MapMatchingCriteria.PROFILE_DRIVING)
 .setCoordinates(coordinates) client.enqueueCall(
 .build(); client.enqueueCall(new Callback() {
 @Override
 public void onResponse(Call call, Response response) {
 List mapMatchedPoints = new ArrayList<>();
 if (response.code() == 200) {
 String geometry = response.body().getMatchings().get(0).getGeometry();
 List positions = PolylineUtils.decode(geometry, Constants.PRECISION_6);
 // Traverse positions adding points into mapMatchedPoints
 mapMatchedRoute = map.addPolyline(new PolylineOptions()
 .addAll(mapMatchedPoints)
 .color(Color.parseColor("#3bb2d0"))
 .width(4));
 }
 }

Slide 17

Slide 17 text

Drawing - Map matching

Slide 18

Slide 18 text

Drawing - Polygons

Slide 19

Slide 19 text

Drawing - Polygons List STAR_SHAPE_POINTS = new ArrayList() {
 {
 add(new LatLng(45.522585, -122.685699));
 // ...
 add(new LatLng(45.522585, -122.685699));
 }
 }; BLUE_COLOR = Color.parseColor("#3bb2d0"); polygon = mapboxMap.addPolygon(new PolygonOptions()
 .addAll(STAR_SHAPE_POINTS)
 .fillColor(BLUE_COLOR));

Slide 20

Slide 20 text

What would you like to learn?

Slide 21

Slide 21 text

Offline maps - Pre-caching String minZoom = map.getStyleUrl();
 double minZoom = map.getCameraPosition().zoom;
 double maxZoom = map.getMaxZoom();
 float pixelRatio = this.getResources().getDisplayMetrics().density;
 OfflineTilePyramidRegionDefinition definition = new OfflineTilePyramidRegionDefinition(
 styleURL, bounds, minZoom, maxZoom, pixelRatio);
 byte[] metadata = name.getBytes(CHARSET);
 offlineManager.createOfflineRegion(definition, metadata, new OfflineManager.CreateOfflineRegionCallback() {
 @Override
 public void onCreate(OfflineRegion offlineRegion) {
 offlineRegion.setDownloadState(OfflineRegion.STATE_ACTIVE);
 }
 
 @Override
 public void onError(String error) {
 }
 });

Slide 22

Slide 22 text

Offline maps - Pre-caching

Slide 23

Slide 23 text

Offline maps - Pre-caching

Slide 24

Slide 24 text

Navigation - Off route detection client.enqueueCall(new Callback() {
 @Override
 public void onResponse(Call call, Response response) {
 currentRoute = response.body().getRoutes().get(0);
 drawRoute(currentRoute);
 }
 
 @Override
 public void onFailure(Call call, Throwable throwable) {
 }
 });
 // ... Position carCurrentPosition = Position.fromCoordinates(
 car.getPosition().getLongitude(),
 car.getPosition().getLatitude()
 );
 if (routeUtils.isOffRoute(carCurrentPosition, currentRoute.getLegs().get(0))) {
 }

Slide 25

Slide 25 text

Navigation - Off route detection

Slide 26

Slide 26 text

Custom maps - Runtime Styling Layer water = mapboxMap.getLayer("water");
 if (water != null) {
 mapboxMap.setTransitionDuration(5);
 mapboxMap.setTransitionDelay(1);
 water.setProperties(
 visibility(VISIBLE),
 fillColor(Color.RED)
 );
 }

Slide 27

Slide 27 text

Custom maps - Runtime Styling

Slide 28

Slide 28 text

Mapbox Android SDK v5.0.0 •Support for data-driven styles

Slide 29

Slide 29 text

•Support for data-driven styles •Support for Android Nougat Mapbox Android SDK v5.0.0

Slide 30

Slide 30 text

•Support for data-driven styles •Support for Android Nougat •Many performance improvements Mapbox Android SDK v5.0.0

Slide 31

Slide 31 text

A platform for developers

Slide 32

Slide 32 text

And we love open source!

Slide 33

Slide 33 text

Thank you

Slide 34

Slide 34 text

Questions? [email protected]

Slide 35

Slide 35 text

References • Mapbox Android SDK: https:/ /www.mapbox.com/android-sdk/ • Mapbox iOS SDK: https:/ /www.mapbox.com/ios-sdk/ • Android demo app: https:/ /github.com/mapbox/mapbox-android-demo • Core (Maps): https:/ /github.com/mapbox/mapbox-gl-native • MAS: https:/ /github.com/mapbox/mapbox-java