टाइल की लेयर

प्लैटफ़ॉर्म चुनें: Android iOS JavaScript

आप अपने मैप के ऊपर टाइल लेयर के रूप में इमेज जोड़ सकते हैं. टाइल लेयर, मैप टाइल के ऊपर खास ज़ूम लेवल पर लगाई जाती हैं. ज़रूरत के मुताबिक टाइल होने पर, पूरे मैप के लिए Google के मैप डेटा को कई ज़ूम लेवल पर जोड़ा जा सकता है.

शुरुआती जानकारी

टाइल लेयर (कई बार इन्हें टाइल ओवरले भी कहा जाता है) की मदद से, Google की बुनियादी मैप टाइल के ऊपर इमेज को सुपरइंपोज़ किया जा सकता है. यह आपके ऐप्लिकेशन में डेटा, जैसे कि लोकप्रिय जगहों या ट्रैफ़िक की जानकारी और स्थानीय तस्वीरें जोड़ने का शानदार तरीका है. इसे kGMSTypeNone के मैप टाइप के साथ जोड़ने पर, टाइल लेयर की मदद से Google के बुनियादी मैप डेटा की जगह अपने डेटा लेयर का इस्तेमाल किया जा सकता है.

टाइल लेयर का इस्तेमाल करना तब फ़ायदेमंद होता है, जब आपको मैप पर, आम तौर पर बड़े भौगोलिक क्षेत्र की विस्तृत तस्वीरें जोड़नी हों. इसके उलट, ग्राउंड ओवरले तब काम आता है, जब आपको मैप पर एक ही जगह पर मौजूद इमेज को ठीक करना हो.

टाइल कोऑर्डिनेट

Maps API, हर ज़ूम लेवल पर मौजूद तस्वीरों को स्क्वेयर मैप टाइल के सेट में बांटता है. ये टाइल, क्रम वाले ग्रिड में होती हैं. जब कोई मैप स्क्रोल करके किसी नई जगह या नए ज़ूम लेवल पर जाता है, तो Maps API तय करता है कि कौनसी टाइल की ज़रूरत है. इसके बाद, वह उसे वापस पाने के लिए टाइल के सेट में बदल देता है.

Google के मर्केटर प्रोजेक्शन को लागू करने के लिए, निर्देशांक (0,0) वाली टाइल हमेशा मैप के उत्तर-पश्चिम कोने में रहती है. इसमें x की वैल्यू पश्चिम से पूर्व से बढ़ती है और y वैल्यू, उत्तर से दक्षिण तक बढ़ती है. टाइल को उस ऑरिजिन के x,y निर्देशांक इस्तेमाल करके इंडेक्स किया जाता है. उदाहरण के लिए, ज़ूम लेवल 2 पर, जब पृथ्वी को 16 टाइल में बांटा जाता है, तो हर टाइल को एक खास x,y जोड़े से देखा जा सकता है:

दुनिया का मैप, जिसे चार पंक्तियों और चार कॉलम में टाइलों से बांटा गया है.

हर मैप की टाइल 256x256 पॉइंट स्क्वेयर की होती है. ज़ूम स्तर 0 पर, पूरी दुनिया एक टाइल में रेंडर हो जाती है. हर ज़ूम लेवल, ज़ूम करने की सुविधा को दो फ़ैक्टर से बढ़ा देता है. इसलिए, ज़ूम लेवल 1 पर मैप को टाइल के 2x2 ग्रिड या ज़ूम लेवल 2 पर 4x4 ग्रिड, ज़ूम लेवल 3 पर 8x8 ग्रिड वगैरह के तौर पर दिखाया जाएगा. अगर आपको टाइल लेयर के लिए इमेज बनानी हैं, तो आपको हर उस ज़ूम लेवल के लिए 256x256 पॉइंट वाली नई इमेज बनानी होगी जिस पर आपको काम करना है.

टाइल लेयर जोड़ना

  1. GMSURLTileLayer ऑब्जेक्ट या GMSTileLayer/GMSSyncTileLayer की कस्टम सब-क्लास को इंस्टैंशिएट करें.
  2. इसके अलावा, अन्य टाइल लेयर के हिसाब से इसकी जगह बदलने के लिए, zIndex प्रॉपर्टी में बदलाव करें. हालांकि, ऐसा करना ज़रूरी नहीं है.
  3. GMSTileLayer ऑब्जेक्ट को मैप पर असाइन करने के लिए, उसकी map प्रॉपर्टी सेट करें.

iOS के लिए Maps SDK टूल में तीन क्लास मिलती हैं. इनका इस्तेमाल, टाइल लेयर को लागू करने के लिए किया जा सकता है. हर क्लास के साथ, आपको यह बताना होगा कि {x,y,zoom} कोऑर्डिनेट के दिए गए सेट के लिए, सही मैप टाइल को कैसे फ़ेच करना है. ये विकल्प उपलब्ध हैं:

  • GMSSyncTileLayer सब-क्लास, tileForX:y:zoom को लागू करने की सुविधा देती है जो UIImage इंस्टेंस दिखाता है.
  • GMSTileLayer सब-क्लास, जिसमें एसिंक्रोनस तरीके requestTileForX:y:zoom को लागू किया जाता है. यह बाद में, टाइल इमेज के साथ कॉल करता है.
  • मौजूदा क्लास GMSURLTileLayer का इस्तेमाल करके, यूआरएल से टाइल अपने-आप फ़ेच करें. ऐसा करने के लिए, GMSTileURLConstructor ब्लॉक उपलब्ध कराएं. GMSURLTileLayer एक कंक्रीट क्लास है, जिसे सब-क्लास नहीं किया जा सकता.

GMSSyncTileLayer या GMSTileLayer को सब-क्लास करने के मामले में, nil टाइल वाला नतीजा देने पर, iOS के लिए Maps SDK टूल को यह जानकारी मिलेगी कि फ़िलहाल डेटा उपलब्ध नहीं है. हालांकि, आने वाले समय में इसे उपलब्ध कराया जा सकता है. इसके अलावा, kGMSTileLayerNoTile पर जाकर बताएं कि इस जगह पर कोई टाइल नहीं है.

GMSURLTileLayer के लिए, GMSTileURLConstructor से nil रिटर्न करने पर, पता चलेगा कि इस जगह पर कोई टाइल नहीं है.

यूआरएल से टाइल फ़ेच करने के लिए, `GMSURLTilelayer` का इस्तेमाल किया जा रहा है

GMSURLTileLayer को सब-क्लास करने की ज़रूरत नहीं है, लेकिन आपको GMSTileURLConstructor ब्लॉक लागू करना होगा. नीचे दिए गए कोड में बताया गया है कि किसी बहुमंज़िला इमारत का फ़्लोर प्लान दिखाने के लिए, GMSURLTileLayer को कैसे इस्तेमाल करें.

Swift

let floor = 1

// Implement GMSTileURLConstructor
// Returns a Tile based on the x,y,zoom coordinates, and the requested floor
let urls: GMSTileURLConstructor = { (x, y, zoom) in
  let url = "https://www.example.com/floorplans/L\(floor)_\(zoom)_\(x)_\(y).png"
  return URL(string: url)
}

// Create the GMSTileLayer
let layer = GMSURLTileLayer(urlConstructor: urls)

// Display on the map at a specific zIndex
layer.zIndex = 100
layer.map = mapView
      

Objective-C

NSInteger floor = 1;

// Create the GMSTileLayer
GMSURLTileLayer *layer = [GMSURLTileLayer tileLayerWithURLConstructor:^NSURL * _Nullable(NSUInteger x, NSUInteger y, NSUInteger zoom) {
  NSString *url = [NSString stringWithFormat:@"https://www.example.com/floorplans/L%ld_%lu_%lu_%lu.png",
                   (long)floor, (unsigned long)zoom, (unsigned long)x, (unsigned long)y];
  return [NSURL URLWithString:url];
}];

