ज़ूम की ज़्यादा से ज़्यादा तस्वीरों की सेवा

  1. ज़्यादा से ज़्यादा ज़ूम करने की तस्वीरें
  2. MaxZoom के अनुरोध
  3. MaxZoom के जवाब

खास जानकारी

Google Maps API, मैप टाइप दिखाने के लिए, कई ज़ूम लेवल पर मैप टाइल उपलब्ध कराता है. उदाहरण के लिए, ज़्यादातर रोडमैप तस्वीरें 0 से 18 ज़ूम लेवल पर उपलब्ध होती हैं. सैटलाइट से ली गई तस्वीरें अलग-अलग होती हैं, क्योंकि इन्हें तस्वीरों के ज़रिए नहीं बनाया जाता.

हालांकि, उपग्रह से ली गई तस्वीरें दूर-दराज़ की जगहों पर ज़्यादा ज़ूम लेवल पर उपलब्ध नहीं होती हैं — बहुत कम जगहों या समुद्र के खुले इलाकों में उपलब्ध होती हैं. इसलिए, हो सकता है कि आप पहले से किसी जगह पर मौजूद तस्वीरों का ज़ूम लेवल जानना चाहें. MaxZoomService ऑब्जेक्ट, किसी दिए गए जगह पर ज़ूम की ज़्यादा से ज़्यादा सीमा का पता लगाने के लिए, एक आसान इंटरफ़ेस उपलब्ध कराता है. इसके लिए Google Maps की सैटलाइट तस्वीरों का इस्तेमाल किया जाता है.

MaxZoom अनुरोध

MaxZoomService को ऐक्सेस नहीं किया जा सकता, क्योंकि Google Maps API को किसी बाहरी सर्वर को कॉल करना होता है. इस वजह से, आपको अनुरोध पूरा होने पर कॉलबैक तरीका इस्तेमाल करके पास करना होगा. इस कॉलबैक मैथड को नतीजे को प्रोसेस करना चाहिए.

MaxZoomService को अनुरोध भेजने के लिए, getMaxZoomAtLatLng() को कॉल करें और जगह की जानकारी का LatLng पास करके, कॉलबैक फ़ंक्शन को पूरा करें.

MaxZoom जवाब

जब getMaxZoomAtLatLng(), कॉलबैक फ़ंक्शन एक्ज़ीक्यूट करता है, तो यह दो पैरामीटर पास करता है:

  • status में अनुरोध का MaxZoomStatus शामिल है.
  • zoom में ज़ूम लेवल शामिल है. अगर किसी वजह से सेवा काम नहीं करती है, तो यह वैल्यू नहीं दिखेगी.

status कोड इनमें से कोई एक वैल्यू दिखा सकता है:

  • OK से यह पता चलता है कि सेवा को उपग्रह से ली गई तस्वीरें ज़्यादा से ज़्यादा कितनी ज़ूम कर सकती हैं.
  • ERROR से पता चलता है कि MaxZoom के अनुरोध को प्रोसेस नहीं किया जा सका.

नीचे दिए गए उदाहरण में मेट्रोपॉलिटन टोक्यो का मैप दिखाया गया है. मैप पर कहीं भी क्लिक करने से, उस जगह पर सबसे ज़्यादा ज़ूम लेवल का पता चलता है. (टोक्यो के आस-पास के ज़ूम लेवल आम तौर पर, 18 और 21 ज़ूम लेवल के बीच अलग-अलग होते हैं.)

TypeScript

let map: google.maps.Map;
let maxZoomService: google.maps.MaxZoomService;
let infoWindow: google.maps.InfoWindow;

function initMap(): void {
  map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
    zoom: 11,
    center: { lat: 35.6894, lng: 139.692 },
    mapTypeId: "hybrid",
  });

  infoWindow = new google.maps.InfoWindow();

  maxZoomService = new google.maps.MaxZoomService();

  map.addListener("click", showMaxZoom);
}

function showMaxZoom(e: google.maps.MapMouseEvent) {
  maxZoomService.getMaxZoomAtLatLng(
    e.latLng as google.maps.LatLng,
    (result: google.maps.MaxZoomResult) => {
      if (result.status !== "OK") {
        infoWindow.setContent("Error in MaxZoomService");
      } else {
        infoWindow.setContent(
          "The maximum zoom at this location is: " + result.zoom
        );
      }

      infoWindow.setPosition(e.latLng);
      infoWindow.open(map);
    }
  );
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;
index.ts

JavaScript

let map;
let maxZoomService;
let infoWindow;

function initMap() {
  map = new google.maps.Map(document.getElementById("map"), {
    zoom: 11,
    center: { lat: 35.6894, lng: 139.692 },
    mapTypeId: "hybrid",
  });
  infoWindow = new google.maps.InfoWindow();
  maxZoomService = new google.maps.MaxZoomService();
  map.addListener("click", showMaxZoom);
}

function showMaxZoom(e) {
  maxZoomService.getMaxZoomAtLatLng(e.latLng, (result) => {
    if (result.status !== "OK") {
      infoWindow.setContent("Error in MaxZoomService");
    } else {
      infoWindow.setContent(
        "The maximum zoom at this location is: " + result.zoom,
      );
    }

    infoWindow.setPosition(e.latLng);
    infoWindow.open(map);
  });
}

window.initMap = initMap;
index.js
उदाहरण देखें

सैंपल आज़माएं