From 60050bace5c8bab222ed4fef682adb9280c8d94f Mon Sep 17 00:00:00 2001 From: Zizasaurus Date: Thu, 21 Jan 2021 09:59:42 -0500 Subject: [PATCH] created a new branch due to merge conflicts. --- Examples.xcodeproj/project.pbxproj | 26 ++++--- Examples/Examples.h | 1 + Examples/Examples.m | 1 + Examples/Files/iOSLineGeoJSON.geojson | 29 +++++++ .../ObjectiveC/Headers/LineGradientExample.h | 5 ++ Examples/ObjectiveC/LineGradientExample.m | 75 +++++++++++++++++++ Examples/Swift/LineGradientExample.swift | 63 ++++++++++++++++ Podfile.lock | 2 +- 8 files changed, 189 insertions(+), 13 deletions(-) create mode 100644 Examples/Files/iOSLineGeoJSON.geojson create mode 100644 Examples/ObjectiveC/Headers/LineGradientExample.h create mode 100644 Examples/ObjectiveC/LineGradientExample.m create mode 100644 Examples/Swift/LineGradientExample.swift diff --git a/Examples.xcodeproj/project.pbxproj b/Examples.xcodeproj/project.pbxproj index 5fbee60b..7020d513 100644 --- a/Examples.xcodeproj/project.pbxproj +++ b/Examples.xcodeproj/project.pbxproj @@ -87,6 +87,9 @@ 580F709E252D11AF000512BE /* ManageOfflineRegionsExample.m in Sources */ = {isa = PBXBuildFile; fileRef = 580F709D252D11AF000512BE /* ManageOfflineRegionsExample.m */; }; 583BAE082481AFF50079BB57 /* InsetMapExample.m in Sources */ = {isa = PBXBuildFile; fileRef = 583BAE072481AFF50079BB57 /* InsetMapExample.m */; }; 583BAE0B2481B1580079BB57 /* InsetMapExample.swift in Sources */ = {isa = PBXBuildFile; fileRef = 583BAE0A2481B1580079BB57 /* InsetMapExample.swift */; }; + 58D43A9B25B9C9D600A29650 /* LineGradientExample.swift in Sources */ = {isa = PBXBuildFile; fileRef = 58D43A9A25B9C9D600A29650 /* LineGradientExample.swift */; }; + 58D43AA525B9CA1500A29650 /* LineGradientExample.m in Sources */ = {isa = PBXBuildFile; fileRef = 58D43AA425B9CA1500A29650 /* LineGradientExample.m */; }; + 58D43ACD25B9CE1A00A29650 /* iOSLineGeoJSON.geojson in Resources */ = {isa = PBXBuildFile; fileRef = 58D43AAA25B9CA6200A29650 /* iOSLineGeoJSON.geojson */; }; 646B62971DEF6DAF000AA523 /* ShowHideLayerExample.swift in Sources */ = {isa = PBXBuildFile; fileRef = 646B62961DEF6DAF000AA523 /* ShowHideLayerExample.swift */; }; 646B629C1DEF6DF1000AA523 /* ShowHideLayerExample.m in Sources */ = {isa = PBXBuildFile; fileRef = 646B629B1DEF6DF1000AA523 /* ShowHideLayerExample.m */; }; 646B62A61DEF7121000AA523 /* AnimatedLineExample.m in Sources */ = {isa = PBXBuildFile; fileRef = 646B62A51DEF7121000AA523 /* AnimatedLineExample.m */; }; @@ -288,6 +291,10 @@ 583BAE072481AFF50079BB57 /* InsetMapExample.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = InsetMapExample.m; sourceTree = ""; }; 583BAE092481B0220079BB57 /* InsetMapExample.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = InsetMapExample.h; sourceTree = ""; }; 583BAE0A2481B1580079BB57 /* InsetMapExample.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = InsetMapExample.swift; sourceTree = ""; }; + 58D43A9925B9C93800A29650 /* LineGradientExample.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = LineGradientExample.h; sourceTree = ""; }; + 58D43A9A25B9C9D600A29650 /* LineGradientExample.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LineGradientExample.swift; sourceTree = ""; }; + 58D43AA425B9CA1500A29650 /* LineGradientExample.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = LineGradientExample.m; sourceTree = ""; }; + 58D43AAA25B9CA6200A29650 /* iOSLineGeoJSON.geojson */ = {isa = PBXFileReference; lastKnownFileType = text; path = iOSLineGeoJSON.geojson; sourceTree = ""; }; 646B62961DEF6DAF000AA523 /* ShowHideLayerExample.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ShowHideLayerExample.swift; sourceTree = ""; }; 646B629B1DEF6DF1000AA523 /* ShowHideLayerExample.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = ShowHideLayerExample.m; sourceTree = ""; }; 646B629E1DEF6DFD000AA523 /* ShowHideLayerExample.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = ShowHideLayerExample.h; sourceTree = ""; }; @@ -480,6 +487,7 @@ 646B62AF1DEF7161000AA523 /* AnimatedLineExample.swift */, 646B62AD1DEF7155000AA523 /* LineStyleLayerExample.swift */, 055ABCC21EFB14AE0063BACA /* PolygonPatternExample.swift */, + 58D43A9A25B9C9D600A29650 /* LineGradientExample.swift */, ); name = "Lines and polygons"; sourceTree = ""; @@ -579,6 +587,7 @@ 646B62A51DEF7121000AA523 /* AnimatedLineExample.m */, 05FA539F1FE2FA1E001F3D7D /* LineStyleLayerExample.m */, 05FA539D1FE2FA1D001F3D7D /* PolygonPatternExample.m */, + 58D43AA425B9CA1500A29650 /* LineGradientExample.m */, ); name = "Lines and polygons"; sourceTree = ""; @@ -812,6 +821,7 @@ 1F07016422557B0B0045E061 /* icons.xcassets */, 1F07015622530BDF0045E061 /* text-format.json */, 075AFB7723393DBA0091FF0A /* example.geojson */, + 58D43AAA25B9CA6200A29650 /* iOSLineGeoJSON.geojson */, ); path = Files; sourceTree = ""; @@ -864,6 +874,7 @@ 583BAE092481B0220079BB57 /* InsetMapExample.h */, C67C17E12507FC0C004112DE /* LocationPrivacyExample.h */, 580F7089252D10F0000512BE /* ManageOfflineRegionsExample.h */, + 58D43A9925B9C93800A29650 /* LineGradientExample.h */, ); path = Headers; sourceTree = ""; @@ -1113,6 +1124,7 @@ DD5939E61E6778480009BEB2 /* clustering.xcassets in Resources */, 9619629C1C581700002D3DAB /* Assets.xcassets in Resources */, 1F07016522557B0B0045E061 /* icons.xcassets in Resources */, + 58D43ACD25B9CE1A00A29650 /* iOSLineGeoJSON.geojson in Resources */, 075AFB7823393DBA0091FF0A /* example.geojson in Resources */, 64BBDAF01DF22D9600BB705D /* third_party_vector_style.json in Resources */, 961962CF1C581FBC002D3DAB /* Main.storyboard in Resources */, @@ -1218,17 +1230,11 @@ inputPaths = ( "${PODS_ROOT}/Target Support Files/Pods-Examples/Pods-Examples-frameworks.sh", "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/Mapbox.framework", - "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/Mapbox.framework.dSYM", - "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/8F3E82C3-52DF-39E5-809D-3389B6CBCAD4.bcsymbolmap", - "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/0DC8DAD8-C6D7-343B-ACBF-79B48068D7CC.bcsymbolmap", "${BUILT_PRODUCTS_DIR}/MapboxMobileEvents/MapboxMobileEvents.framework", ); name = "[CP] Embed Pods Frameworks"; outputPaths = ( "${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/Mapbox.framework", - "${DWARF_DSYM_FOLDER_PATH}/Mapbox.framework.dSYM", - "${BUILT_PRODUCTS_DIR}/8F3E82C3-52DF-39E5-809D-3389B6CBCAD4.bcsymbolmap", - "${BUILT_PRODUCTS_DIR}/0DC8DAD8-C6D7-343B-ACBF-79B48068D7CC.bcsymbolmap", "${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/MapboxMobileEvents.framework", ); runOnlyForDeploymentPostprocessing = 0; @@ -1259,17 +1265,11 @@ inputPaths = ( "${PODS_ROOT}/Target Support Files/Pods-DocsCode/Pods-DocsCode-frameworks.sh", "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/Mapbox.framework", - "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/Mapbox.framework.dSYM", - "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/8F3E82C3-52DF-39E5-809D-3389B6CBCAD4.bcsymbolmap", - "${PODS_ROOT}/Mapbox-iOS-SDK/dynamic/0DC8DAD8-C6D7-343B-ACBF-79B48068D7CC.bcsymbolmap", "${BUILT_PRODUCTS_DIR}/MapboxMobileEvents/MapboxMobileEvents.framework", ); name = "[CP] Embed Pods Frameworks"; outputPaths = ( "${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/Mapbox.framework", - "${DWARF_DSYM_FOLDER_PATH}/Mapbox.framework.dSYM", - "${BUILT_PRODUCTS_DIR}/8F3E82C3-52DF-39E5-809D-3389B6CBCAD4.bcsymbolmap", - "${BUILT_PRODUCTS_DIR}/0DC8DAD8-C6D7-343B-ACBF-79B48068D7CC.bcsymbolmap", "${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/MapboxMobileEvents.framework", ); runOnlyForDeploymentPostprocessing = 0; @@ -1429,10 +1429,12 @@ DDF943291E5DE63300545D0F /* ClusteringExample.m in Sources */, 3E44BA58203B54260072DE4B /* MultipleImagesExample.m in Sources */, 3EBCD7171DC28240001E342F /* DefaultCalloutExample.swift in Sources */, + 58D43A9B25B9C9D600A29650 /* LineGradientExample.swift in Sources */, 64BBDAFD1DF24DEB00BB705D /* WebAPIDataExample.m in Sources */, 055ABCC31EFB14AE0063BACA /* PolygonPatternExample.swift in Sources */, 583BAE0B2481B1580079BB57 /* InsetMapExample.swift in Sources */, 646B62AE1DEF7155000AA523 /* LineStyleLayerExample.swift in Sources */, + 58D43AA525B9CA1500A29650 /* LineGradientExample.m in Sources */, 3EBCD71F1DC28240001E342F /* DefaultStylesExample.swift in Sources */, DD5939E41E6639BA0009BEB2 /* ClusteringExample.swift in Sources */, 3E22EF4F1F87F10C00605203 /* ImageSourceExample.swift in Sources */, diff --git a/Examples/Examples.h b/Examples/Examples.h index ec4fc71e..e70ae09f 100644 --- a/Examples/Examples.h +++ b/Examples/Examples.h @@ -33,6 +33,7 @@ extern NSString *const MBXExampleDefaultStyles; extern NSString *const MBXExampleDraggableAnnotationView; extern NSString *const MBXExampleFeatureSelection; extern NSString *const MBXExampleFormattingExpression; +extern NSString *const MBXExampleLineGradient; extern NSString *const MBXExampleHeatmap; extern NSString *const MBXExampleImageSource; extern NSString *const MBXExampleInsetMap; diff --git a/Examples/Examples.m b/Examples/Examples.m index dd91562f..5c64c1a9 100644 --- a/Examples/Examples.m +++ b/Examples/Examples.m @@ -49,6 +49,7 @@ + (NSArray *)groups { @{@"className": MBXExamplePolygonPattern, @"title": @"Add a pattern to a polygon"}, @{@"className": MBXExampleLineStyleLayer, @"title": @"Add a line style layer from GeoJSON"}, @{@"className": MBXExampleAnimatedLine, @"title": @"Animate a line"}, + @{@"className": MBXExampleLineGradient, @"title": @"Create a line with a color-changing gradient"}, ] }, @{ diff --git a/Examples/Files/iOSLineGeoJSON.geojson b/Examples/Files/iOSLineGeoJSON.geojson new file mode 100644 index 00000000..ea136720 --- /dev/null +++ b/Examples/Files/iOSLineGeoJSON.geojson @@ -0,0 +1,29 @@ +{ + "type": "FeatureCollection", + "features": [{ + "type": "Feature", + "properties": {"lineMetrics": true}, + "geometry": { + "coordinates": [ + [-77.044211, 38.852924], + [-77.045659, 38.860158], + [-77.044232, 38.862326], + [-77.040879, 38.865454], + [-77.039936, 38.867698], + [-77.040338, 38.86943], + [-77.04264, 38.872528], + [-77.03696, 38.878424], + [-77.032309, 38.87937], + [-77.030056, 38.880945], + [-77.027645, 38.881779], + [-77.026946, 38.882645], + [-77.026942, 38.885502], + [-77.028054, 38.887449], + [-77.02806, 38.892088], + [-77.03364, 38.892108], + [-77.033643, 38.899926] + ], + "type": "LineString" + } + }] +} diff --git a/Examples/ObjectiveC/Headers/LineGradientExample.h b/Examples/ObjectiveC/Headers/LineGradientExample.h new file mode 100644 index 00000000..2070996c --- /dev/null +++ b/Examples/ObjectiveC/Headers/LineGradientExample.h @@ -0,0 +1,5 @@ +#import + +@interface LineGradientExample : UIViewController + +@end diff --git a/Examples/ObjectiveC/LineGradientExample.m b/Examples/ObjectiveC/LineGradientExample.m new file mode 100644 index 00000000..a0b9a0c7 --- /dev/null +++ b/Examples/ObjectiveC/LineGradientExample.m @@ -0,0 +1,75 @@ +#import "LineGradientExample.h" +@import Mapbox; +@interface LineGradientExample () +@property (nonatomic) MGLMapView *mapView; +@end + +NSString *const MBXExampleLineGradient = @"LineGradientExample"; + +@implementation LineGradientExample + +- (void)viewDidLoad { + [super viewDidLoad]; + + self.mapView = [[MGLMapView alloc] initWithFrame:self.view.bounds styleURL:[MGLStyle lightStyleURL]]; + self.mapView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; + + [self.mapView setCenterCoordinate:CLLocationCoordinate2DMake(38.875, -77.035) + zoomLevel:12 + animated:NO]; + + + [self.view addSubview:self.mapView]; + + self.mapView.delegate = self; +} + +// Wait until the map is loaded before adding line layer to the map. +- (void)mapView:(MGLMapView *)mapView didFinishLoadingStyle:(MGLStyle *)style { + [self loadGeoJSON]; +} + +- (void)loadGeoJSON { + dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{ + NSString *path = [[NSBundle mainBundle] pathForResource:@"iOSLineGeoJSON" ofType:@"geojson"]; + NSData *jsonData = [NSData dataWithContentsOfFile:path]; + dispatch_async(dispatch_get_main_queue(), ^{ + [self drawPolyline:jsonData]; + }); + }); +} + +- (void)drawPolyline:(NSData *)geoJson { + // Add our GeoJSON data to the map as an MGLShapeSource. + // We can then reference this data from an MGLStyleLayer. + MGLShape *shape = [MGLShape shapeWithData:geoJson encoding:NSUTF8StringEncoding error:nil]; + MGLSource *source = [[MGLShapeSource alloc] initWithIdentifier:@"polyline" shape:shape options: @{MGLShapeSourceOptionLineDistanceMetrics:@YES}]; + [self.mapView.style addSource:source]; + + // Create new layer for the line. + MGLLineStyleLayer *layer = [[MGLLineStyleLayer alloc] initWithIdentifier:@"polyline" source:source]; + + // Set the line join and cap to a rounded end. + layer.lineJoin = [NSExpression expressionForConstantValue:[NSValue valueWithMGLLineJoin:MGLLineJoinRound]]; + layer.lineCap = [NSExpression expressionForConstantValue:[NSValue valueWithMGLLineCap:MGLLineCapRound]]; + + NSDictionary *stops = @{ + @0: UIColor.blueColor, + @0.1: UIColor.purpleColor, + @0.3: UIColor.cyanColor, + @0.5: UIColor.greenColor, + @0.7: UIColor.yellowColor, + @1: UIColor.redColor + }; + + + // Set the line color to a gradient + layer.lineGradient = [NSExpression expressionWithFormat: @"mgl_interpolate:withCurveType:parameters:stops:($lineProgress, 'linear', nil, %@)", stops]; + + // Use `NSExpression` to allow the appearance of your gradient to change and become more detailed with the map’s zoom level + layer.lineWidth = [NSExpression expressionWithFormat:@"mgl_interpolate:withCurveType:parameters:stops:($zoomLevel, 'linear', nil, %@)", + @{@14: @10, @18: @20}]; + [self.mapView.style addLayer:layer]; + +} +@end diff --git a/Examples/Swift/LineGradientExample.swift b/Examples/Swift/LineGradientExample.swift new file mode 100644 index 00000000..654b1da2 --- /dev/null +++ b/Examples/Swift/LineGradientExample.swift @@ -0,0 +1,63 @@ +import UIKit +import Mapbox +@objc(LineGradientExample_Swift) + +class LineGradientExample_Swift: UIViewController, MGLMapViewDelegate { + + var mapView: MGLMapView! + + override func viewDidLoad() { + super.viewDidLoad() + // Do any additional setup after loading the view. + mapView = MGLMapView(frame: view.bounds) + mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight] + mapView.styleURL = MGLStyle.lightStyleURL + mapView.delegate = self + view.addSubview(mapView) + mapView.setCenter(CLLocationCoordinate2D(latitude: 38.875, longitude: -77.035), zoomLevel: 12, animated: false) + } + + func mapViewDidFinishLoadingMap(_ mapView: MGLMapView) { + drawPolyline() + } + + func drawPolyline() { + // Since we know this file exists within this project, we'll force unwrap its value. + // If this data was coming from an external server, we would want to perform + // proper error handling for a web request/response. + let url = URL(fileURLWithPath: Bundle.main.path(forResource: "iOSLineGeoJSON", ofType: "geojson")!) + guard let jsonData = try? Data(contentsOf: url) else { + preconditionFailure("Failed to parse GeoJSON file") + } + // Add our GeoJSON data to the map as an MGLShapeSource. + // We can then reference this data from an MGLStyleLayer. + // MGLMapView.style is optional, so you must guard against it not being set. + guard let style = self.mapView.style else { return } + guard let shapeFromGeoJSON = try? MGLShape(data: jsonData, encoding: String.Encoding.utf8.rawValue) else { + fatalError("Could not generate MGLShape") + } + let source = MGLShapeSource(identifier: "polyline", shape: shapeFromGeoJSON, options: [MGLShapeSourceOption.lineDistanceMetrics: true]) + style.addSource(source) + // Create a new style layer for the line which will determine the line's styling properties. + let layer = MGLLineStyleLayer(identifier: "polyline", source: source) + // Set the line join and cap to a rounded end. + layer.lineJoin = NSExpression(forConstantValue: "round") + layer.lineCap = NSExpression(forConstantValue: "round") + + let stops = [0: UIColor.blue, + 0.1: UIColor.purple, + 0.3: UIColor.cyan, + 0.5: UIColor.green, + 0.7: UIColor.yellow, + 1: UIColor.red] + + // Set the line color to a gradient + layer.lineGradient = NSExpression(format: "mgl_interpolate:withCurveType:parameters:stops:($lineProgress, 'linear', nil, %@)", stops) + + // Use `NSExpression` to allow the appearance of your gradient to change and become more detailed with the map’s zoom level + layer.lineWidth = NSExpression(format: "mgl_interpolate:withCurveType:parameters:stops:($zoomLevel, 'linear', nil, %@)", + [14: 10, 18: 20]) + + style.addLayer(layer) + } +} diff --git a/Podfile.lock b/Podfile.lock index 0a73eaed..f023d024 100644 --- a/Podfile.lock +++ b/Podfile.lock @@ -21,4 +21,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 3fb0eea64d7fe606fd4edb9f5b121e174bebc01a -COCOAPODS: 1.9.3 +COCOAPODS: 1.10.0