gmap [复制链接]

cu_Cbear

家境小康

论坛徽章:: 0

电梯直达

1楼 [收藏(0)] [报告]

发表于 2012-02-19 13:41 |只看该作者 |倒序浏览

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[1]) {
var con='姓名： '+myname +'<br> 时间： '+time+' <br>所在地：'+ results[1].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>

复制代码

文库|博客

第一夫人

稍有积蓄

论坛徽章:: 0

2楼 [报告]

发表于 2012-02-19 15:58 |只看该作者

谢谢分享

实战分享：从技术角度谈机器学习入门| 【大话IT】RadonDB低门槛向MySQL集群下战书 | ChinaUnix打赏功能已上线！ | 新一代分布式关系型数据库RadonDB知多少？

返回列表

Chinaunix › 论坛 › 程序设计 › Web开发 › gmap