Esta página descreve o utilitário de mapa de calor disponível no utilitário para a SDK do Maps para iOS. Os mapas de calor são úteis para representar a distribuição e densidade de pontos de dados em um mapa.
Este vídeo fala sobre o uso de mapas de calor como uma alternativa aos marcadores quando os dados exigem um grande número de pontos de dados no mapa.
Os mapas de calor permitem que os visualizadores compreendam com mais facilidade a distribuição e as taxas intensidade dos pontos de dados em um mapa. Em vez de colocar um marcador em cada os mapas de calor usam cores para representar a distribuição dos dados.
No exemplo abaixo, o vermelho representa as áreas de alta concentração de polícia em Victoria, Austrália.
![Um mapa com mapa de calor mostrando a localização de delegacias de polícia](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/documentation/ios-sdk/images/heatmap-ios.png?authuser=0000&hl=pt)
Se você ainda não configurou a biblioteca, siga as instruções de configuração guia antes de ler o restante nesta página.
Adicionar um mapa de calor simples
Para adicionar um mapa de calor ao mapa, você precisará de um conjunto de dados que consista nas seguintes informações:
coordenadas para cada local de interesse. Primeiro, crie um
Instância do GMUHeatmapTileLayer
, definindo a propriedade map
como GMSMapView
.
Faça isso na função viewDidLoad()
do seu app para garantir que o mapa de base seja
carregado antes de trabalhar com o mapa de calor. Em seguida, passe uma coleção de
Objetos GMUWeightedLatLng
para a instância GMUHeatmapTileLayer
.
O utilitário fornece a classe GMUHeatmapTileLayer
, que aceita uma
coleção de objetos GMUWeightedLatLng
. Ele cria as imagens de bloco para
vários níveis de zoom, com base nas opções de raio, gradiente e opacidade
fornecidos.
Mais detalhes das etapas:
- Crie uma instância
GMUHeatmapTileLayer
, definindo a propriedademap
como umGMSMapView
. Faça isso na funçãoviewDidLoad()
do app. - Transmita uma coleção de objetos
GMUWeightedLatLng
para oGMUHeatmapTileLayer
. - Chame
GMUHeatmapTileLayer.map
, transmitindo a visualização de mapa.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
Neste exemplo, os dados são armazenados em um arquivo JSON, police_stations.json
.
Este é um trecho do arquivo:
[
{"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 }
]
Como personalizar o mapa de calor
O mapa de calor tem várias propriedades personalizáveis. É possível definir as opções
inicialmente criando a instância GMUHeatmapTileLayer
ou a qualquer momento
definindo um novo valor para a opção.
As seguintes opções estão disponíveis:
Raio:o tamanho do desfoque gaussiano aplicado ao mapa de calor, expresso em pixels. O padrão é 20. O valor precisa estar entre 10 e 50. Usar
GMUHeatmapTileLayer.radius
para definir o raio.Gradiente:um intervalo de cores usado pelo mapa de calor para gerar cor. mapa, variando da menor para a maior intensidade. Um
GMUGradient
é criado usando uma matriz de números inteiros contendo as cores e uma matriz flutuante indicando as ponto de partida para cada cor, fornecido como uma porcentagem da intensidade máxima, expresso como uma fração de 0 a 1. Você precisa especificar apenas uma cor para um gradiente de uma cor ou um mínimo de duas cores para um gradiente gradiente. O mapa de cores é gerado usando interpolação entre essas cores. O gradiente padrão tem duas cores. O parâmetrocolorMapSize
define o número de etapas no gradiente. Números maiores resultam em um resultado gradiente, enquanto números menores geram transições mais nítidas, de contorno. UseGMUHeatmapTileLayer.gradient
para definir o gradiente.Opacidade:é a opacidade de toda a camada do mapa de calor, e os intervalos de 0 a 1. O padrão é 0,7. Use
GMUHeatmapTileLayer.opacity
para definir valor de opacidade.
Por exemplo, crie um 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];
Para alterar a opacidade de um mapa de calor existente:
Swift
heatmapLayer.opacity = 0.7
Objective-C
_heatmapLayer.opacity = 0.7;
Atualizar uma opção existente
Para atualizar uma opção já definida, siga estas etapas:
- Atualize a opção para o valor desejado.
- Ligue para a
GMUHeatmapTileLayer.clearTileCache()
.
Como alterar o conjunto de dados
Para alterar o conjunto de dados em que um mapa de calor é criado:
- Atualize sua coleta de dados. Use
GMUHeatmapTileLayer.weightedData
, transmitindo uma matriz deGMUWeightedLatLng
. - Ligue para a
GMUHeatmapTileLayer.clearTileCache()
.
Como remover um mapa de calor
Para remover um mapa de calor, chame GMUHeatmapTileLayer.map
, transmitindo nil
.
Swift
heatmapLayer.map = nil
Objective-C
_heatmapLayer.map = nil;
Conferir o app de demonstração
Para ver outro exemplo de implementação
de um mapa de calor, dê uma olhada na
HeatmapViewController
no app de demonstração que acompanha a biblioteca de utilitários.
O guia de configuração mostra como
execute o app de demonstração.