Maps JavaScript API के लिए WebGL के ज़रिए चलाई जाने वाली सुविधाएं, आपको टिल्ट और रोटेशन को कंट्रोल करने, 3D ऑब्जेक्ट को मैप में सीधे जोड़ने वगैरह की सुविधा देती हैं. नीचे दी गई सुविधाओं में ये शामिल हैं:
- WebGL ओवरले व्यू से आप अपने मैप में पसंद के मुताबिक 2D और 3D ग्राफ़िक और ऐनिमेशन वाला कॉन्टेंट जोड़ सकते हैं.
- झुकाएं और हेडिंग अब प्रोग्राम के हिसाब से अडजस्ट की जा सकती है. साथ ही, इन्हें माउस और कीबोर्ड जेस्चर का इस्तेमाल करके भी अडजस्ट किया जा सकता है.
- map.moveCamera() की मदद से, कैमरे की एक से ज़्यादा प्रॉपर्टी को एक साथ बदला जा सकता है.
- Zoom अब फ़्रैक्शनल वैल्यू के साथ काम करता है.
शुरू करें
नई WebGL सुविधाओं का इस्तेमाल करने के लिए, आपको ऐसे मैप आईडी की ज़रूरत होगी जो वेक्टर मैप का इस्तेमाल करता हो. आपको अपने एपीआई बूटस्ट्रैप अनुरोध को भी अपडेट करना होगा. इस सेक्शन में इसका तरीका बताया गया है.
नया मैप आईडी बनाएं
नया मैप आईडी बनाने के लिए, क्लाउड-आधारित मैप स्टाइलिंग - मैप आईडी पाएं में दिया गया तरीका अपनाएं. मैप टाइप को JavaScript पर सेट करना न भूलें और वेक्टर विकल्प चुनें. मैप पर झुकाने और घुमाने की सुविधा चालू करने के लिए, झुकाएं और/या रोटेशन चुनें. ऐसा करने से, आप प्रोग्राम के हिसाब से इन वैल्यू में बदलाव कर पाएंगे. साथ ही, उपयोगकर्ता सीधे मैप पर झुकाने और हेडिंग को भी अपने हिसाब से सेट कर पाएंगे. अगर झुकाने या हेडिंग का इस्तेमाल करने से आपके ऐप्लिकेशन पर बुरा असर पड़ेगा, तो झुकाएं और रोटेशन से सही का निशान हटाएं, ताकि उपयोगकर्ता झुकाने और घुमाने की सुविधा को अडजस्ट न कर सकें.
अपना मैप इनिशलाइज़ेशन कोड अपडेट करना
इसके लिए अभी-अभी बनाए गए मैप आईडी की ज़रूरत होती है. यह आपके Maps मैनेजमेंट पेज पर देखा जा सकता है. मैप को इंस्टैंशिएट करने के लिए, mapId प्रॉपर्टी का इस्तेमाल करके मैप आईडी दें, जैसा कि यहां दिखाया गया है:
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
mapId: 'MAP_ID'
});
उदाहरण
इन सुविधाओं को दिखाने के लिए उदाहरण दिए गए हैं: