Google कस्टम मार्कर में एक पत्र के बजाय एक संख्या का उपयोग कैसे करें

Google मानचित्र मार्कर मानचित्र पर विशिष्ट साइटों को उजागर करते हैं। डिफ़ॉल्ट रूप से, Google एक व्यक्तिगत मार्कर को एक वर्ग और कई मार्करों के साथ अक्षरों से पहचानता है, लेकिन यह कुछ अनुप्रयोगों के अनुरूप नहीं हो सकता है। उदाहरण के लिए, यदि आपकी कंपनी शाखाओं को 1, 2 और 3 के रूप में संदर्भित करती है, तो गिने हुए मार्कर उन्हें अक्षरों की तुलना में अधिक स्पष्ट रूप से पहचानेंगे। मानचित्र स्थानों के लिए अपने स्वयं के लेबल डिज़ाइन करने के लिए अपने प्रोग्राम में कस्टम मार्कर का उपयोग करें। ये मार्कर कस्टम आइकन का उपयोग करते हैं, जिन्हें आप Google चार्ट एपीआई का उपयोग करके कोड कर सकते हैं।

1।

अपने प्रोग्राम के सोर्स कोड को जावा डेवलपमेंट प्रोग्राम जैसे ग्रहण के साथ खोलें।

2।

"आरंभ" फ़ंक्शन पर स्क्रॉल करें। यह कोड ब्लॉक आपके नक्शे को परिभाषित करता है और इसके लिए विकल्पों को परिभाषित करता है। उदाहरण के लिए, कोड पढ़ा जा सकता है:

फ़ंक्शन प्रारंभ () {

var निर्देशांक = नया google.maps.LatLng (42.346429, -71.097186);

var myOptions = {

ज़ूम: 4,

केंद्र: निर्देशांक,

mapTypeId: google.maps.MapTypeId.ROADMAP

}

var ourHeadquarters = new google.maps.Map (document.getElementById ("map_canvas"), myOptions;

}

3।

अपने मार्कर के अक्षांश और देशांतर को परिभाषित करने वाली एक नई पंक्ति जोड़ें। उदाहरण के लिए, यदि आपके मार्कर में 42.349093 का अक्षांश और -71.101971 का देशांतर होना चाहिए, तो निम्न पंक्ति जोड़ें:

var मार्करकॉर्डर = नया google.maps.LatLng (42.349093, -71.101971);

4।

अपना मार्कर बनाने के लिए निम्नलिखित ब्लॉक जोड़ें:

var मार्कर = नया google.maps। मार्कर ({

स्थिति: मार्कर,

नक्शा: हमारे मुख्यालय,

});

पिछले चरण में आपके द्वारा बनाए गए चर के साथ "मार्कर कोड" को बदलें, और अपने नक्शे से जुड़े चर के साथ "हमारेहेडक्वार्टर" को बदलें।

5।

मार्कर के लिए एक आइकन बनाने के लिए मार्कर ब्लॉक के भीतर निम्नलिखित पंक्ति जोड़ें:

आइकन: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=A|FF0000|000000'

6।

एक संख्या के साथ लाइन में "ए" को बदलें। उदाहरण के लिए, इसे "1, " के साथ लाइन में बदलें:

आइकन: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FF0000|999999'

7।

मार्कर की पृष्ठभूमि के HTML हेक्साडेसिमल कोड के लिए "FF0000" बदलें। उदाहरण के लिए, पृष्ठभूमि के रंग को पीले रंग में सेट करने के लिए, जो कोड "FFFF00" का उपयोग करता है, "FFFF00" के साथ कोड को प्रतिस्थापित करें:

आइकन: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FFFF00|999999'

8।

मार्कर नंबर के टेक्स्ट के एचटीएमएल हेक्सिडेसिमल कोड में "999999" बदलें। उदाहरण के लिए, इस पाठ को काले रंग में लिखने के लिए, जो कोड "000000" का उपयोग करता है, "कोड को" 000000 "से बदलकर, लाइन में बदल रहा है:

आइकन: '// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FFFF00|000000'

लोकप्रिय पोस्ट