Google मानचित्रों को एकीकृत करें

Google मानचित्र मानचित्रण के लिए एक उत्कृष्ट उपकरण है और अब हम इसे खुले एपीआई की बदौलत अपनी साइट पर एकीकृत करेंगे। हम न केवल एक निश्चित स्थिति बल्कि एक मनमाना भी एकीकृत करेंगे, अर्थात्, हम डेटाबेस में एक तालिका "स्थान" बनाएंगे, हम वहां शीर्षक, x, y फ़ील्ड दर्ज करेंगे।



अब हमें प्रत्येक स्थान को संपादित करने की आवश्यकता है। एक कैनवास बनाएं जहां मानचित्र प्रदर्शित किया जाएगा।

<div id="map" style="width: 250px; height: 250px"> </div>







अगला - Google से लाइब्रेरी कॉल को फास्ट करें। चूंकि मैं स्मार्टी का उपयोग करता हूं, इसलिए मैं एक चर के रूप में डेवलपर कुंजी को पास करता हूं।

<script src="http://maps.google.com/maps?file=api&v=2&key={$google_maps_hash}" type="text/javascript"></script>









अब हम एक ऐसा कार्य करेंगे जो सभी गंदे काम करेगा - हमारे div एलिमेंट में एक मैप बनाएँ, इसे दिए गए निर्देशांक के अनुसार स्थिति दें, बबल सेट करें। अगर हम इन निर्देशांक को संपादित करते हैं, तो प्रतिक्रिया द्वारा, फ़ंक्शन, एक निश्चित फॉर्म के छिपे हुए इनपुट फ़ील्ड में "ट्रांसफर किए गए पिन-पॉइंटर" के नए निर्देशांक "registration_form" को लिख देगा।

<script type="text/javascript">

function load_map(x,y,title) {



if (GBrowserIsCompatible()) {

var map = new GMap2(document.getElementById("map"));

map.setCenter(new GLatLng(x, y), 13);

map.enableScrollWheelZoom();



point = new GLatLng(x, y);

marker = new GMarker(point);



map.addControl(new GSmallMapControl());

map.addControl(new GMapTypeControl());

map.addOverlay(marker);

marker.openInfoWindowHtml(title);

/*

var mgr = new GMarkerManager(map);



GEvent.addListener(marker, "dragend", function() {

//var center = map.getCenter();

var strCenter=marker.getPoint();

marker.openInfoWindowHtml(document.forms['registration_form'].title.value);

document.forms['registration_form'].geo_x.value=strCenter.lat();//arrCenter[0];

document.forms['registration_form'].geo_y.value=strCenter.lng();//arrCenter[1];



});

*/

}

}

</script>