अपने वेब पेज पर, एचटीटीपी अनुरोध की मदद से इंटरैक्टिव मैप या Street View पैनोरामा जोड़ें. इसके लिए, JavaScript की ज़रूरत नहीं है.
लागत
Maps Embed API के सभी अनुरोध, बिना किसी शुल्क के उपलब्ध हैं. साथ ही, इनका इस्तेमाल अनलिमिटेड किया जा सकता है. हालांकि, सभी अनुरोधों के लिए अब भी Google Cloud की मान्य एपीआई पासकोड की ज़रूरत होगी. ज़्यादा जानकारी के लिए, इस्तेमाल और बिलिंग देखें.
शुरू करने से पहले
अपने वेब पेज पर एम्बेड किया गया मैप बनाने के लिए, यहां दिए गए टैब पर क्लिक करके, सेटअप के ज़रूरी चरणों को पूरा करें:
चरण 1
कंसोल
-
नया Cloud प्रोजेक्ट बनाने के लिए, Google Cloud Console में प्रोजेक्ट चुनने वाले पेज पर, प्रोजेक्ट बनाएं पर क्लिक करें.
-
पक्का करें कि आपके Cloud प्रोजेक्ट के लिए बिलिंग की सुविधा चालू हो. पुष्टि करें कि आपके प्रोजेक्ट के लिए बिलिंग चालू है.
Google Cloud, बिना किसी शुल्क के आज़माने की सुविधा देता है. मुफ़्त में आज़माने की अवधि 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 में, संसाधन मैनेज करें पेज पर जाएं:
- अगर आपको जिस प्रोजेक्ट को मिटाना है वह किसी संगठन से जुड़ा है, तो पेज पर सबसे ऊपर मौजूद संगठन की सूची को चुनें और बड़ा करें.
- प्रोजेक्ट की सूची में, वह प्रोजेक्ट चुनें जिसे मिटाना है और मिटाएं पर क्लिक करें.
- डायलॉग में, प्रोजेक्ट आईडी टाइप करें. इसके बाद, प्रोजेक्ट मिटाने के लिए बंद करें पर क्लिक करें.
अगले चरण
Maps Embed API का इस्तेमाल करके डेवलपमेंट शुरू करने के लिए, अपना Google Cloud प्रोजेक्ट सेट अप करें:
अपने iframe में जोड़े जा सकने वाले अन्य पैरामीटर और विकल्पों की सूची के लिए:
JavaScript API की मदद से, अपने Maps प्रोजेक्ट को बेहतर बनाएं: