[b]
把此jsp代码直接复制到文件中,即可看到效果,如附件图片一样。[/b]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<%@ page contentType="text/html; charset=UTF-8" language="java"
errorPage=""%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<html>
<head>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript">
var map;
function initialize() {
var myLatlng = new google.maps.LatLng(79.26, 155.25);
var myOptions = {
zoom : 4,
center : myLatlng,
mapTypeId : google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
// Add 5 markers to the map at random locations
var southWest = new google.maps.LatLng(39.26, 115.25);
var northEast = new google.maps.LatLng(21.363882, 130.044922);
var bounds = new google.maps.LatLngBounds(southWest, northEast);
map.fitBounds(bounds);
var lngSpan = northEast.lng() - southWest.lng();
var latSpan = northEast.lat() - southWest.lat();
for ( var i = 0; i < 5; i++) {
//伊塞克湖
var location = new google.maps.LatLng(42.40, 77.29);
//博斯腾湖
var location2 = new google.maps.LatLng(42.00, 87.02);
//色林错湖
var location3 = new google.maps.LatLng(31.75, 89.00);
//纳木错湖
var location4 = new google.maps.LatLng(30.65, 90.57);
//达里诺尔
var location5 = new google.maps.LatLng(43.33, 116.62);
//武威
var location6 = new google.maps.LatLng(38.10, 102.97);
//榆林石窟
var location7 = new google.maps.LatLng(40.23, 95.50);
//米兰
var location8 = new google.maps.LatLng(39.12, 88.73);
//策勒
var location9 = new google.maps.LatLng(36.83, 80.83);
//图木舒克
var location10 = new google.maps.LatLng(39.77, 80.02);
//二连浩特
var location11 = new google.maps.LatLng(43.60, 112.13);
//茶卡盐湖
var location12 = new google.maps.LatLng(36.70, 99.10);
//柴达木盐碱
var location13 = new google.maps.LatLng(38.58, 93.12);
//鄂陵湖
var location14 = new google.maps.LatLng(34.90, 97.58);
//格尔木
var location15 = new google.maps.LatLng(36.33, 94.68);
//洱海
var location16 = new google.maps.LatLng(25.78, 100.18);
//呼伦贝尔湖
var location17 = new google.maps.LatLng(48.93, 117.60);
//塔克拉玛干沙漠
var location18 = new google.maps.LatLng(39.83, 80.17);
var marker = new google.maps.Marker( {
position : location,
map : map,
title : "伊塞克湖"
});
var marker2 = new google.maps.Marker( {
position : location2,
map : map,
title : "博斯腾湖"
});
var marker3 = new google.maps.Marker( {
position : location3,
map : map,
title : "色林错湖"
});
var marker4 = new google.maps.Marker( {
position : location4,
map : map,
title : "纳木错湖"
});
var marker5 = new google.maps.Marker( {
position : location5,
map : map,
title : "达里诺尔"
});
var marker6 = new google.maps.Marker( {
position : location6,
map : map,
title : "武威"
});
var marker7 = new google.maps.Marker( {
position : location7,
map : map,
title : "榆林石窟"
});
var marker8 = new google.maps.Marker( {
position : location8,
map : map,
title : "米兰"
});
var marker9 = new google.maps.Marker( {
position : location9,
map : map,
title : "策勒"
});
var marker10 = new google.maps.Marker( {
position : location10,
map : map,
title : "图木舒克"
});
var marker11 = new google.maps.Marker( {
position : location11,
map : map,
title : "二连浩特"
});
var marker12 = new google.maps.Marker( {
position : location12,
map : map,
title : "茶卡盐湖"
});
var marker13 = new google.maps.Marker( {
position : location13,
map : map,
title : "柴达木盐碱"
});
var marker14 = new google.maps.Marker( {
position : location14,
map : map,
title : "鄂陵湖"
});
var marker15 = new google.maps.Marker( {
position : location15,
map : map,
title : "格尔木"
});
var marker16 = new google.maps.Marker( {
position : location16,
map : map,
title : "洱海"
});
var marker17 = new google.maps.Marker( {
position : location17,
map : map,
title : "呼伦贝尔湖"
});
var marker18 = new google.maps.Marker( {
position : location18,
map : map,
title : "塔克拉玛干沙漠"
});
}
}
</script>
</head>
<body onload="initialize()">
<div style="width: auto; height: 500px;">
<!--google地图-->
<div id="map_canvas" style="width: 100%; height: 100%;">
</div>
</div>
</body>
</html>
- 大小: 433.9 KB
分享到:
相关推荐
GoogleMap API提供了一系列接口,如地图视图、标记(Markers)、信息窗口(InfoWindows)、折线(Polylines)和多边形(Polygons)等,用于显示地理位置、添加标注、绘制路径等。此外,API还支持地理编码(Geocoding...
在进行谷歌地图开发时,为了增强地图的信息性和交互性,开发者经常会向地图上添加各种标注。这些标注不仅能够帮助用户更直观地理解特定地理位置的相关信息,还能根据用户的兴趣或需求动态地显示或隐藏。然而,在实现...
Google Map MarkerCluster 使用簡介 Google Map MarkerCluster 是 Google Map API 中的一個功能強大且實用的工具,它可以幫助開發者快速實現地圖標記的聚合功能。下面是 MarkerCluster 的使用簡介: MarkerCluster...
3. **显示地图**:通过调用GoogleMap对象的setMapType()方法,可以设置地图类型(如卫星图、普通地图或地形图)。同时,通过setCameraPosition()或animateCamera()可以调整地图的视角和中心点。 4. **标注和覆盖物*...
3. **用户数据**:用户使用 Google Map API 在地图上标注的数据。这类数据由用户自行管理。 对于使用 Google Map API 的场景而言,地图上的数据存储取决于数据的类型。如果是谷歌提供的数据,则由谷歌负责存储和...
在V3 API中,我们使用`google.maps.Marker`类来创建标注。首先,需要设置标注的位置,然后可以自定义其外观,如图标、颜色、是否可点击等。例如: ```javascript var marker = new google.maps.Marker({ position:...
"matlab"指明了编程语言,"algorithm"暗示了该程序包可能包含用于处理地图数据的算法,而"googlemap"和"map"则直接指出其与谷歌地图和地图操作相关。 在压缩包中,有两个文件:“license.txt”和“get_google_map”...
但是,对于我来说,在ASP.NET页面中使用JavaScript来调用Google Map的API有一定难度,尤其是利用服务器端函数来动态画出Google Map。例如,我想从SQL Server中读取经纬度信息,然后在Google Map中插入一个点。如果...
谷歌地图应用GoogleMap是一款基于Google提供的地图服务开发的应用程序,它允许用户进行一系列与地理位置相关的操作,如搜索城市、选择定位、切换浏览模式等。在移动设备上,这样的应用为用户提供了一个直观且实用的...
在IT领域,尤其是在移动应用开发或者地理信息系统(GIS)中,使用地图API来描绘运动轨迹是一项常见的需求。本文将深入探讨如何使用...在实际开发过程中,还可以结合压缩包中的"GoogleMap"文件进行更深入的学习和实践。
在本项目中,“googleMap地图”是一个基于Flex技术实现的地图应用示例,用于展示如何在地图上进行属性查询以及标注坐标点。Flex是一种用于构建富互联网应用程序(RIA)的开发框架,它基于ActionScript编程语言和...
"GoogleMap的简单使用"这个主题主要涵盖了如何在Android应用中引入和操作Google Maps API,以实现地图浏览、定位、标注等功能。这里我们将深入探讨如何在Android项目中集成Google Maps SDK,并进行基本的操作。 ...
在IT行业中,GoogleMap定位系统和与Web服务的连接是两个关键的技术领域,它们在现代移动应用和Web应用中有着广泛的应用。以下是这些技术的详细解释: **GoogleMap定位系统**: GoogleMap定位系统是Google提供的一项...
本文将深入探讨Google Map定位的功能、实现原理以及如何在实际项目中进行集成和应用。 首先,Google Maps定位服务是基于谷歌地图API(Application Programming Interface)提供的,它允许开发者在自己的应用中嵌入...
文件“S.Sams.GoogleMap.Web”可能是包含示例代码或者教程的资源,可以帮助开发者更快地理解和使用Google Maps API。在学习和使用这个开发包时,开发者需要注意API的使用限制,如每日请求次数、API密钥管理等,确保...
总的来说,《稻歌Google Map截获器 2.2官方版》是专业人员进行地图相关工作的重要工具,其强大的截图和处理功能,使得地理信息的获取和利用变得更加便捷。无论是在科研、教学还是实际操作中,都能发挥出显著的效果。
2. 基于GoogleMap的个人GPS:结合NDK进行高效的定位和地图显示,提供个性化的导航服务。 3. 豆瓣客户端:可能使用NDK加速数据请求和解析,同时利用Google Map展示地理位置信息。 4. 在线音乐播放器:可能通过NDK实现...
本文将详细介绍Google Maps API的基础知识、正向标注、反向标注、任意多边形、自定义GMarker、地图控件与地图属性以及空间数据类型。 **基础知识** 1. **Google Maps API概念**:它是一套JavaScript库,可以嵌入到...