Kształty

Wybierz platformę: Android iOS JavaScript

Pakiet Maps SDK na iOS oferuje różne sposoby dodawania kształtów do map. Obsługiwane są te kształty:

  • Wielokąt to seria połączonych odcinków linii, które mogą tworzyć dowolny kształt. Można ich używać do oznaczania ścieżek i tras na mapie.
  • Wielokąt to zamknięty kształt, którego można używać do zaznaczania obszarów na mapie.
  • Kół jest projekcją koła na powierzchni Ziemi z zachowaniem dokładności geograficznej.

Wygląd każdego kształtu możesz modyfikować na kilka sposobów.

Linie łamane

Linie złożone umożliwiają rysowanie linii na mapie. Obiekt GMSPolyline reprezentuje uporządkowaną sekwencję lokalizacji wyświetlaną jako seria odcinków linii. Kolor ścieżki złożonej możesz ustawić za pomocą atrybutu GMSStrokeStyle.

Aby utworzyć ścieżkę wieloliniową, musisz określić jej ścieżkę, tworząc odpowiadający obiekt GMSMutablePath z co najmniej 2 punktami. Każdy element CLLocationCoordinate2D reprezentuje punkt na powierzchni Ziemi. Odcinki linii są rysowane między punktami zgodnie z kolejnością ich dodawania do ścieżki. Punkty do ścieżki możesz dodawać za pomocą metod addCoordinate: lub addLatitude:longitude:.

Swift

let path = GMSMutablePath()
path.add(CLLocationCoordinate2D(latitude: -33.85, longitude: 151.20))
path.add(CLLocationCoordinate2D(latitude: -33.70, longitude: 151.40))
path.add(CLLocationCoordinate2D(latitude: -33.73, longitude: 151.41))
let polyline = GMSPolyline(path: path)
      

Objective-C

GMSMutablePath *path = [GMSMutablePath path];
[path addCoordinate:CLLocationCoordinate2DMake(-33.85, 151.20)];
[path addCoordinate:CLLocationCoordinate2DMake(-33.70, 151.40)];
[path addCoordinate:CLLocationCoordinate2DMake(-33.73, 151.41)];
GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
      

Dodawanie linii łamanej

  1. Utwórz obiekt GMSMutablePath.
  2. Ustaw punkty na ścieżce za pomocą metod addCoordinate: lub addLatitude:longitude:.
  3. Utwórz nowy obiekt GMSPolyline, używając ścieżki jako argumentu.
  4. W razie potrzeby ustaw inne właściwości, takie jak strokeWidth i strokeColor.
  5. Ustaw właściwość map elementu GMSPolyline.
  6. Linia złożona pojawi się na mapie.

Ten fragment kodu dodaje na mapie prostokąt:

Swift

let rectanglePath = GMSMutablePath()
rectanglePath.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.0))
rectanglePath.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.0))
rectanglePath.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.2))
rectanglePath.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.2))
rectanglePath.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.0))

let rectangle = GMSPolyline(path: path)
rectangle.map = mapView
      

Objective-C

GMSMutablePath *rectanglePath = [GMSMutablePath path];
[rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.36, -122.0)];
[rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.45, -122.0)];
[rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.45, -122.2)];
[rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.36, -122.2)];
[rectanglePath addCoordinate:CLLocationCoordinate2DMake(37.36, -122.0)];

GMSPolyline *rectangle = [GMSPolyline polylineWithPath:path];
rectangle.map = mapView;
      

Linia łamana prostokątna

Usuwanie linii łamanej

Możesz usunąć ścieżkę wielokąta z mapy, ustawiając właściwość GMSPolyline na nil.map Możesz też usunąć wszystkie nakładki (w tym linie wielowymiarowe i inne kształty) na mapie, wywołując metodę GMSMapView clear.

Swift

mapView.clear()
      

Objective-C

[mapView clear];
      

Dostosowywanie linii łamanej

Obiekt GMSPolyline udostępnia kilka właściwości, które umożliwiają kontrolowanie wyglądu linii. Obsługuje on te opcje:

strokeWidth
Szerokość całej linii w punktach ekranu. Domyślna wartość to 1. Szerokość nie zmienia się, gdy powiększasz mapę.
geodesic
Jeśli YES, wygładź krawędź linii łamanej jako geodezję. Odcinki geodezyjne podążają najkrótszą drogą po powierzchni Ziemi i mogą wyglądać jak zakrzywione linie na mapie w projekcji Mercatora. Odcinki niegeodezyjne są na mapie wyświetlane jako linie proste. Domyślna wartość to NO.
spans
Służy do określania koloru co najmniej 1 sekcji łamany. Właściwość spans jest tablicą obiektów GMSStyleSpan. Ustawienie właściwości spans to preferowany sposób zmiany koloru polilinii.
strokeColor
Obiekt UIColor określający kolor wielokąta. Domyślna wartość to blueColor. Właściwość strokeColor jest ignorowana, jeśli ustawiona jest właściwość spans.

Ten fragment kodu dodaje grubą polilinię z Melbourne do Perth z użyciem interpolacji geodezyjnej.

Swift

let path = GMSMutablePath()
path.addLatitude(-37.81319, longitude: 144.96298)
path.addLatitude(-31.95285, longitude: 115.85734)
let polyline = GMSPolyline(path: path)
polyline.strokeWidth = 10.0
polyline.geodesic = true
polyline.map = mapView
      

Objective-C

GMSMutablePath *path = [GMSMutablePath path];
[path addLatitude:-37.81319 longitude:144.96298];
[path addLatitude:-31.95285 longitude:115.85734];
GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
polyline.strokeWidth = 10.f;
polyline.geodesic = YES;
polyline.map = mapView;
      

Aby zmodyfikować polilinię po jej dodaniu do mapy, nie zwalniaj obiektu GMSPolyline.

Swift

polyline.strokeColor = .blue
      

Objective-C

polyline.strokeColor = [UIColor blueColor];
      

Zmienianie koloru polilinii

Linie złożone są na mapie wyświetlane jako ciągi segmentów. Za pomocą właściwości spans możesz zmienić kolor poszczególnych segmentów lub całej linii. Chociaż ta właściwość zapewnia szczegółową kontrolę nad kolorem polilinii, istnieje kilka udogodnień, które umożliwiają zastosowanie jednego stylu do całej linii.

Fragment kodu poniżej używa metody spanWithColor:, aby zmienić kolor całego wiersza na czerwony.

Swift

polyline.spans = [GMSStyleSpan(color: .red)]
      

Objective-C

polyline.spans = @[[GMSStyleSpan spanWithColor:[UIColor redColor]]];
      

Jeśli masz już dostęp do obiektu GMSStrokeStyle, możesz użyć metody spanWithStyle:.

Swift

let solidRed = GMSStrokeStyle.solidColor(.red)
polyline.spans = [GMSStyleSpan(style: solidRed)]
      

Objective-C

GMSStrokeStyle *solidRed = [GMSStrokeStyle solidColor:[UIColor redColor]];
polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed]];
      

Przed wersją 1.7 pakietu SDK Map na iOS dostępna była tylko jedna właściwość strokeColor, która służyła do ustawiania całego koloru GMSPolyline. Właściwość spans ma pierwszeństwo przed właściwością strokeColor.

Swift

polyline.strokeColor = .red
      

Objective-C

polyline.strokeColor = [UIColor redColor];
      

Style

Jeśli Twoja aplikacja stosuje ten sam kolor obrysu kilka razy, warto zdefiniować styl, który można wielokrotnie używać. Style ścieżek wielopunktowych są określane za pomocą obiektu GMSStrokeStyle. Styl obrysu może być jednolity lub gradientowy. Po utworzeniu stylu możesz zastosować go do GMSStyleSpan za pomocą metody spanWithStyle:.

Swift

// Create two styles: one that is solid blue, and one that is a gradient from red to yellow
let solidBlue = GMSStrokeStyle.solidColor(.blue)
let solidBlueSpan = GMSStyleSpan(style: solidBlue)
let redYellow = GMSStrokeStyle.gradient(from: .red, to: .yellow)
let redYellowSpan = GMSStyleSpan(style: redYellow)
      

Objective-C

// Create two styles: one that is solid blue, and one that is a gradient from red to yellow
GMSStrokeStyle *solidBlue = [GMSStrokeStyle solidColor:[UIColor blueColor]];
GMSStyleSpan *solidBlueSpan = [GMSStyleSpan spanWithStyle:solidBlue];
GMSStrokeStyle *redYellow =
    [GMSStrokeStyle gradientFromColor:[UIColor redColor] toColor:[UIColor yellowColor]];
