cu_Cbear 发表于 2012-02-19 13:41

gmap

gmap
Js代码<html>   
<head>   
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />   
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>   
<title>画线</title>   
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />   
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>   
   
<script type="text/javascript">   
   
var poly;   
var map;   
var directionsDisplay;   
var directionsService = new google.maps.DirectionsService();   
   

   var geocoder;   
function initialize() {   
   geocoder = new google.maps.Geocoder();   
    var centerPoint = new google.maps.LatLng(23.0999442125314, 113.203125);   
    var myOptions = {   
      zoom: 4,   
      center: centerPoint,   
      mapTypeId: google.maps.MapTypeId.ROADMAP   
    };   
   
    map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);   
   
    var polyOptions = {   
      strokeColor: 'red',   
      strokeOpacity: 1.0,   
      strokeWeight: 3   
    }   
    poly = new google.maps.Polyline(polyOptions);   
    poly.setMap(map);   
    directionsDisplay = new google.maps.DirectionsRenderer();   
    directionsDisplay.setMap(map);   
   var point = new google.maps.LatLng (37.37015718405753, 114.609375);   
      addLatLng(point,'A点','理','2011-11-21');   
         
       var point = new google.maps.LatLng (39.13006024213511, 115.48828125);   
      addLatLng(point,'B点','宁','2012-01-01');   
         
      var point = new google.maps.LatLng(23.241346102386135, 114.169921875);   
      addLatLng(point,'广州','xx','2012-01-16');   
       //calcRoute('37.37015718405753, 114.609375','39.13006024213511, 115.48828125');   
       //calcRoute('39.13006024213511, 115.48828125','23.241346102386135, 114.169921875');   
}   
</script>   
   
<script type="text/javascript">   
   
function addLatLng(point,mytitle,myname,time) {   
    var path = poly.getPath();   
    path.push(point);   
   
    var marker = new google.maps.Marker({   
      position: point,   
      title: mytitle,   
      map: map   
    });   
      
    //查询地址   
   // codeLatLng(point);   
    geocoder.geocode({'latLng': point}, function(results, status) {   
         if (status == google.maps.GeocoderStatus.OK) {   
             if (results) {   
                  
                  var con='姓名： '+myname +'<br> 时间： '+time+' <br>所在地：'+ results.formatted_address;   
            attachSecretMessage(marker,con);   
                }   
            } else {   

      alert("Geocoder failed due to: " + status);   

      }   
      });   

}   
   
   
function attachSecretMessage(marker,mycontent) {   
var infowindow = new google.maps.InfoWindow(   
      { content: mycontent,   
      size: new google.maps.Size(50,50)   
      });   
         
google.maps.event.addListener(marker, 'click', function(response) {   
      
      
      
    infowindow.open(map,marker);   
    map.setCenter(marker.position);   
   map.setZoom(6);   
});   
}   
   
//起点 终点   
function calcRoute(start,end) {   
   
var request = {   
    origin:start,   
    destination:end,   
    travelMode: google.maps.DirectionsTravelMode.DRIVING   
};   
directionsService.route(request, function(result, status) {   
    if (status == google.maps.DirectionsStatus.OK) {   
      directionsDisplay.setDirections(result);   
    }   
});   
}   
   
</script>   
</head>   
<body onload="initialize()">   
<div id="map_canvas"></div>   
</body>   
</html>   

第一夫人 发表于 2012-02-19 15:58

谢谢分享
页: [1]
查看完整版本: gmap