CODEWITHSUNDEEP
iosgoogle-mapsgradientgoogle-maps-sdk-iosgoogle-polyline
Mando
Mando

Reputation: 11712

Polyline with gradient across width in iOS Google Maps SDK

I have iOS app with the Google Maps SDK integrated. My route has default style and I'm able to change the color to be gradient in length via spans.

Is it possible to update polyline color and define gradient in width instead (like original Google Maps app has)?:

enter image description here

UPDATE: I have added limited version by using two identical polylines with different styles but I'm definitely looking for a better solution: enter image description here

I followed the official documentation and didn't find any references of that.

Upvotes: 4

Views: 4508

Answers (2)

FBC
FBC

Reputation: 1132

You can refer to the documentation for more info: https://developers.google.com/maps/documentation/ios-sdk/shapes

I use for example two gradients from blue to dark(black):

let brandBlue = GMSStrokeStyle.solidColor(.blue)
let nightBlue = GMSStrokeStyle.solidColor(.dark)
let gradientBlue = GMSStrokeStyle.gradient(from: .blue, to: .dark)

polyline.spans = [GMSStyleSpan(style: brandBlue),
                  GMSStyleSpan(style: nightBlue),
                  GMSStyleSpan(style: gradientBlue)]

polyline.map = mainMap.mapView

Upvotes: 2

Jorge
Jorge

Reputation: 1066

I do this:

GMSPath *path = [GMSPath pathFromEncodedPath:overview_route];
GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
polyline.strokeWidth = 5;

GMSStrokeStyle *greenToRed = [GMSStrokeStyle gradientFromColor:[UIColor greenColor] toColor:[UIColor redColor]];
polyline.spans = @[[GMSStyleSpan spanWithStyle:greenToRed]];
polyline.map = self.mapView;

Upvotes: 9

Related Questions