GMSStyleSpan *redYellowSpan = [GMSStyleSpan spanWithStyle:redYellow];
      

Styl span będzie obowiązywał do końca polilinii lub do ustawienia nowego stylu. Kolor całej linii możesz zmienić, ustawiając właściwość spans łamany na pojedynczy kolor GMSStyleSpan. Przykład pokazuje, jak zastosować gradient na całej długości łamania.

Swift

polyline.spans = [GMSStyleSpan(style: redYellow)]
      

Objective-C

polyline.spans = @[[GMSStyleSpan spanWithStyle:redYellow]];
      

Zmienianie koloru poszczególnych odcinków linii

Jeśli chcesz nadać styl poszczególnym segmentom ścieżki wielosegmentowej, możesz to zrobić, tworząc tablicę obiektów GMSStyleSpan i przekazując ją do właściwości spans. Domyślnie każdy element w tablicy określa kolor odpowiadającego mu odcinka linii. Jeśli w tablicy jest więcej elementów niż segmentów w wierszu, dodatkowe elementy zostaną zignorowane. Jeśli w tablicy jest mniej elementów, ostatni element GMSStyleSpan określa kolor reszty wiersza.

Aby wskazać zmiany na polilinie, takie jak wysokość lub prędkość, możesz użyć bloków kolorów lub gradientowych polilinii. Podany niżej fragment kodu ustawia kolor pierwszych 2 segmentów polilinii na czerwony, a pozostała część linii jest w kolorze gradientowym od czerwonego do żółtego.

Swift

polyline.spans = [
  GMSStyleSpan(style: solidRed),
  GMSStyleSpan(style: solidRed),
  GMSStyleSpan(style: redYellow)
]
      

Objective-C

polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed],
                   [GMSStyleSpan spanWithStyle:solidRed],
                   [GMSStyleSpan spanWithStyle:redYellow]];
      

Aby ustawić styl dla kilku segmentów jednocześnie, możesz użyć metody spanWithStyle:segments:. Na przykład ten kod jest równoważny z powyższym. Długość segmentu w ostatnim GMSStyleSpan jest zawsze ignorowana, ponieważ styl jest używany do opisania reszty linii.

Swift

polyline.spans = [
  GMSStyleSpan(style: solidRed, segments:2),
  GMSStyleSpan(style: redYellow, segments:10)
]
      

Objective-C

polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed segments:2],
                   [GMSStyleSpan spanWithStyle:redYellow segments:10]];
      

Segmenty ułamkowe

Segmenty można też określać jako wartości ułamkowe. Spowoduje to zastosowanie stylu do ułamkowej liczby segmentów, co może spowodować podział jednego segmentu. Każdy element GMSStyleSpan zaczyna się bezpośrednio po poprzednim: w przykładzie poniżej szary kolor zaczyna się od ½ drugiego segmentu i trwa do ½ trzeciego segmentu.

Swift

polyline.spans = [
  GMSStyleSpan(style: solidRed, segments: 2.5),
  GMSStyleSpan(color: .gray),
  GMSStyleSpan(color: .purple, segments: 0.75),
  GMSStyleSpan(style: redYellow)
]
      

Objective-C

polyline.spans = @[[GMSStyleSpan spanWithStyle:solidRed segments:2.5],
                   [GMSStyleSpan spanWithColor:[UIColor grayColor]],
                   [GMSStyleSpan spanWithColor:[UIColor purpleColor] segments:0.75],
                   [GMSStyleSpan spanWithStyle:redYellow]];
      

Dodawanie powtarzającego się wzoru kolorów do linii łamanej

Jeśli chcesz dodać wzór do polilinii, możesz użyć metody pomocniczej GMSStyleSpans w funkcji GMSGeometryUtils. Metoda GMSStyleSpans przyjmuje 2 tablice, które definiują powtarzający się wzór. Jeden z nich określa style, które mają być powtarzane, a drugi – interwał powtórzeń. Połączenie tych dwóch narzędzi pozwala utworzyć wzór, który można zastosować do dowolnej ścieżki wielokąta, niezależnie od jej długości i liczby dostępnych segmentów.

Na przykład poniższy fragment kodu definiuje wielokąt z czarno-białym wzorem na przemian. Jego długości są traktowane jako odległości w metrach wzdłuż linii rhumbów (w Mercatorze jest to linia prosta), ponieważ typ jest określony jako kGMSLengthRhumb.

Swift

let styles = [
  GMSStrokeStyle.solidColor(.white),
  GMSStrokeStyle.solidColor(.black)
]
let lengths: [NSNumber] = [100000, 50000]
polyline.spans = GMSStyleSpans(
  polyline.path!,
  styles,
  lengths,
  GMSLengthKind.rhumb
)
      

Objective-C

NSArray *styles = @[[GMSStrokeStyle solidColor:[UIColor whiteColor]],
                    [GMSStrokeStyle solidColor:[UIColor blackColor]]];
NSArray *lengths = @[@100000, @50000];
polyline.spans = GMSStyleSpans(polyline.path, styles, lengths, kGMSLengthRhumb);
      

Linie łamane z pieczątką sprite

Linie łamane z wykorzystaniem znacznika sprite umożliwiają tworzenie linii łamanych za pomocą powtarzającego się obrazu bitmapy. Kształty są wyświetlane z przezroczystym obrysem tła, ale znacznik nie jest przycinany w narożnikach linii. Dzięki temu można ich używać w takich sytuacjach jak punkty na mapie pokazujące trasy piesze.

Linia łamana z wytłoczonym spritem

Możesz korzystać z tej funkcji, używając elementu GMSSpriteStyle i ustawiając go jako pieczęć za pomocą właściwości GMSStrokeStylestampStyle.

Swift

let path = GMSMutablePath()
path.addLatitude(-37.81319, longitude: 144.96298)
path.addLatitude(-31.95285, longitude: 115.85734)
let polyline = GMSPolyline(path: path)
polyline.strokeWidth = 20
let image = UIImage(named: "imageFromBundleOrAsset")! // Image could be from anywhere
let stampStyle = GMSSpriteStyle(image: image)
let transparentStampStroke = GMSStrokeStyle.transparentStroke(withStamp: stampStyle)
let span = GMSStyleSpan(style: transparentStampStroke)
polyline.spans = [span]
polyline.map = mapView
      

Objective-C

GMSMutablePath *path = [GMSMutablePath path];
[path addLatitude:-37.81319 longitude:144.96298];
[path addLatitude:-31.95285 longitude:115.85734];
polyline.strokeWidth = 20;
GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];

UIImage *image = [UIImage imageNamed:@"imageFromBundleOrAsset"];
GMSStrokeStyle *transparentStampStroke = [GMSStrokeStyle transparentStrokeWithStampStyle:[GMSSpriteStyle spriteStyleWithImage:image]];

GMSStyleSpan *span = [GMSStyleSpan spanWithStyle:transparentStampStroke];
polyline.spans = @[span];
polyline.map = _mapView;
      

Linie łamane z tłoczeniami tekstur

Linie łamane z tłoczeniem tekstury umożliwiają tworzenie linii łamanych za pomocą powtarzanej tekstury. Kształty mogą być wyświetlane z przezroczystym, jednolitym kolorem lub gradientem tła. Tekstura zmienia rozmiar wraz ze zmianą poziomu powiększenia. Obrazy na końcu lub na początku ścieżek lub punktów ścieżki są przycinane przy określonych poziomach powiększenia.

Teksturowana linia łamana

Możesz korzystać z tej funkcji, używając GMSTextureStyle i ustawiając go jako pieczęć za pomocą właściwości stampStyle GMSStrokeStyle.

Swift

let path = GMSMutablePath()
path.addLatitude(-37.81319, longitude: 144.96298)
path.addLatitude(-31.95285, longitude: 115.85734)
let polyline = GMSPolyline(path: path)
polyline.strokeWidth = 20
let redWithStamp = GMSStrokeStyle.solidColor(.red)
let image = UIImage(named: "imageFromBundleOrAsset")! // Image could be from anywhere
redWithStamp.stampStyle = GMSTextureStyle(image: image)
let span = GMSStyleSpan(style: redWithStamp)
polyline.spans = [span]
polyline.map = mapView
      

Objective-C

