diff --git a/Examples/Examples.h b/Examples/Examples.h index 30d1c433..120ac4e6 100644 --- a/Examples/Examples.h +++ b/Examples/Examples.h @@ -39,6 +39,7 @@ extern NSString *const MBXExampleHeatmap; extern NSString *const MBXExampleImageAnnotation; extern NSString *const MBXExampleImageSource; extern NSString *const MBXExampleLineAnnotationGeoJSON; +extern NSString *const MBXExampleLineGradient; extern NSString *const MBXExampleLineStyleLayer; extern NSString *const MBXExampleLiveData; extern NSString *const MBXExampleMultipleImages; diff --git a/Examples/Examples.m b/Examples/Examples.m index 90873494..1435ea55 100644 --- a/Examples/Examples.m +++ b/Examples/Examples.m @@ -77,6 +77,7 @@ + (NSArray *)groups { @"title": @"Add a heatmap layer" }, @{@"className": MBXExampleImageSource, @"title": @"Add an image"}, + @{@"className": MBXExampleLineGradient, @"title": @"Style with a gradient"}, @{@"className": MBXExampleLiveData, @"title": @"Add live data"}, @{@"className": MBXExampleMultipleShapes, @"title": @"Add multiple shapes from a single shape source"}, @{@"className": MBXExampleMultipleImages, @"title": @"Add multiple images"}, diff --git a/Examples/Files/line-gradient.geojson b/Examples/Files/line-gradient.geojson new file mode 100644 index 00000000..e3f60a8d --- /dev/null +++ b/Examples/Files/line-gradient.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..36fc403e --- /dev/null +++ b/Examples/ObjectiveC/Headers/LineGradientExample.h @@ -0,0 +1,9 @@ +#import + +NS_ASSUME_NONNULL_BEGIN + +@interface LineGradientExample : UIViewController + +@end + +NS_ASSUME_NONNULL_END diff --git a/Examples/ObjectiveC/LineGradientExample.m b/Examples/ObjectiveC/LineGradientExample.m new file mode 100644 index 00000000..4b228713 --- /dev/null +++ b/Examples/ObjectiveC/LineGradientExample.m @@ -0,0 +1,58 @@ +#import "LineGradientExample.h" +@import Mapbox; + +NSString *const MBXExampleLineGradient = @"LineGradientExample"; + +@interface LineGradientExample () + +@end + +@implementation LineGradientExample + +- (void)viewDidLoad { + [super viewDidLoad]; + MGLMapView *mapView = [[MGLMapView alloc] initWithFrame:self.view.bounds styleURL:[MGLStyle lightStyleURL]]; + + mapView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; + + mapView.delegate = self; + + // Set the map’s center coordinate and zoom level. + [mapView setCenterCoordinate:CLLocationCoordinate2DMake(38.875, -77.035) + zoomLevel:12 + animated:NO]; + + [self.view addSubview:mapView]; +} + +- (void)mapView:(MGLMapView *)mapView didFinishLoadingStyle:(MGLStyle *)style { + + NSURL *url = [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"line-gradient" ofType:@"geojson"]]; + MGLShapeSource *source = [[MGLShapeSource alloc] initWithIdentifier:@"line-source" URL:url options:nil]; + + + [style addSource:source]; + + MGLLineStyleLayer *polylineStyle = [[MGLLineStyleLayer alloc] initWithIdentifier:@"lineStyle" source:source]; + polylineStyle.lineWidth = [NSExpression expressionForConstantValue:@14]; + polylineStyle.lineCap = [NSExpression expressionForConstantValue:@"round"]; + + NSDictionary *stops = @{ + @0: UIColor.blueColor, + @0.1: UIColor.purpleColor, + @0.3: UIColor.cyanColor, + @0.5: UIColor.greenColor, + @0.7: UIColor.yellowColor, + @1: UIColor.redColor + }; + + NSExpression *gradientExpression = [NSExpression expressionWithFormat:@"mgl_interpolate:withCurveType:parameters:stops:($lineProgress, 'linear', nil, %@)", stops]; + + polylineStyle.lineColor = gradientExpression; + + [style addLayer:polylineStyle]; + +} + +@end + diff --git a/Examples/Swift/LineGradientExample.swift b/Examples/Swift/LineGradientExample.swift new file mode 100644 index 00000000..cce14205 --- /dev/null +++ b/Examples/Swift/LineGradientExample.swift @@ -0,0 +1,14 @@ +import UIKit +import Mapbox + +@objc(LineGradientExample_Swift) + +class LineGradientExample: UIViewController { + + override func viewDidLoad() { + super.viewDidLoad() + + // Do any additional setup after loading the view. + } + +}