<!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&region=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>