GMSMutablePath *path = [GMSMutablePath path];
[path addLatitude:-37.81319 longitude:144.96298];
[path addLatitude:-31.95285 longitude:115.85734];
GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
polyline.strokeWidth = 20;
GMSStrokeStyle *redWithStamp = [GMSStrokeStyle solidColor:[UIColor redColor]];

UIImage *image = [UIImage imageNamed:@"imageFromBundleOrAsset"]; // Image could be from anywhere
redWithStamp.stampStyle = [GMSTextureStyle textureStyleWithImage:image];

GMSStyleSpan *span = [GMSStyleSpan spanWithStyle:redWithStamp];
polyline.spans = @[span];
polyline.map = _mapView;
      

Możliwości mapy

Właściwość mapCapabilitiesGMSMapView umożliwia programowe sprawdzanie funkcji związanych z mapami. Jest to przydatne, gdy chcesz sprawdzić, czy określone mapy capabilities są dostępne przed wywołaniem określonych interfejsów API. To zapytanie określa, czy widok mapy obsługuje linie wielokątów z pieczątką sprite.

Swift

let path = GMSMutablePath()
path.addLatitude(-37.81319, longitude: 144.96298)
path.addLatitude(-31.95285, longitude: 115.85734)
let polyline = GMSPolyline(path: path)
polyline.strokeWidth = 20
let image = UIImage(named: "imageFromBundleOrAsset")! // Image could be from anywhere
let spans: [GMSStyleSpan]
if (mapView.mapCapabilities.contains(.spritePolylines)) {
  let spriteStyle = GMSSpriteStyle(image: image)
  let stroke = GMSStrokeStyle.transparentStroke(withStamp: spriteStyle)
  spans = [ GMSStyleSpan(style: stroke) ]
} else {
  let stroke = GMSStrokeStyle.solidColor(.clear)
  stroke.stampStyle = GMSTextureStyle(image: image)
  spans = [ GMSStyleSpan(style: stroke) ]
}
polyline.spans = spans
polyline.map = mapView
      

Objective-C

GMSMutablePath *path = [GMSMutablePath path];
[path addLatitude:-37.81319 longitude:144.96298];
[path addLatitude:-31.95285 longitude:115.85734];

UIImage *_Nonnull image = [UIImage imageNamed:@"imageFromBundleOrAsset"]; // Image could be from anywhere

NSArray<GMSStyleSpan *> * spans;
if (_mapView.mapCapabilities & GMSMapCapabilityFlagsSpritePolylines) {
  GMSSpriteStyle *spriteStyle = [GMSSpriteStyle spriteStyleWithImage:image];
  GMSStrokeStyle *stroke = [GMSStrokeStyle transparentStrokeWithStampStyle:spriteStyle];
  spans = @[ [GMSStyleSpan spanWithStyle:stroke] ];
} else {
  GMSStrokeStyle *stroke = [GMSStrokeStyle solidColor:UIColor.clearColor];
  stroke.stampStyle = [GMSTextureStyle textureStyleWithImage:image];
  spans = @[ [GMSStyleSpan spanWithStyle:stroke] ];
}

GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
polyline.strokeWidth = 20;
polyline.spans = spans;
polyline.map = _mapView;
      

Ten wzór umożliwia subskrybowanie zmian i reagowanie na aktualizacje za pomocą stanu widoku mapy. Aby uzyskać informacje o dostępności funkcji, możesz też wdrożyć didChangeMapCapabilities na stronie GMSMapViewDelegate.

Wielokąty

Wielokąty są podobne do linii łamanych, ponieważ składają się z kolejności uporządkowanych współrzędnych. Jednak zamiast być otwarte, są one zaprojektowane tak, aby definiować pełne obszary w zamkniętej pętli. Wielokąty są definiowane w pakiecie Maps SDK na iOS za pomocą klasy GMSPolygon.

Możesz dodać GMSPolygon do mapy w taki sam sposób jak GMSPolyline. Najpierw określ jej ścieżkę, tworząc odpowiedni obiekt GMSMutablePath i dodając do niego punkty. Te punkty tworzą kontur wielokąta. Każdy element CLLocationCoordinate2D reprezentuje punkt na powierzchni Ziemi. Odcinki linii są rysowane między punktami zgodnie z kolejnością ich dodawania do ścieżki.

Dodaj wielokąt

  1. Utwórz obiekt GMSMutablePath.
  2. Ustaw punkty na ścieżce za pomocą metod addCoordinate: lub addLatitude:longitude:. Te punkty tworzą kontur wielokąta.
  3. Utwórz nowy obiekt GMSPolygon, używając ścieżki jako argumentu.
  4. W razie potrzeby ustaw inne właściwości, takie jak strokeWidth, strokeColor i fillColor.
  5. Przypisz wielokąt do obiektu GMSMapView, ustawiając właściwość GMSPolygon.map.
  6. Poligon pojawi się na mapie.

Ten fragment kodu dodaje prostokąt do mapy.

Swift

// Create a rectangular path
let rect = GMSMutablePath()
rect.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.0))
rect.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.0))
rect.add(CLLocationCoordinate2D(latitude: 37.45, longitude: -122.2))
rect.add(CLLocationCoordinate2D(latitude: 37.36, longitude: -122.2))

// Create the polygon, and assign it to the map.
let polygon = GMSPolygon(path: rect)
polygon.fillColor = UIColor(red: 0.25, green: 0, blue: 0, alpha: 0.05);
polygon.strokeColor = .black
polygon.strokeWidth = 2
polygon.map = mapView
      

Objective-C

// Create a rectangular path
GMSMutablePath *rect = [GMSMutablePath path];
[rect addCoordinate:CLLocationCoordinate2DMake(37.36, -122.0)];
[rect addCoordinate:CLLocationCoordinate2DMake(37.45, -122.0)];
[rect addCoordinate:CLLocationCoordinate2DMake(37.45, -122.2)];
[rect addCoordinate:CLLocationCoordinate2DMake(37.36, -122.2)];

// Create the polygon, and assign it to the map.
GMSPolygon *polygon = [GMSPolygon polygonWithPath:rect];
polygon.fillColor = [UIColor colorWithRed:0.25 green:0 blue:0 alpha:0.05];
polygon.strokeColor = [UIColor blackColor];
polygon.strokeWidth = 2;
polygon.map = mapView;
      

Wygląd wielokąta możesz dostosować zarówno przed dodaniem go do mapy, jak i po dodaniu.

Usuwanie wielokąta

Usuń wielokąt, ustawiając jego właściwość GMSPolygon.map na nil i odłączając layer od jego elementu nadrzędnego.

Swift

 polygon.map = nil
 polygon.layer.removeFromSuperLayer()

Objective-C

 polygon.map = nil;
 [polygon.layer removeFromSuperlayer];
 

Kręgi

Oprócz ogólnej klasy GMSPolygon pakiet SDK Maps na iOS zawiera też klasę GMSCircle, która umożliwia rysowanie okręgów na powierzchni Ziemi.

Aby utworzyć okrąg, musisz określić te 2 właściwości:

  • position jako CLLocationCoordinate2D.
  • radius w metrach.

Okrąg jest wtedy zdefiniowany jako zbiór wszystkich punktów na powierzchni Ziemi, które znajdują się w odległości radius metrów od danego center. Ze względu na to, jak projekcja Mercatora używana przez interfejs API Map Google renderuje kulę na płaskiej powierzchni, na mapie wygląda ona jak prawie idealne koło, gdy znajduje się w pobliżu równika, a im dalej od równika, tym coraz mniej okrągła (na ekranie).

Dodawanie kręgu

Ten fragment kodu dodaje do mapy okrąg:

Swift

let circleCenter = CLLocationCoordinate2D(latitude: 37.35, longitude: -122.0)
let circle = GMSCircle(position: circleCenter, radius: 1000)
circle.map = mapView
      

Objective-C

CLLocationCoordinate2D circleCenter = CLLocationCoordinate2DMake(37.35, -122.0);
GMSCircle *circle = [GMSCircle circleWithPosition:circleCenter
                                         radius:1000];
circle.map = mapView;
      

Wygląd kręgu możesz dostosować zarówno przed dodaniem go do mapy, jak i po dodaniu.

Dostosowywanie kręgu

Niestandardowe kolory i szerokość kreski możesz określić, modyfikując właściwości GMSCircle. Obsługuje on te opcje:

