002.<script type="text/javascript">
003.var directionShow;
004.var directionsService;
005.var map;
006.var GGM;
007.var my_Latlng;
008.var initialTo;
009.var searchRoute;
010.function initialize() {
011. GGM=new Object(google.maps);
012. directionShow=new GGM.DirectionsRenderer({draggable:true});
013. directionsService = new GGM.DirectionsService();
014.
015.
016. if(navigator.geolocation){
017. navigator.geolocation.getCurrentPosition(function(position){
018. var pos = new GGM.LatLng(position.coords.latitude,position.coords.longitude);
019.
020.
021. var infowindow = new GGM.InfoWindow({
022. map: map,
023. position: pos,
024. content: 'คุณอยู่ที่นี่.'
025. });
026.
027. var my_Point = infowindow.getPosition();
028. map.panTo(my_Point);
029. $("#lat_value").val(my_Point.lat());
030. $("#lon_value").val(my_Point.lng());
031. $("#zoom_value").val(map.getZoom());
032. map.setCenter(pos);
033. },function() {
034.
035. });
036. }else{
037.
038. }
039.
040.
041. my_Latlng = new GGM.LatLng(7.163930000000001, 100.60790999999995);
042.
043. initialTo=new GGM.LatLng(7.096820000000001, 100.56960000000004);
044. var my_mapTypeId=GGM.MapTypeId.ROADMAP;
045.
046. var my_DivObj=$("#map_canvas")[0];
047.
048. var myOptions = {
049. zoom: 13,
050. center: my_Latlng ,
051. mapTypeId:my_mapTypeId
052. };
053. map = new GGM.Map(my_DivObj,myOptions);
054. directionShow.setMap(map);
055.
056. if(map){
057. searchRoute(my_Latlng,initialTo);
058. }
059.
060.
061. GGM.event.addListener(directionShow, 'directions_changed', function() {
062.
063. var results=directionShow.directions;
064.
065. var addressStart=results.routes[0].legs[0].start_address;
066. var addressEnd=results.routes[0].legs[0].end_address;
067. var distanceText=results.routes[0].legs[0].distance.text;
068. var distanceVal=results.routes[0].legs[0].distance.value;
069. var durationText=results.routes[0].legs[0].duration.text;
070. var durationVal=results.routes[0].legs[0].duration.value;
071.
072. var startlatlng = results.routes[0].legs[0].start_location;
073. var startlat = results.routes[0].legs[0].start_location.lat();
074. var startlng = results.routes[0].legs[0].start_location.lng();
075. var endlatlng = results.routes[0].legs[0].end_location;
076. var endlat = results.routes[0].legs[0].end_location.lat();
077. var endlng = results.routes[0].legs[0].end_location.lng();
078.
079. $("#a").val(startlatlng);
080. $("#a1").val(startlat);
081. $("#a2").val(startlng);
082. $("#b").val(endlatlng);
083. $("#b1").val(endlat);
084. $("#b2").val(endlng);
085.
086.
087.
088.
089.
090. });
091.
092.}
093.$(function(){
094.
095. searchRoute=function(FromPlace,ToPlace){
096. if(!FromPlace && !ToPlace){
097. var FromPlace=$("#namePlace").val();
098. var ToPlace=$("#toPlace").val();
099. }
100.
101. var request={
102. origin:FromPlace,
103. destination:ToPlace,
104. travelMode: GGM.DirectionsTravelMode.DRIVING
105. };
106.
107. directionsService.route(request, function(results, status){
108. if(status==GGM.DirectionsStatus.OK){
109. directionShow.setDirections(results);
110.
111. var addressStart=results.routes[0].legs[0].start_address;
112. var addressEnd=results.routes[0].legs[0].end_address;
113.
114. var locaStart=results.routes[0].legs[0].start_location;
115. var locaEnd=results.routes[0].legs[0].end_location;
116.
117. var distanceText=results.routes[0].legs[0].distance.text;
118. var distanceVal=results.routes[0].legs[0].distance.value;
119. var durationText=results.routes[0].legs[0].duration.text;
120. var durationVal=results.routes[0].legs[0].duration.value;
121.
122. $("#namePlaceGet").val(addressStart);
123. $("#toPlaceGet").val(addressEnd);
124. $("#a").val(locaStart);
125. $("#a1").val(locaStart.lat());
126. $("#a2").val(locaStart.lng());
127. $("#b").val(locaEnd);
128. $("#b1").val(locaEnd.lat());
129. $("#b2").val(locaEnd.lng());
130.
131. $("#distance_text").val(distanceText);
132. $("#distance_value").val(distanceVal);
133. $("#duration_text").val(durationText);
134. $("#duration_value").val(durationVal);
135.
136. }else{
137.
138.
139. }
140. });
141. }
142.
143.
144.});
145.$(function(){
146.
147.
148.
149.
150.
151.
152.
153. $("<script/>", {
154. "type": "text/javascript",
156. }).appendTo("body");
157.});
158.</script>
