<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Google 地图 JavaScript API 示例: 简单的地图</title>
<%– 加载 Google 地图 API JavaScript–%>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false®ion=cn"></script>
<script type="text/javascript">
var map;
//地图初始化
function initialize() {
var myLatlng = new google.maps.LatLng(41.075145,111.470077)
var mapOptions = {
zoom: 14, //缩放级别
center: myLatlng, //将地图的中心设置为指定的地理点 可以使用 0（最低缩放级别，在地图上可以看到整个世界）到 19（最高缩放级别，可以看到独立建筑物）之间的缩放级别
mapTypeId: google.maps.MapTypeId.SATELLITE, //ROADMAP-默认视图 SATELLITE-显示Google地球卫星图像 HYBRID-混合显示普通视图和卫星视图 TERRAIN-地形图
scaleControl: true, //比例尺
mapTypeControl: true,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
};
map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions);//编写 JavaScript 函数创建“map”对象
var contentString = 'Hello World';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:"Uluru (Ayers Rock)"
//icon:你的图片的地址(此行不设置则使用默认图片)
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
//..................................................................
polyline = new google.maps.Polyline({
path:
[new google.maps.LatLng(41.075145,111.470077),
new google.maps.LatLng(41.085145,111.480077)],
geodesic: true,
strokeColor: "#FFFF00",
strokeOpacity: 1,
strokeWeight: 4
//fillOpacity:0.5
});
polyline.setMap(map);
}
</script>
</head>
<body
<form id="form1" runat="server">
<%–创建名为“map_canvas”的 div 元素来包含地图–%>
<div id="map_canvas" >
</div>
</form>
</body>
</html>