fillColor
Obiekt UIColor określający kolor wnętrza koła. Domyślnie jest przezroczysty.
strokeColor
Obiekt UIColor określający kolor obrysu koła. Domyślna wartość to blackColor.
strokeWidth
Grubość obrysu koła w punktach ekranu. Domyślna wartość to 1. Grubość nie zmienia się, gdy powiększasz mapę.

Ten fragment kodu dodaje grube czerwone kółko z półprzezroczystym czerwonym wnętrzem.

Swift

circle.fillColor = UIColor(red: 0.35, green: 0, blue: 0, alpha: 0.05)
circle.strokeColor = .red
circle.strokeWidth = 5
      

Objective-C

circle.fillColor = [UIColor colorWithRed:0.25 green:0 blue:0 alpha:0.05];
circle.strokeColor = [UIColor redColor];
circle.strokeWidth = 5;
      

Tworzenie pustego wielokąta

Możesz połączyć kilka ścieżek w jednym obiekcie GMSPolygon, aby tworzyć złożone kształty, takie jak wypełnione pierścienie lub pączki (gdzie obszary wielokątne pojawiają się wewnątrz wielokąta jako osobne kształty). Kształty złożone powstają z kompozycji wielu ścieżek.

Utwórz wielokąt z ścieżką, która określa największy obszar objęty wielokątem. Następnie określ właściwość holes wielokąta jako tablicę co najmniej 1 obiektu GMSPath, która definiuje otwory w wielokącie.

Jeśli mniejsza ścieżka jest całkowicie otoczona przez większą ścieżkę, wygląda to tak, jakby część wielokąta została usunięta.

Ten przykładowy kod tworzy wielokąt z 2 otworami:

Swift

let hydeParkLocation = CLLocationCoordinate2D(latitude: -33.87344, longitude: 151.21135)
let camera = GMSCameraPosition.camera(withTarget: hydeParkLocation, zoom: 16)
let mapView = GMSMapView.map(withFrame: .zero, camera: camera)
mapView.animate(to: camera)

let hydePark = "tpwmEkd|y[QVe@Pk@BsHe@mGc@iNaAKMaBIYIq@qAMo@Eo@@[Fe@DoALu@HUb@c@XUZS^ELGxOhAd@@ZB`@J^BhFRlBN\\BZ@`AFrATAJAR?rAE\\C~BIpD"
let archibaldFountain = "tlvmEqq|y[NNCXSJQOB[TI"
let reflectionPool = "bewmEwk|y[Dm@zAPEj@{AO"

let hollowPolygon = GMSPolygon()
hollowPolygon.path = GMSPath(fromEncodedPath: hydePark)
hollowPolygon.holes = [GMSPath(fromEncodedPath: archibaldFountain)!, GMSPath(fromEncodedPath: reflectionPool)!]
hollowPolygon.fillColor = UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 0.2)
hollowPolygon.strokeColor = UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 1.0)
hollowPolygon.strokeWidth = 2
hollowPolygon.map = mapView
      

Objective-C

CLLocationCoordinate2D hydeParkLocation = CLLocationCoordinate2DMake(-33.87344, 151.21135);
GMSCameraPosition *camera = [GMSCameraPosition cameraWithTarget:hydeParkLocation
                                                           zoom:16];
mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];

NSString *hydePark = @"tpwmEkd|y[QVe@Pk@BsHe@mGc@iNaAKMaBIYIq@qAMo@Eo@@[Fe@DoALu@HUb@c@XUZS^ELGxOhAd@@ZB`@J^BhFRlBN\\BZ@`AFrATAJAR?rAE\\C~BIpD";
NSString *archibaldFountain = @"tlvmEqq|y[NNCXSJQOB[TI";
NSString *reflectionPool = @"bewmEwk|y[Dm@zAPEj@{AO";

GMSPolygon *hollowPolygon = [[GMSPolygon alloc] init];
hollowPolygon.path = [GMSPath pathFromEncodedPath:hydePark];
hollowPolygon.holes = @[[GMSPath pathFromEncodedPath:archibaldFountain],
                  [GMSPath pathFromEncodedPath:reflectionPool]];
hollowPolygon.fillColor = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:0.2];
hollowPolygon.strokeColor = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:1.0];
hollowPolygon.strokeWidth = 2;
hollowPolygon.map = mapView;