用js显示google地图总结
功能较全的一个，可显示地址，可以缩放，拖动（直接把代码复制下来即可）
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MyHtml2.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://maps.google.com/maps?file=api&;v=2&key=ABQIAAAABjfudy2JHun7akhM9qSqPxQ_Zu-7BHeTikSrrThuN_kCyr6v3xS2zdq46jLJxIIm3VuRdZkpY0AsbQ"
type="text/javascript"></script>
</head>
<script type="text/javascript">
var map;
var companyAddress = "地址：";
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("mapdiv"));
//设置地图中心点和缩放级别
map.setCenter(new GLatLng(31.2249992526385, 121.51159197092056), 18);
map.openInfoWindow(map.getCenter(), companyAddress);
GEvent.addListener(map, "click", function(overlay, point) {
map.openInfoWindow(new GLatLng(31.2249992526385, 121.51159197092056), companyAddress);
}); //点击就显示地址，缺点：地点提示关不掉。若把以上三行注释掉，关掉地点提示，就无法在打开提示。
map.enableContinuousZoom();
//启用使用鼠标滚轮缩放
map.enableScrollWheelZoom();
//添加地图类型
//map.addMapType(G_PHYSICAL_MAP);
//设置地图显示类型
//map.setMapType(G_PHYSICAL_MAP);
//添加控件
map.addControl(new GLargeMapControl(), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 32)));
}
}
</script>
<body onload="initialize()" onunload="GUnload()">
<div id="mapdiv" style="width: 695; height: 374; font-size:15px;">
</div>
<br>
</body>
</html>
点击显示经纬度
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MyHtml2.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://maps.google.com/maps?file=api&;v=2&key=ABQIAAAABjfudy2JHun7akhM9qSqPxQ_Zu-7BHeTikSrrThuN_kCyr6v3xS2zdq46jLJxIIm3VuRdZkpY0AsbQ"
type="text/javascript"></script>
</head>
<script type="text/javascript">
var map;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("mapdiv"));
//设置地图中心点和缩放级别
map.setCenter(new GLatLng(31.2249992526385, 121.51159197092056), 18);
GEvent.addListener(map, "click", function(overlay, point) {
// document.getElementById("x").value = point.x;
// document.getElementById("y").value = point.y;
// var center = new GLatLng(point);
// var marker = new GMarker(point, { draggable: true });
// GEvent.addListener(marker, "dragstart", function() {
// map.closeInfoWindow();
// });
// GEvent.addListener(marker, "dragend", function() {
// marker.openInfoWindowHtml("正在反弹...");
// });
//map.clearoverlays();
// map.addOverlay(marker);
var myHtml = "GPoint 值是 : " + point;
map.openInfoWindow(point, myHtml);
});
map.enableContinuousZoom();
//启用使用鼠标滚轮缩放
map.enableScrollWheelZoom();
//添加地图类型
//map.addMapType(G_PHYSICAL_MAP);
//设置地图显示类型
//map.setMapType(G_PHYSICAL_MAP);
//添加控件
map.addControl(new GLargeMapControl(), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 32)));
}
}
</script>
<body onload="initialize()" onunload="GUnload()">
<div id="mapdiv" style="width: 695; height: 374">
mapdiv</div>
<br>
</body>
</html>
右下角显示当前位置
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test2.aspx.cs" Inherits="test2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps</title>
<script src="http://maps.google.com/maps?file=api&v=3&key=ABQIAAAAB4YemV6fPrENI8yI4YDFtRTmwICogzMOKaxKEnhPUPLF-x6hxRR4Q894V3A6N4GoB5q-EdU1SKPArg" type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(23.755181766112635, 120.552978515625), 7);
map.setUIToDefault();
map.addControl(new GMapTypeControl());
map.addControl(new GNavLabelControl(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(1, 2)));
map.enableGoogleBar();
//讀取user.xml
GDownloadUrl("user.xml", function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName("row");
var points = new Array();
for (var i = 0; i < markers.length; i++) {
point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var marker = new GMarker(point);
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("contact_address");
var html = "<b>" + name + "</b> <br/>" + address;
GEvent.addListener(marker, "click", function() {
this.openInfoWindowHtml(html);
});
map.addOverlay(marker);
}
});
}
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas" style="width: 700px; height: 400px"></div>
</body>
</html>