हीटमैप

इस पेज पर हीटमैप सुविधा के बारे में बताया गया है. यह iOS के लिए Maps SDK टूल की सुविधा लाइब्रेरी में उपलब्ध है. हीटमैप की मदद से, मैप पर डेटा पॉइंट के डिस्ट्रिब्यूशन और डेंसिटी को दिखाया जा सकता है.

इस वीडियो में, मार्कर के विकल्प के तौर पर हीटमैप के इस्तेमाल के बारे में बताया गया है. ऐसा तब होता है, जब आपके डेटा को मैप पर बहुत ज़्यादा डेटा पॉइंट की ज़रूरत होती है.

हीटमैप से, दर्शकों के लिए मैप पर डेटा पॉइंट के डिस्ट्रिब्यूशन और उनकी तीव्रता को समझना आसान हो जाता है. हर जगह पर मार्कर लगाने के बजाय, हीटमैप, डेटा के डिस्ट्रिब्यूशन को दिखाने के लिए रंग का इस्तेमाल करते हैं.

नीचे दिए गए उदाहरण में, लाल रंग से ऑस्ट्रेलिया के विक्टोरिया में ज़्यादा पुलिस स्टेशन वाले इलाकों को दिखाया गया है.

अगर आपने अभी तक लाइब्रेरी सेट अप नहीं की है, तो इस पेज का बाकी हिस्सा पढ़ने से पहले, सेटअप गाइड में दिए गए निर्देशों का पालन करें.

आसान हीटमैप जोड़ना

अपने मैप पर हीटमैप जोड़ने के लिए, आपको एक डेटासेट की ज़रूरत होगी जिसमें दिलचस्पी वाली हर जगह के निर्देशांक शामिल हों. सबसे पहले, map प्रॉपर्टी को GMSMapView पर सेट करके, GMUHeatmapTileLayer इंस्टेंस बनाएं. अपने ऐप्लिकेशन के viewDidLoad() फ़ंक्शन में ऐसा करें, ताकि हीटमैप के साथ काम करने से पहले, बुनियादी मैप लोड हो सके. इसके बाद, GMUHeatmapTileLayer इंस्टेंस में GMUWeightedLatLng ऑब्जेक्ट का कलेक्शन पास करें.

यह यूटिलिटी GMUHeatmapTileLayer क्लास उपलब्ध कराती है, जिसमें GMUWeightedLatLng ऑब्जेक्ट का कलेक्शन स्वीकार किया जाता है. यह रेडियस, ग्रेडिएंट, और ओपैसिटी के विकल्पों के आधार पर अलग-अलग ज़ूम लेवल के लिए टाइल इमेज बनाता है.

इन चरणों के बारे में ज़्यादा जानकारी:

1. map प्रॉपर्टी को GMSMapView पर सेट करते हुए, GMUHeatmapTileLayer इंस्टेंस बनाएं (अपने ऐप्लिकेशन के viewDidLoad() फ़ंक्शन में ऐसा करें).
2. GMUHeatmapTileLayer इंस्टेंस में, GMUWeightedLatLng ऑब्जेक्ट का कलेक्शन पास करें.
3. मैप दृश्य पास करते हुए GMUHeatmapTileLayer.map पर कॉल करें.

   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
         

इस उदाहरण के लिए, डेटा को JSON फ़ाइल, police_stations.json में सेव किया गया है. यहां इस फ़ाइल का एक्स्ट्रैक्ट दिया गया है:

[
{"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 }
]

हीटमैप को पसंद के मुताबिक बनाना

हीटमैप में पसंद के मुताबिक बनाई जा सकने वाली कई प्रॉपर्टी हैं. GMUHeatmapTileLayer इंस्टेंस बनाते समय या किसी भी समय विकल्प के लिए नई वैल्यू सेट करके, इन विकल्पों को सेट किया जा सकता है.

ये विकल्प उपलब्ध हैं:

1. दायरा: हीटमैप पर लागू किए गए गॉसियन ब्लर का साइज़, जिसे पिक्सल में दिखाया जाता है. डिफ़ॉल्ट संख्या 20 है. यह 10 से 50 के बीच होना चाहिए. दायरा सेट करने के लिए, GMUHeatmapTileLayer.radius का इस्तेमाल करें.

2. ग्रेडिएंट: हीटमैप अपने कलर मैप को जनरेट करने के लिए जिस रेंज का इस्तेमाल करता है उसकी रेंज, सबसे कम या सबसे ज़्यादा तीव्रता वाली होती है. GMUGradient को पूर्णांक अरे का इस्तेमाल करके बनाया जाता है. इसमें कलर होते हैं. साथ ही, हर कलर के शुरुआती पॉइंट को दिखाने वाला फ़्लोट अरे होता है. इसे ज़्यादा से ज़्यादा इंटेंसिटी के प्रतिशत के रूप में दिखाया जाता है. इसे 0 से 1 के बीच के फ़्रैक्शन में दिखाया जाता है. एक रंग वाले ग्रेडिएंट के लिए आपको सिर्फ़ एक रंग या कई रंगों वाले ग्रेडिएंट के लिए कम से कम दो रंग तय करने होंगे. कलर मैप, उन कलर के बीच इंटरपोलेशन का इस्तेमाल करके जनरेट किया जाता है. डिफ़ॉल्ट ग्रेडिएंट में दो रंग होते हैं. colorMapSize पैरामीटर, ग्रेडिएंट में चरणों की संख्या बताता है. बड़ी संख्याओं का इस्तेमाल करने पर, नतीजों में अच्छे बदलाव दिखते हैं. वहीं दूसरी ओर, छोटी संख्याएं, कॉन्टूर ग्राफ़ की तरह ज़्यादा साफ़ ट्रांज़िशन देती हैं. ग्रेडिएंट सेट करने के लिए GMUHeatmapTileLayer.gradient का इस्तेमाल करें.

3. ओपैसिटी: यह पूरी हीटमैप लेयर की ओपैसिटी है. इसकी रेंज 0 से 1 तक है. डिफ़ॉल्ट सेटिंग 0.7 है. ओपैसिटी वैल्यू को सेट करने के लिए, GMUHeatmapTileLayer.opacity का इस्तेमाल करें.

उदाहरण के लिए, Gradient बनाएं:

let gradientColors: [UIColor] = [.green, .red]
let gradientStartPoints: [NSNumber] = [0.2, 1.0]
heatmapLayer.gradient = GMUGradient(
  colors: gradientColors,
  startPoints: gradientStartPoints,
  colorMapSize: 256
)
      

NSArray<UIColor *> *gradientColors = @[UIColor.greenColor, UIColor.redColor];
NSArray<NSNumber *> *gradientStartPoints = @[@0.2, @1.0];
_heatmapLayer.gradient = [[GMUGradient alloc] initWithColors:gradientColors
                                                 startPoints:gradientStartPoints
                                                colorMapSize:256];
      

किसी मौजूदा हीटमैप की ओपैसिटी बदलने के लिए:

heatmapLayer.opacity = 0.7
      

_heatmapLayer.opacity = 0.7;
      

मौजूदा विकल्प को अपडेट करना

पहले से सेट किए गए किसी विकल्प को अपडेट करने के लिए, यह तरीका अपनाएं:

1. विकल्प को अपनी पसंद की वैल्यू पर अपडेट करें.
2. GMUHeatmapTileLayer.clearTileCache() पर कॉल करें.

डेटासेट में बदलाव करना

उस डेटासेट को बदलने के लिए जिस पर हीटमैप बनाया गया है:

1. डेटा कलेक्शन की जानकारी अपडेट करें. GMUWeightedLatLng का कलेक्शन पास करके, GMUHeatmapTileLayer.weightedData का इस्तेमाल करें.
2. GMUHeatmapTileLayer.clearTileCache() पर कॉल करें.

हीटमैप को हटाना

हीटमैप हटाने के लिए, GMUHeatmapTileLayer.map पर कॉल करें और nil को पास करें.

heatmapLayer.map = nil
      

_heatmapLayer.map = nil;
      

डेमो ऐप्लिकेशन देखें

हीटमैप को लागू करने के एक और उदाहरण के लिए, डेमो ऐप्लिकेशन में HeatmapViewController पर एक नज़र डालें. इसमें यूटिलिटी लाइब्रेरी की सुविधा होती है. सेटअप गाइड में आपको डेमो ऐप्लिकेशन चलाने का तरीका बताया गया है.