ग्राउंड ओवरले

1. शुरुआती जानकारी
2. ग्राउंड ओवरले जोड़ना
3. ग्राउंड ओवरले हटाना

परिचय

ओवरले, मैप पर मौजूद ऐसी चीज़ें होती हैं जो इनसे बंधी होती हैं अक्षांश/देशांतर निर्देशांक, ताकि वे नीचे की ओर स्क्रोल करने पर या मैप को ज़ूम करें. अगर आप मैप पर इमेज लगाना चाहते हैं, तो GroundOverlay ऑब्जेक्ट.

अन्य तरह के ओवरले के बारे में जानकारी के लिए, देखें मैप पर ड्रॉइंग करना.

ग्राउंड ओवरले जोड़ें

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

// This example uses a GroundOverlay to place an image on the map
// showing an antique map of Newark, NJ.

let historicalOverlay;

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 13,
      center: { lat: 40.74, lng: -74.18 },
    }
  );

  const imageBounds = {
    north: 40.773941,
    south: 40.712216,
    east: -74.12544,
    west: -74.22655,
  };

  historicalOverlay = new google.maps.GroundOverlay(
    "https://storage.googleapis.com/geo-devrel-public-buckets/newark_nj_1922-661x516.jpeg",
    imageBounds
  );
  historicalOverlay.setMap(map);
}

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

// This example uses a GroundOverlay to place an image on the map
// showing an antique map of Newark, NJ.
let historicalOverlay;

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 13,
    center: { lat: 40.74, lng: -74.18 },
  });
  const imageBounds = {
    north: 40.773941,
    south: 40.712216,
    east: -74.12544,
    west: -74.22655,
  };

  historicalOverlay = new google.maps.GroundOverlay(
    "https://storage.googleapis.com/geo-devrel-public-buckets/newark_nj_1922-661x516.jpeg",
    imageBounds,
  );
  historicalOverlay.setMap(map);
}

window.initMap = initMap;
index.js

ग्राउंड ओवरले हटाएं

ओवरले को मैप से निकालने के लिए, ओवरले के setMap() तरीका, null से आगे निकल रहा है. ध्यान दें कि इस तरीके को इस्तेमाल करने से ओवरले नहीं मिटता. यह उसे हटा देता है ओवरले को मैप से हटा दिया है. अगर इसके बजाय आप ओवरले को हटाना चाहते हैं, तो आपको इसे मैप से हटा देना चाहिए, और फिर खुद को null पर ओवरले करता है.

function removeOverlay() {
  historicalOverlay.setMap(null);
}

उदाहरण देखें