टाइल की लेयर

प्लैटफ़ॉर्म चुनें: 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 डिवाइसों के लिए हाई डीपीआई टाइल

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

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

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

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

Swift

layer.clearTileCache()
      

Objective-C

[layer clearTileCache];