// Display on the map at a specific zIndex
layer.zIndex = 100;
layer.map = mapView;
      

UIImage के तौर पर टाइल दिखाने के लिए, GMSSyncTileLayer सब-क्लास

GMSSyncTileLayer और GMSTileLayer ऐब्स्ट्रैक्ट क्लास हैं, जिन्हें सब-क्लास के लिए डिज़ाइन किया गया है. UIImage की तरह टाइल दिखाने के लिए, इन क्लास का इस्तेमाल किया जा सकता है. यहां दिए गए उदाहरण में, GMSSyncTileLayer को सब-क्लास करके, मैप पर कुछ टाइल पर कस्टम इमेज रेंडर करने का तरीका बताया गया है.

Swift

class TestTileLayer: GMSSyncTileLayer {
  override func tileFor(x: UInt, y: UInt, zoom: UInt) -> UIImage? {
    // On every odd tile, render an image.
    if (x % 2 == 1) {
      return UIImage(named: "australia")
    } else {
      return kGMSTileLayerNoTile
    }
  }
}

      

Objective-C

@interface TestTileLayer : GMSSyncTileLayer
@end

@implementation TestTileLayer

- (UIImage *)tileForX:(NSUInteger)x y:(NSUInteger)y zoom:(NSUInteger)zoom {
  // On every odd tile, render an image.
  if (x % 2 == 1) {
    return [UIImage imageNamed:@"australia"];
  } else {
    return kGMSTileLayerNoTile;
  }
}

@end
      

अपने मैप में लेयर जोड़ने के लिए, ऑब्जेक्ट को इंस्टैंशिएट करें और इसकी मैप प्रॉपर्टी सेट करें.

Swift

let layer = TestTileLayer()
layer.map = mapView
      

Objective-C

GMSTileLayer *layer = [[TestTileLayer alloc] init];
layer.map = mapView;
      

रेटिना डिवाइसों के लिए, हाई डीपीआई टाइल

tileSize को 512 पर सेट करके, GMSSyncTileLayer या GMSURLTileLayer के साथ ज़्यादा डीपीआई इमेज का इस्तेमाल किया जा सकता है. tileSize प्रॉपर्टी से पता चलता है कि नतीजे में दिखाई गई टाइल इमेज को किस पिक्सल में दिखाया जाएगा. इसकी वैल्यू डिफ़ॉल्ट तौर पर 256 होती है. यह बिना रेटिना डिवाइस पर Google Maps टाइल का डाइमेंशन 256 होती है.

अगर हाई डीपीआई डिवाइस पर सामान्य डीपीआई टाइल दिख रही हैं, तो इमेज को स्केल करने के लिए tileSize को 512 पर सेट करें. ध्यान रखें कि इमेज को बड़ा करने से इमेज क्वालिटी खराब हो सकती है, खासकर फ़ाइन लाइन या टेक्स्ट के लिए. सबसे अच्छे नतीजे पाने के लिए, tileSize और इमेज DPI को डिसप्ले से मैच करें. रेटिना डिवाइस पर दिखाए गए मैप tileSize 512 के साथ उच्च DPI इमेज दिखाने पर सबसे अच्छे दिखेंगे; जबकि गैर-रेटिना डिवाइस पर दिखाए गए मैप सामान्य इमेज और डिफ़ॉल्ट tileSize 256 के साथ बेहतरीन दिखेंगे.

पुरानी टाइल हटाई जा रही हैं

अगर लेयर से दी गई टाइल 'पुरानी' हो जाती हैं, तो लेयर पर clearTileCache तरीके को कॉल किया जाना चाहिए, ताकि रीफ़्रेश किया जा सके. इससे इस लेयर की सभी टाइल फिर से लोड हो जाएंगी.

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];