एचटीटीपी अनुरोध का आसानी से इस्तेमाल करके, अपने वेब पेज पर इंटरैक्टिव मैप या Street View पैनोरामा जोड़ें. इसके लिए, JavaScript की ज़रूरत नहीं होती.
लागत
Maps Embed API के सभी अनुरोधों के लिए, कोई शुल्क नहीं लिया जाता. साथ ही, इसका इस्तेमाल करने की कोई सीमा नहीं है. हालांकि, सभी अनुरोधों के लिए, Google Cloud का मान्य एपीआई पासकोड ज़रूरी है. ज़्यादा जानकारी के लिए, इस्तेमाल और बिलिंग देखें.
शुरू करने से पहले
अपने वेब पेज पर एम्बेड किया गया मैप बनाने के लिए, सेटअप के ज़रूरी चरण पूरे करें. इसके लिए, इन टैब पर क्लिक करें:
पहला चरण
कंसोल
-
Google Cloud Console में, प्रोजेक्ट चुनने वाले पेज पर, नया Cloud प्रोजेक्ट बनाने के लिए, प्रोजेक्ट बनाएं पर क्लिक करें.
-
पक्का करें कि आपके Cloud प्रोजेक्ट के लिए बिलिंग चालू हो. पुष्टि करें कि आपके प्रोजेक्ट के लिए बिलिंग चालू है.
Google Cloud, 0.00 डॉलर के शुल्क पर आज़माने की सुविधा देता है. यह सुविधा, 90 दिनों के बाद या खाते में 300 डॉलर का शुल्क जमा होने के बाद खत्म हो जाती है. इनमें से जो भी पहले हो. इसे कभी भी रद्द किया जा सकता है. ज़्यादा जानकारी के लिए, बिलिंग खाते के क्रेडिट और बिलिंग देखें.
Cloud SDK
gcloud projects create "PROJECT"
Google Cloud SDK , Cloud SDK इंस्टॉल करने का तरीका , और इन कमांड के बारे में ज़्यादा जानें:
दूसरा चरण
Google Maps Platform का इस्तेमाल करने के लिए, आपको अपने प्रोजेक्ट के साथ इस्तेमाल किए जाने वाले एपीआई या एसडीके चालू करने होंगे.
कंसोल
Cloud SDK
gcloud services enable \ --project "PROJECT" \ "maps-embed-backend.googleapis.com"
Google Cloud SDK , Cloud SDK इंस्टॉल करने का तरीका , और इन कमांड के बारे में ज़्यादा जानें:
तीसरा चरण
इस चरण में, सिर्फ़ एपीआई पासकोड बनाने की प्रोसेस के बारे में बताया गया है. अगर प्रोडक्शन में अपने एपीआई पासकोड का इस्तेमाल किया जाता है, तो हमारा सुझाव है कि आप अपने एपीआई पासकोड पर पाबंदी लगाएं. ज़्यादा जानकारी के लिए, प्रॉडक्ट के हिसाब से एपीआई पासकोड का इस्तेमाल पेज देखें.
एपीआई पासकोड एक यूनीक आइडेंटिफ़ायर होता है. यह आपके प्रोजेक्ट से जुड़े अनुरोधों की पुष्टि करता है, ताकि उनका इस्तेमाल और बिलिंग की जा सके. आपके प्रोजेक्ट से कम से कम एक एपीआई पासकोड जुड़ा होना चाहिए.
एपीआई पासकोड बनाने के लिए:
कंसोल
-
Google Maps Platform > क्रेडेंशियल पेज पर जाएं.
-
क्रेडेंशियल पेज पर, क्रेडेंशियल बनाएं > एपीआई पासकोड पर क्लिक करें.
एपीआई पासकोड बनाया गया डायलॉग में, नया एपीआई पासकोड दिखता है. -
बंद करें पर क्लिक करें.
नया एपीआई पासकोड, क्रेडेंशियल पेज पर एपीआई पासकोड में दिखता है.
(प्रोडक्शन में इसका इस्तेमाल करने से पहले, एपीआई पासकोड पर पाबंदी लगाना न भूलें.)
Cloud SDK
gcloud services api-keys create \ --project "PROJECT" \ --display-name "DISPLAY_NAME"
Google Cloud SDK , Cloud SDK इंस्टॉल करने का तरीका , और इन कमांड के बारे में ज़्यादा जानें:
कोई iframe जनरेट करना
अपने वेबपेज के लिए iframe जनरेट करने के लिए, इन विकल्पों पर क्लिक करें. साथ ही, कोई जगह और एपीआई पासकोड जोड़ें. अन्य पैरामीटर और विकल्पों के लिए, मैप एम्बेड करना देखें.
अपने iframe को टेस्ट करना
अपने iframe को एचटीएमएल ब्राउज़र विंडो में देखने के लिए:
- अपने डिफ़ॉल्ट टेक्स्ट एडिटर को खोलें. आपके डिवाइस पर, TextEdit या Microsoft Windows Notepad जैसे टेक्स्ट एडिटर डिफ़ॉल्ट रूप से इंस्टॉल होने चाहिए.
- एक एचटीएमएल फ़ाइल बनाएं और उसका नाम
index.htmlरखें. ऊपर जनरेट किए गए iframe के साथ यह कोड जोड़ें:
<html> <!-- Replace this code comment with your iframe. --> </html>अपनी
index.htmlएचटीएमएल फ़ाइल सेव करें.एचटीएमएल फ़ाइल को वेब ब्राउज़र में लोड करने के लिए, उसे अपने डेस्कटॉप से खींचकर ब्राउज़र पर छोड़ें. इसके अलावा, ज़्यादातर ऑपरेटिंग सिस्टम पर फ़ाइल पर दो बार क्लिक करने से भी यह काम किया जा सकता है.
बधाई हो! आपने Maps Embed API का इस्तेमाल करके, मैप सेट अप और बनाया है.
सफ़ाई करना
अपने Google Cloud प्रोजेक्ट को मिटाया जा सकता है, ताकि उस प्रोजेक्ट में इस्तेमाल किए गए सभी संसाधनों के लिए बिलिंग बंद की जा सके.
- Google Cloud Console में, संसाधन मैनेज करें पेज पर जाएं:
- अगर मिटाया जाने वाला प्रोजेक्ट किसी संगठन से जुड़ा है, तो पेज पर सबसे ऊपर मौजूद संगठन की सूची को चुनें और बड़ा करें.
- प्रोजेक्ट की सूची में, वह प्रोजेक्ट चुनें जिसे मिटाना है. इसके बाद, मिटाएं पर क्लिक करें.
- डायलॉग में, प्रोजेक्ट आईडी डालें और प्रोजेक्ट को मिटाने के लिए, बंद करें पर क्लिक करें.
अगले चरण
अपना Google Cloud प्रोजेक्ट सेट अप करके, Maps Embed API के साथ डेवलपमेंट शुरू करें:
अपने iframe में जोड़े जा सकने वाले अन्य पैरामीटर और विकल्पों की सूची के लिए:
Javascript API की मदद से, अपने Maps प्रोजेक्ट को बढ़ाएं: