Na tej stronie opisujemy narzędzie mapy termicznej dostępne w narzędziu dla Maps SDK na iOS. Mapy termiczne są przydatne do reprezentowania rozkładu gęstości punktów danych na mapie.
W tym filmie omawiamy zastosowanie map termicznych jako alternatywy dla znaczników, gdy wymaga dużej liczby punktów danych na mapie.
Mapy termiczne ułatwiają widzom zrozumienie rozkładu i względu intensywność punktów danych na mapie. Zamiast umieszczać znacznik przy każdym lokalizacja, mapy termiczne używają kolorów do reprezentowania rozkładu danych.
W przykładzie poniżej czerwony kolor oznacza obszary o wysokim stężeniu policji. stacji radiowej w Wiktorii w Australii.
![Mapa z mapą termiczną pokazującą lokalizację komisariatów policji](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/documentation/ios-sdk/images/heatmap-ios.png?authuser=19&hl=pl)
Jeśli biblioteka nie została jeszcze skonfigurowana, wykonaj te czynności, aby ją skonfigurować , zanim przeczytasz resztę tę stronę.
Dodawanie prostej mapy termicznej
Aby dodać mapę termiczną do swojej mapy, potrzebujesz zbioru danych składających się z
dla każdej interesującej lokalizacji. Najpierw utwórz
GMUHeatmapTileLayer
przez ustawienie właściwości map
na wartość GMSMapView
.
Zrób to w funkcji viewDidLoad()
aplikacji, aby mieć pewność, że mapa podstawowa jest
załadowano przed rozpoczęciem pracy z mapą termiczną. Następnie przekaż kolekcję
GMUWeightedLatLng
obiektów do instancji GMUHeatmapTileLayer
.
Narzędzie dostarcza klasę GMUHeatmapTileLayer
, która akceptuje
kolekcja GMUWeightedLatLng
obiektów. Tworzy ona obrazki
różnych poziomów powiększenia w zależności od opcji promienia, gradientu i przezroczystości.
podane.
Przyjrzyjmy się poszczególnym krokom:
- Utwórz instancję
GMUHeatmapTileLayer
, ustawiając właściwośćmap
naGMSMapView
(zrób to w funkcjiviewDidLoad()
aplikacji). - Przekaż kolekcję
GMUWeightedLatLng
obiektów doGMUHeatmapTileLayer
instancję. - Zadzwoń pod numer
GMUHeatmapTileLayer.map
, przekazując widok mapy.Swift
class Heatmap: UIViewController { private var mapView: GMSMapView! private var heatmapLayer: GMUHeatmapTileLayer! override func viewDidLoad() { super.viewDidLoad() heatmapLayer = GMUHeatmapTileLayer() heatmapLayer.map = mapView } // ... func addHeatmap() { // Get the data: latitude/longitude positions of police stations. guard let path = Bundle.main.url(forResource: "police_stations", withExtension: "json") else { return } guard let data = try? Data(contentsOf: path) else { return } guard let json = try? JSONSerialization.jsonObject(with: data, options: []) else { return } guard let object = json as? [[String: Any]] else { print("Could not read the JSON.") return } var list = [GMUWeightedLatLng]() for item in object { let lat = item["lat"] as! CLLocationDegrees let lng = item["lng"] as! CLLocationDegrees let coords = GMUWeightedLatLng( coordinate: CLLocationCoordinate2DMake(lat, lng), intensity: 1.0 ) list.append(coords) } // Add the latlngs to the heatmap layer. heatmapLayer.weightedData = list } }
Objective-C
@implementation Heatmap { GMSMapView *_mapView; GMUHeatmapTileLayer *_heatmapLayer; } - (void)viewDidLoad { [super viewDidLoad]; _heatmapLayer = [[GMUHeatmapTileLayer alloc] init]; _heatmapLayer.map = _mapView; } // ... - (void) addHeatmap { // Get the data: latitude/longitude positions of police stations. NSURL *path = [NSBundle.mainBundle URLForResource:@"police_stations" withExtension:@"json"]; NSData *data = [NSData dataWithContentsOfURL:path]; NSArray *json = [NSJSONSerialization JSONObjectWithData:data options:0 error:nil]; NSMutableArray<GMUWeightedLatLng *> *list = [[NSMutableArray alloc] init]; [json enumerateObjectsUsingBlock:^(id _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) { NSDictionary *item = (NSDictionary *)obj; CLLocationDegrees lat = [(NSNumber *) [item valueForKey:@"lat"] doubleValue]; CLLocationDegrees lng = [(NSNumber *) [item valueForKey:@"lng"] doubleValue]; GMUWeightedLatLng *coords = [[GMUWeightedLatLng alloc] initWithCoordinate:CLLocationCoordinate2DMake(lat, lng) intensity:1.0]; [list addObject:coords]; }]; // Add the latlngs to the heatmap layer. _heatmapLayer.weightedData = list; } @end
W tym przykładzie dane są przechowywane w pliku JSON police_stations.json
.
Oto fragment pliku:
[
{"lat" : -37.1886, "lng" : 145.708 } ,
{"lat" : -37.8361, "lng" : 144.845 } ,
{"lat" : -38.4034, "lng" : 144.192 } ,
{"lat" : -38.7597, "lng" : 143.67 } ,
{"lat" : -36.9672, "lng" : 141.083 }
]
Dostosowywanie mapy termicznej
Mapa termiczna ma kilka właściwości, które można dostosować. Możesz ustawić te opcje, gdy:
po utworzeniu instancji GMUHeatmapTileLayer
lub w dowolnym momencie przez
ustawienie nowej wartości opcji.
Dostępne są te ustawienia:
Promień: rozmiar rozmycia Gaussa zastosowanego do mapy termicznej, wyrażony. w pikselach. Wartością domyślną jest 20. Wymagana wartość z zakresu od 10 do 50. Używaj
GMUHeatmapTileLayer.radius
, aby ustawić promień.Gradient: zakres kolorów używanych przez mapę termiczną do generowania koloru. w skali od najniższej do największej intensywności. Element
GMUGradient
jest tworzony za pomocą tablicę całkowitą zawierającą kolory, a także tablicę zmiennoprzecinkową, która wskazuje punkt początkowy każdego koloru, podany jako procent maksymalnej intensywności, i wyrażona jako ułamek od 0 do 1. Możesz określić tylko jeden kolor dla jednokolorowego gradientu, a w przypadku wielokolorowego – co najmniej dwóch kolorów. gradientu. Mapa kolorów jest generowana przy użyciu interpolacji między tymi kolorami. Domyślny gradient ma 2 kolory. ParametrcolorMapSize
określa liczby kroków w gradientie. Większe wartości oznaczają płynniejsze działanie gradientu, a mniejsze liczby dają wyraźniejsze przejścia podobne do tych wykres konturowy. Użyj funkcjiGMUHeatmapTileLayer.gradient
, aby ustawić gradient.Przezroczystość: przezroczystość całej warstwy mapy termicznej i zakresów od 0 do 1. Wartość domyślna to 0,7. Użyj
GMUHeatmapTileLayer.opacity
, aby ustawić przezroczystości.
Na przykład utwórz Gradient
:
Swift
let gradientColors: [UIColor] = [.green, .red] let gradientStartPoints: [NSNumber] = [0.2, 1.0] heatmapLayer.gradient = GMUGradient( colors: gradientColors, startPoints: gradientStartPoints, colorMapSize: 256 )
Objective-C
NSArray<UIColor *> *gradientColors = @[UIColor.greenColor, UIColor.redColor]; NSArray<NSNumber *> *gradientStartPoints = @[@0.2, @1.0]; _heatmapLayer.gradient = [[GMUGradient alloc] initWithColors:gradientColors startPoints:gradientStartPoints colorMapSize:256];
Aby zmienić przezroczystość istniejącej mapy termicznej:
Swift
heatmapLayer.opacity = 0.7
Objective-C
_heatmapLayer.opacity = 0.7;
Aktualizowanie istniejącej opcji
Aby zaktualizować opcję, która została już ustawiona, wykonaj te czynności:
- Ustaw odpowiednią wartość opcji.
- Zadzwoń do firmy
GMUHeatmapTileLayer.clearTileCache()
.
Zmiana zbioru danych
Aby zmienić zbiór danych, na którym jest tworzona mapa termiczna:
- Zaktualizuj zbieranie danych. Użyj karty
GMUHeatmapTileLayer.weightedData
z pomyślnym wynikiem tablicę o wartościGMUWeightedLatLng
. - Zadzwoń do firmy
GMUHeatmapTileLayer.clearTileCache()
.
Usuwanie mapy termicznej
Aby usunąć mapę termiczną, wywołaj GMUHeatmapTileLayer.map
z wynikiem pozytywnym nil
.
Swift
heatmapLayer.map = nil
Objective-C
_heatmapLayer.map = nil;
Zobacz aplikację w wersji demonstracyjnej
Innym przykładem implementacji mapy termicznej jest
HeatmapViewController
w aplikacji demonstracyjnej, która jest częścią biblioteki narzędziowej.
Z przewodnika konfiguracji dowiesz się, jak
uruchom aplikację w wersji demonstracyjnej.