អត្ថបទមុនខ្ញុំបាននិយាយអំពី Oh! Maps ដែលជាសេវាកម្មថ្មីដែលខ្ញុំបានបង្កើតឡើង ថ្ងៃនេះខ្ញុំសូមលើកយកពីគន្លះការប្រើប្រាស់ Google Maps ខ្លះៗដែលខ្ញុំបានអនុវត្តន៍ក្នុង Project នេះ។
ជំហ៊ានទី១
បញ្ចូល JavaScript libraries និង Google Maps Script API:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script> <script type="text/javascript" src="https://raw.github.com/HPNeo/gmaps/master/gmaps.js"></script>
បន្ទាត់ទី១ ត្រូវបញ្ចូល jQuery ជាមុនព្រោះ gmaps.js ជា plugin របស់ jQuery អាចដំណើរការបានដោយពឹងលើ jQuery នឹង Google Maps API។ បន្ទាត់ទី ២ ត្រូវបញ្ចូល Google Maps API បន្ទាប់ទៀតគឺ Plugin jQuery gmaps.js ដើម្បីដំណើរការបង្កើត Maps លើវែបសាយរបស់អ្នក។
ជំហ៊ានទី ២
ក្នុងដំណាក់កាលនេះអ្នកត្រូវបង្កើត html tag មួយហើយផ្ដល់ ID អោយទៅវាដើម្បី gmap.js អាចបង្កើត map លើវាបាន។ សូមសរសេរកូដដូចខាងក្រោមនេះទៅក្នុង <body>
<div id="map"></div>
នៅជំហានទី ៣ ខាងក្រោមនេះ ខ្ញុំនឹងសរសេរ Script ដើម្បីអោយដំណើរការ Map នៅលើ div ដែលមាន id=”map” ជាការស្រេច។
ជំហ៊ានទី ៣
ក្នុងដំណាក់កាលចុងក្រោយនេះ gmap.js ត្រូវការ សមាសធាតុ(Property) ៣សំខាន់ៗ៖
var map;
$(document).ready(function(){
map = new GMaps({
div: '#map',
lat: -12.043333,
lng: -77.028333
});
});
- div: ជាសមាសធាតុសម្រាប់បង្កើត Map លើ Page។ នៅទីនេះ div សំដៅទៅលើ <div id=”map”> នេះឯងដែលខ្ញុំបានប្ងកើខាងលើ
- lat: ជារយៈទទឹង(latitude) របស់កូអដោនេ
- lng: ជារយៈបណ្ដោយ(longitude) របស់កូអដោនេ
ដើម្បីបាន lat និង lng សូមចូលទៅកានតវែបសាយ Oh! Maps សូមមើលអត្ថបទពីរបៀបប្រើប្រាស់ Oh! Maps.
ប្រសិនបើអ្នកចង់បន្ថែម Marker និង InfoWidnow នៅត្រង់ចំណុចខាងលើ អ្នកត្រូវបន្ថែមកូដខាងក្រោមនេះ
map.addMarker ({
lat: 11.5691058,
lng: 104.89143690000003,
infoWindow: {
content: "<h1>Royal University of Phnom Penh, Confederation de la Russie, Phnom Penh, Cambodia</h1>"
}
});
hello bong i wat to ask you This Google Maps can put in blogger or not ?
You can use in blogger but require you know about blogger template structure for example in my blog http://lat-lng.blogspot.com/ I embedded
Hello,
I have one question to ask you could you tell me that; how could I put khmer name to my location?
Thanks a lot.
អាចបញ្ចូលដូចខាងក្រោម
infoWindow: {
content: "អ្នកអាចសរសេរខ្មែរបាននៅទីនេះ"
}