टाइल की लेयर

प्लैटफ़ॉर्म चुनें: 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;
      

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

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

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

पुरानी टाइल मिटाना

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

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];