diff --git a/Classes/TiGooglemapsView.m b/Classes/TiGooglemapsView.m index 32c3b4c..0b192ce 100644 --- a/Classes/TiGooglemapsView.m +++ b/Classes/TiGooglemapsView.m @@ -31,6 +31,7 @@ - (GMSMapView *)mapView { if (_mapView == nil) { _mapView = [[GMSMapView alloc] initWithFrame:[self bounds]]; + [_mapView setMapType:kGMSTypeNormal]; [_mapView setDelegate:self]; [_mapView setAutoresizingMask:UIViewAutoresizingNone]; diff --git a/Classes/TiGooglemapsViewProxy.h b/Classes/TiGooglemapsViewProxy.h index 42a5bb6..2274a4b 100644 --- a/Classes/TiGooglemapsViewProxy.h +++ b/Classes/TiGooglemapsViewProxy.h @@ -282,6 +282,14 @@ */ - (void)showAnnotations:(id)annotations; +/** + * Draws a rounded polyline between two given coordiinates + * + * @param annotations The annotations to show. + * @since 5.5.0 + */ +- (NSDictionary *)drawRoundedPolylineBetweenCoordinates:(id)args; + /** * Returns all currently added annotations. * diff --git a/Classes/TiGooglemapsViewProxy.m b/Classes/TiGooglemapsViewProxy.m index 0029e08..3ac2e29 100644 --- a/Classes/TiGooglemapsViewProxy.m +++ b/Classes/TiGooglemapsViewProxy.m @@ -14,6 +14,7 @@ #import "TiGooglemapsView.h" #import "TiUtils.h" #import "math.h" +#import #import "GMUMarkerClustering.h" @@ -781,6 +782,85 @@ - (void)showAnnotations:(id)args } } +// CREDITS: https://stackoverflow.com/a/53569754/5537752 +- (NSDictionary *)drawRoundedPolylineBetweenCoordinates:(id)args +{ + ENSURE_UI_THREAD(drawRoundedPolylineBetweenCoordinates, args); + ENSURE_SINGLE_ARG(args, NSDictionary) + + // Unwrap proxy values + NSArray *> *coordinates = args[@"coordinates"]; + NSDictionary *options = args[@"options"] ?: @{}; // UNUSED so far + + NSDictionary *startCoordinatesDictionary = coordinates[0]; + NSDictionary *endCoordinatesDictionary = coordinates[1]; + + CLLocationDegrees startLocationLatitude = [TiUtils doubleValue:startCoordinatesDictionary[@"latitude"]]; + CLLocationDegrees startLocationLongitude = [TiUtils doubleValue:startCoordinatesDictionary[@"longitude"]]; + CLLocationDegrees endLocationLatitude = [TiUtils doubleValue:endCoordinatesDictionary[@"latitude"]]; + CLLocationDegrees endLocationLongitude = [TiUtils doubleValue:endCoordinatesDictionary[@"longitude"]]; + + CLLocationCoordinate2D startLocation = CLLocationCoordinate2DMake(startLocationLatitude, startLocationLongitude); + CLLocationCoordinate2D endLocation = CLLocationCoordinate2DMake(endLocationLatitude, endLocationLongitude); + + // Create path + GMSMutablePath *path = [GMSMutablePath new]; + + CLLocationDistance distance = GMSGeometryDistance(startLocation, endLocation); + CLLocationCoordinate2D midPoint = GMSGeometryInterpolate(startLocation, endLocation, 0.5); + + CLLocationDirection midToStartLocHeading = GMSGeometryHeading(midPoint, startLocation); + + double controlPointAngle = 360.0 - (90.0 - midToStartLocHeading); + CLLocationCoordinate2D controlPoint = GMSGeometryOffset(midPoint, distance / 2.0 , controlPointAngle); + + double stepper = 0.05; + NSMutableArray *range = [NSMutableArray arrayWithArray:@[]]; + + for (int i = 0.0; i < 1.0; i = i + 0.05) { + [range addObject:@(i)]; + } + + __block CLLocationCoordinate2D centerCoordinate; + + [range enumerateObjectsUsingBlock:^(NSNumber * _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) { + double t = obj.doubleValue; + double t1 = (1.0 - t); + CLLocationDegrees latitude = t1 * t1 * startLocation.latitude + 2 * t1 * t * controlPoint.latitude + t * t * endLocation.latitude; + CLLocationDegrees longitude = t1 * t1 * startLocation.longitude + 2 * t1 * t * controlPoint.longitude + t * t * endLocation.longitude; + CLLocationCoordinate2D point = CLLocationCoordinate2DMake(latitude, longitude); + + if (idx == floor(range.count / 2)) { + centerCoordinate = point; + } + + [path addCoordinate:point]; + }]; + + // Draw polyline + GMSPolyline *polyline = [GMSPolyline polylineWithPath:path]; + polyline.map = self.mapView.mapView; // Assign GMSMapView as map + polyline.strokeWidth = 2.0; + + GMSStrokeStyle *greenToRed = [GMSStrokeStyle gradientFromColor:[UIColor clearColor] toColor:[UIColor blackColor]]; + polyline.spans = @[[GMSStyleSpan spanWithStyle:greenToRed]]; + + GMSCoordinateBounds *bounds = [[GMSCoordinateBounds alloc] initWithCoordinate:startLocation coordinate:endLocation]; + UIEdgeInsets insets = UIEdgeInsetsMake(20, 20, 20, 20); + + if ([TiUtils boolValue:@"animate" properties:options]) { + GMSCameraPosition *camera = [self.mapView.mapView cameraForBounds:bounds insets:insets]; + [self.mapView.mapView animateToCameraPosition:camera]; + } else { + [self.mapView.mapView moveCamera:[GMSCameraUpdate fitBounds:bounds withEdgeInsets:insets]]; + } + + return @{ + @"latitude": @(centerCoordinate.latitude), + @"longitude": @(centerCoordinate.longitude) + }; +} + - (NSArray *)annotations { return markers; diff --git a/README.md b/README.md index 6d540f8..3324b30 100644 --- a/README.md +++ b/README.md @@ -52,7 +52,7 @@ const maps = require('ti.googlemaps'); maps.setAPIKey(''); ``` -#### Use 100 % Cross-Platform with Android +#### Use Cross-Platform with Android If you want to use this moduel as a replacement for Ti.Map on iOS, here is how you can have 100 % parity: 1. Create a file called `maps.js` in `app/lib/` (Alloy) or `Resources/` (Classic) with the following content @@ -562,6 +562,17 @@ mapView.addPolyline(polyline); You can get a list of all currently added polylines by using `mapView.polylines`; +##### Rounded Polylines + +If you want rounded polylines (e.g. for simulating a flight direction), you can use the following method to draw the line: + +```js +$.mapView.drawRoundedPolylineBetweenCoordinates({ + coordinates: [ { latitude: 0.0, longitude: 0.0 }, { latitude: 1.0, longitude: 1.0 } ], + options: {} // Unused so far +}); +``` + #### Polygon A polygon is a shape defined by its `points` property. It behaves similiar to a polyline, but is meant to close its area automatically and also supports the `fillColor` property. diff --git a/manifest b/manifest index 8754dc2..db78f20 100644 --- a/manifest +++ b/manifest @@ -2,7 +2,7 @@ # this is your module manifest and used by Titanium # during compilation, packaging, distribution, etc. # -version: 5.4.1 +version: 5.5.0 apiversion: 2 architectures: armv7 arm64 i386 x86_64 description: ti.googlemaps