Google Maps එක්ක පොඩි පොඩි වැඩ.

හරි මාතෘකාවට බහිමු , google maps එක්ක වැඩ කරන්නෙ කොහොමද කියලා. අපේ බ්ලොග් පෝස්ට් එකකට / වෙබ් අඩවියක ස්තානයක් ගැන එහෙම විස්තර කරගන්න ඕන උනොත් google maps පාවිච්චි කරන්න පුළුවන්. මේකට google maps API කිහිපයක්ම තිබෙනවා අපේ අවශ්‍යතාවය අනුව එකක් තෝරාගන්න පුළුවනි. මේක image එකක් විදියට විතරක් දානවා නම් Google Static Maps API එකෙන් මේ විදියට ලේසියෙන්ම කරන්න පුළුවන්.
උ‍දා:- කොළඹ නගරය මැප් එකක ලකුණු කරලා පෙන්වන්න ඕන කියලා හිතමු. කරන්න තියෙන්නෙ img tag එකක් ලියන්නයි.
<img src="http://maps.google.com/maps/api/staticmap?center=colombo,sri+lanka&amp;zoom=14&amp;size=400x400&amp;sensor=false" alt="" />
ඔය center කියන එකෙන් අපිට පෙන්වන්න ඕන ස්තානයත්, size කියන එකෙන් image එකේ දිග පළලත්, zoom කියන එකෙන් විශාලයත් දැක්වෙනවා. sensor කියන එකනම් අපේ වැඩේට අදාල නැති එකක්. (device එකකින් location එකක් ගන්නවා නම් මේක true කරන්න ඕන කියල තමයි මම අහල තියෙන්නෙ.)
මේක හරියට කලොත් මේවගේ එකක් ඒවි

හරි දැන් ටිකක් සංකීර්ණ එකක් කරමු. Google Maps JavaScript API V3 එක්ක javascript වලින්.  මේ ක්‍රමයේදි address එකක් දෙනවට වැඩිය අක්ෂාංශ දේශාංශ පාවිච්චි කරනවා නම් ලේසියි. (address එකක්ම mark කරන්න ඕන නම් Geocoding API එක පාවිච්චි කරන්න වේවි. ) මෙන්න උදාහරණයක්.

<div id="map_canvas" style="width:500px; height:500px;"></div>

<script type="text/javascript"

src="http://maps.google.com/maps/api/js?sensor=false">

</script>

<script type="text/javascript">

window.onload=initialize;

function initialize() {

var latlng = new google.maps.LatLng(6.929068172376261, 79.84820365905762);

var myOptions = {

zoom: 8,

center: latlng,

mapTypeId: google.maps.MapTypeId.ROADMAP

};

var map = new google.maps.Map(document.getElementById("map_canvas"),

myOptions);

}

</script>

වැඩේ හරි නම් මේ විදියට පෙනේවි.(wordpress කාරයා මගේ javascript code එක කමෙන්ට් කරන නිසා මේක වෙන තැනක දැම්මේ.)
පොඩි පොඩි සළකුණු හෙම දාලා මැප් එකේ මාක් කරන්න ඕන නම් Overlays කියලා තියෙන ටික බලන්න. Events මඟින් අපිට මැප් එකේ එක ක්ලික් කලාම message box එකක් වගේ එන්න හදන්න පුළුවනි. උත්සහ කරලා බලන්න