Bu sayfada, iOS için Haritalar SDK'sına yönelik yardımcı program kitaplığında bulunan ısı haritası yardımcı programı açıklanmaktadır. Isı haritaları, harita üzerinde veri noktalarının dağılımını ve yoğunluğunu göstermek için kullanışlıdır.
Bu videoda, verileriniz harita üzerinde çok sayıda veri noktası gerektirdiğinde, işaretçilere alternatif olarak ısı haritalarının kullanımı anlatılmaktadır.
Isı haritaları, izleyicilerin harita üzerindeki veri noktalarının dağılımını ve göreceli yoğunluğunu anlamasını kolaylaştırır. Isı haritaları, verilerin dağılımını göstermek için her konuma işaretçi yerleştirmek yerine renklerden yararlanır.
Aşağıdaki örnekte kırmızı renk, Avustralya'nın Victoria kentindeki polis karakollarının yoğun olduğu bölgeleri temsil etmektedir.
Kitaplığı henüz kurmadıysanız bu sayfanın geri kalanını okumadan önce kurulum kılavuzunu uygulayın.
Basit bir ısı haritası ekleme
Haritanıza ısı haritası eklemek için, ilgilenilen her bir konumun koordinatlarını içeren bir veri kümesine ihtiyacınız vardır. Öncelikle map
özelliğini GMSMapView
olarak ayarlayarak bir GMUHeatmapTileLayer
örneği oluşturun.
Isı haritasıyla çalışmaya başlamadan önce temel haritanın yüklendiğinden emin olmak için bu işlemi uygulamanızın viewDidLoad()
işlevinde yapın. Daha sonra, GMUHeatmapTileLayer
örneğine GMUWeightedLatLng
nesne koleksiyonunu iletin.
Yardımcı program, GMUWeightedLatLng
nesne koleksiyonunu kabul eden GMUHeatmapTileLayer
sınıfını sağlar. Sağlanan yarıçap, gradyan ve opaklık seçeneklerine göre
çeşitli yakınlaştırma seviyeleri için karo resimleri oluşturur.
Adımları daha ayrıntılı olarak inceleyelim:
map
özelliğiniGMSMapView
olarak ayarlayarak birGMUHeatmapTileLayer
örneği oluşturun (bunu uygulamanızınviewDidLoad()
işlevinde yapın).GMUHeatmapTileLayer
örneğineGMUWeightedLatLng
nesne koleksiyonunu iletin.- Harita görünümünden geçerek
GMUHeatmapTileLayer.map
numaralı telefonu arayın.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
Bu örnekte, veriler police_stations.json
adlı JSON dosyasında depolanmaktadır.
Dosyadan bir ayıklamayı burada bulabilirsiniz:
[
{"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 }
]
Isı haritasını özelleştirme
Isı haritasının özelleştirilebilir birkaç özelliği vardır. Seçenekleri, GMUHeatmapTileLayer
örneğini oluştururken veya seçenek için yeni bir değer belirleyerek istediğiniz zaman ayarlayabilirsiniz.
Aşağıdaki seçenekler kullanılabilir:
Yarıçap: Isı haritasına uygulanan Gauss bulanıklığının piksel cinsinden boyutu. Varsayılan değer 20'dir. 10 ile 50 arasında olmalıdır. Yarıçapı ayarlamak için
GMUHeatmapTileLayer.radius
değerini kullanın.Gradyan: Isı haritasının renk haritasını oluşturmak için kullandığı, en düşük yoğunluktan en yüksek yoğunluğa kadar değişen bir renk aralığı. Bir
GMUGradient
, renkleri içeren bir tam sayı dizisi ve her rengin başlangıç noktasını gösteren, maksimum yoğunluğun bir yüzdesi olarak verilen ve 0'dan 1'e kesirli olarak ifade edilen bir kayan dizi kullanılarak oluşturulur. Tek renkli renk geçişi için yalnızca bir renk, çok renkli bir renk geçişi için en az iki renk belirtmeniz gerekir. Renk haritası, bu renkler arasındaki interpolasyon kullanılarak oluşturulur. Varsayılan renk geçişinin iki rengi vardır.colorMapSize
parametresi, renk geçişindeki adımların sayısını tanımlar. Büyük sayılar daha yumuşak bir gradyan sağlarken, küçük sayılar, kontur grafiğine benzer şekilde daha keskin geçişler sağlar. Renk geçişini ayarlamak içinGMUHeatmapTileLayer.gradient
öğesini kullanın.Saydamlık: Bu, ısı haritası katmanının tamamının opaklığıdır ve 0 ile 1 arasında değişir. Varsayılan değer 0,7'dir. Opaklık değerini ayarlamak için
GMUHeatmapTileLayer.opacity
öğesini kullanın.
Örneğin, bir Gradient
oluşturun:
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];
Mevcut bir ısı haritasının opaklığını değiştirmek için:
Swift
heatmapLayer.opacity = 0.7
Objective-C
_heatmapLayer.opacity = 0.7;
Mevcut bir seçeneği güncelleme
Önceden ayarlanmış bir seçeneği güncellemek için aşağıdaki adımları uygulayın:
- Seçeneği istediğiniz değere güncelleyin.
GMUHeatmapTileLayer.clearTileCache()
Hizmetleri İçin Arayın.
Veri kümesini değiştirme
Isı haritasını oluştururken temel alınan veri kümesini değiştirmek için:
- Veri koleksiyonunuzu güncelleyin.
GMUWeightedLatLng
dizisini ileterekGMUHeatmapTileLayer.weightedData
işlevini kullanın. GMUHeatmapTileLayer.clearTileCache()
Hizmetleri İçin Arayın.
Isı haritasını kaldırma
Bir ısı haritasını kaldırmak için nil
adlı kişiyi ileterek GMUHeatmapTileLayer.map
numaralı telefonu arayın.
Swift
heatmapLayer.map = nil
Objective-C
_heatmapLayer.map = nil;
Demo uygulamaya göz atın
Isı haritası uygulamasına dair başka bir örnek için, demo uygulamasında yardımcı program kitaplığıyla birlikte gönderilen HeatmapViewController
öğesine göz atın.
Kurulum kılavuzu, demo uygulamayı nasıl çalıştıracağınızı
gösterir.