ManageEngine® Applications Manager 集成Google地图 |
||
本节介绍如果将Google地图集成到Applications Manager。
为了能够使用Google地图,Google API必须可以使用,如果不能,请手动安装。
为Applications Manager客户端配置Google地图
将你的业务组关联到Google地图视图,请参阅以下步骤:
创建一个HTML文件:创建一个空的html文件MapView.html,放置到这个目录:Appmanager home directory / working / maps / 。
导入GOOGLE的JAVASCRIPT,将以下内容添加到HTML文件中
<html>
<script type="text/javascript"src="http://maps.google.com/maps/api/js?sensor=false"></script>
这样做可以导入Google的javascript,并可以使用它们的函数方法。
地图初始化和数据获取 ,接下来将以下内容添加到HTML文件中:
<script type="text/javascript">
var map;
var prevoverlay ;
function initialize(zoom,xcoord,ycoord,newlocation) {
var mapDiv = document.getElementById('mapView');
map = new google.maps.Map(mapDiv, {
center: new google.maps.LatLng(xcoord, ycoord),
zoom: zoom,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
if(!newlocation){
google.maps.event.addListenerOnce(map, 'tilesloaded', addMapMarkers);
} else
{
google.maps.event.addListener(map, 'click', function(event) {
var coordinates = event.latLng.toString().split(",");
var xcoord = coordinates[0];
xcoord = coordinates[0].substring(1);
var ycoord = coordinates[1];
ycoord = ycoord.substring(0,ycoord.length-1)
document.getElementById('xcoord').value = xcoord;
document.getElementById('ycoord').value = ycoord;
if(prevoverlay){
prevoverlay.setMap(null)
}
placeMarker(event.latLng)
});}}
以上函数用于初始化地图,在地图上显示业务组。
保存缩放级别,将以下内容添加到HTML文件中:
function setDefault(){
var zoomlevel = map.getZoom();
var coordinates = map.getCenter().toString().split(",");
var xcoord = coordinates[0];
xcoord = coordinates[0].substring(1);
var ycoord = coordinates[1];
ycoord = ycoord.substring(0,ycoord.length-1)
return customsetDefault(xcoord,ycoord,zoomlevel)
}
这个函数用于保存地图当前的缩放级别。
function placeMarker(location) {
var locationmarker = new google.maps.Marker({
position: location,
map: map,
icon:'/images/marker0.png'
});
prevoverlay = locationmarker;
}这个函数用于在地图中添加一个新的位置。
读取业务组数据,将以下内容添加到HTML文件中:
infos = [];
function createMapMarker(markerele)
{ var monitorname1 =markerele.getAttribute("monitorname");
monitorname1=unescape(monitorname1.replace(/\+/g, " "));
var rca1 = markerele.getAttribute("rca");
var place1 =markerele.getAttribute("place");
var lat = markerele.getAttribute("lat");
var lng = markerele.getAttribute("lng");
var iconpath =markerele.getAttribute("icon");
var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));
var image = new google.maps.MarkerImage(iconpath,new google.maps.Size(20, 30),new google.maps.Point(0,0),new google.maps.Point(10, 30));
var shadow = new google.maps.MarkerImage(iconpath,new google.maps.Size(22, 20),new google.maps.Point(0,0),new google.maps.Point(10, 30));
var marker = new google.maps.Marker({
position: point,
map: map,
icon: image,
shadow: shadow,
title: monitorname1
});
var content = "<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"250px\"><tr><td align=\"left\"><span class=\"bodytext\"><b>"+monitorname1 + "</b> : "+ rca1 +"<br>"+place1+"</td></tr></table>";
var infowindow = new google.maps.InfoWindow({
content: content,
position: point
});
google.maps.event.addListener(marker, 'click', function() {
closeInfos();
infowindow.open(map, marker);
infos[0]=infowindow;
});
}
function closeInfos(){
if(infos.length > 0){
infos[0].set("marker",null);
infos[0].close();
infos.length = 0;
}}</script> </html>
这个函数用于将业务组的数据显示在地图上。
将html文件放置到以下目录:Appmanager/working/maps/。
重要提示:
请参阅Google Map API 使用条款。
世界地图 |
报表 |