<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=9,IE=8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<title>中小河流监测预系统</title>
<link rel="stylesheet" type="text/css" href="scripts/jsapi/js/dojo/dijit/themes/claro/claro.css" />
<link rel="stylesheet" type="text/css" href="css/toolbar/toolbarItem/toolbarItem.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/ExtJs/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/ExtJs/ux/css/ux-all.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/ExtJs/resources/css/watfcustom.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/ExtJs/resources/ux/tab-scroller-menu.css" />
<link id="ext-patch" rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/ExtJs/resources/ext-patch.css" />
<style type="text/css">
html,body {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px;
overflow: hidden;
}
#map {
margin: 0px;
padding: 0px;
background-color: #FFF;
border: solid 0px #6495ED;
}
</style>
<!--Jquery-->
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/jquery/jquery-1.7.1.min.js"></script>
<!--Ext&Jquery-->
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/ExtJs/adapter/jquery/ext-jquery-adapter.js"></script>
<script language="JavaScript" type="text/JavaScript">
//<!--
var REQUEST_CONTEXTPATH="${pageContext.request.contextPath}";
//-->
</script>
<!--Ext-->
<script type="text/javascript" src="gisConfig.jsp"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/ExtJs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/ExtJs/ext-all-debug.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/ExtJs/ux/ux-all.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/ExtJs/ux/DataView-more.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/ExtJs/local/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/watf/ext/watf-base.js"></script>
<script type="text/javascript" src="scripts/jsapi/Default.js"></script>
<script type="text/javascript" src="scripts/gis/config.js"></script>
<script type="text/javascript" src="scripts/gis/util.js"></script>
<script type="text/javascript" src="scripts/watf/ext/watf-base.js"></script>
<script type="text/javascript">
//<!--
dojo.require("esri.map");
dojo.require("dijit.dijit");
dojo.require("esri.dijit.OverviewMap");
dojo.require("esri.dijit.Scalebar");
// 全局地图变量
var browseType = getBrowseType();
var mapArray = new Array();
var initialExtent = null;
var spaceBetweenMap = 10;
var mapIdNumber = 1;
var dynamicMapServiceLayerArray = [
{id:"hubeiMeasure",name:"hubeiMeasure",visible:true,url:"http://10.1.102.171:6080/arcgis/rest/services/jcxx/hubeiMeasure/MapServer"},
{id:"Station",name:"Station",visible:true,url:"http://10.1.102.171:6080/arcgis/rest/services/jcxx/Station/MapServer"}];
//
Ext.onReady(function() {
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'qtip';
});
//
function createContrastMap(mapId, dynamicLayerArray)
{
var multiMapContainer = document.getElementById("multiMapContainer");
var multiMapContainerWidth = multiMapContainer.clientWidth;
var multiMapContainerHeight = multiMapContainer.clientHeight;
var mapWidth = parseInt((multiMapContainerWidth - spaceBetweenMap * 3) / 2);
var mapHeight = parseInt((multiMapContainerHeight - spaceBetweenMap * 3) / 2);
var mapLeft = (mapArray.length % 2) * (mapWidth + spaceBetweenMap) + spaceBetweenMap;
var mapTop = parseInt(mapArray.length / 2) * (mapHeight + spaceBetweenMap) + spaceBetweenMap;
if(mapArray && mapArray.length>0)
{
for(var i=0; i<mapArray.length; i++)
{
var mapOther = mapArray[i];
var mapOtherDiv = mapOther.root.parentNode;
if(parseInt(mapOtherDiv.style.width) != mapWidth || parseInt(mapOtherDiv.style.height) != mapHeight)
{
mapOtherDiv.style.width = mapWidth + "px";
mapOtherDiv.style.height = mapHeight + "px";
mapOtherDiv.style.left = (i % 2) * (mapWidth + spaceBetweenMap) + spaceBetweenMap + "px";
mapOtherDiv.style.top = parseInt(i / 2) * (mapHeight + spaceBetweenMap) + spaceBetweenMap + "px";
mapOther.resize(true);
}
}
}
//
panel = document.getElementById(mapId);
if(!panel)
{
panel = document.createElement("div");
panel.id = mapId;
panel.style.position = "absolute";
panel.style.left = mapLeft + "px";
panel.style.top = mapTop + "px";
panel.style.width = mapWidth + "px";
panel.style.height = mapHeight + "px";
panel.style.border = "1px solid #000000";
panel.style.zIndex = "1200";
panel.style.visibility = "visible";
panel.style.overflow = "hidden";
multiMapContainer.appendChild(panel);
}
var map = new esri.Map(mapId, {
slider: false,
extent : initialExtent,
logo : false
});
dojo.connect(map, 'onLoad', function(map) {
// 比例尺
var scalebar = new esri.dijit.Scalebar({
map : map,
scalebarUnit : "metric",
attachTo : "bottom-center"
});
});
//
// 加载BaseMap的GIS服务
for (var i = 0; i < config.map.baseMap.length; i++) {
var id = config.map.baseMap[i].id;
var basemapUrl = config.map.baseMap[i].url;
var visible = config.map.baseMap[i].visible;
var type = config.map.baseMap[i].type;
var basemap = null;
if (type == "tiled") {
basemap = new esri.layers.ArcGISTiledMapServiceLayer(basemapUrl, {
visible : visible,
id : id
});
}
map.addLayer(basemap);
}
// 加载GIS服务
if(dynamicLayerArray && dynamicLayerArray.length > 0)
{
for(var i=0; i<dynamicLayerArray.length; i++)
{
var dynamicLayer = dynamicLayerArray[i];
var arcGISDynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer(dynamicLayer.url, {visible : dynamicLayer.visible, id : dynamicLayer.id});
map.addLayer(arcGISDynamicMapServiceLayer);
}
}
//
dojo.connect(map, 'onExtentChange', function(extent,delta) {
initialExtent = extent;
var xOffset = (extent.xmax - extent.xmin)/map.width * 2;
var yOffset = (extent.ymax - extent.ymin)/map.height * 2;
for(var i=0; i<mapArray.length; i++)
{
var mapOther = mapArray[i];
if(mapOther.id != map.id && !(Math.abs(extent.xmin - mapOther.extent.xmin) < xOffset && Math.abs(extent.ymin - mapOther.extent.ymin) < yOffset))
{
mapOther.setExtent(extent, false);
break;
}
}
});
mapArray.push(map);
}
function init() {
esri.config.defaults.io.proxyUrl = "proxy.jsp";
Ext.BLANK_IMAGE_URL = 'scripts/ext/resources/images/default/s.gif';
Ext.QuickTips.init();
var viewport = new Ext.Viewport({
layout : "border",
border : false,
items : [{
region: 'west',
split: true,
width: 300,
minSize: 300,
maxSize: 300,
collapsible: true,
title: '地图种类',
html : '<div id="toolBarPanel" style=" position:absolute; right:0px; top:0px; z-Index:1000; "></div>',
margins: '0 0 0 0'
},{
region : 'center',
margins : '0 0 0 0',
cls : 'empty',
html : '<div id="multiMapContainer" style="position:absolute; left:0px; top:0px; width:100%; height:100%; z-Index:1000; overflow:auto; "></div>'
}]
});
createToolbar();
//
initialExtent = new esri.geometry.Extent({
"xmin" : config.map.initialextent[0],
"ymin" : config.map.initialextent[1],
"xmax" : config.map.initialextent[2],
"ymax" : config.map.initialextent[3],
"spatialReference" : {
"wkid" : config.map.wkid
}
});
}
// 加载地图
dojo.addOnLoad(init);
function createToolbar() {
var toolbar = new Ext.Toolbar({
renderTo : "toolBarPanel",
items : [{
tooltip : "放大",
iconCls : 'icon-zoomIn',
checked : true,
enableToggle : true,
toggleGroup : 'toolbar',
listeners : {
click : function(s, e) {
var mapId = "mapId" + mapIdNumber;
createContrastMap(mapId , dynamicMapServiceLayerArray);//
mapIdNumber++;
}
}
}]
});
}
// 显示等待信息
function showLoading() {
var bd = Ext.getBody();
bd.mask("<font style='font-weight:bold;'>正在加载...</font>", 'x-mask-loading');
}
// 不显示等待信息
function hideLoading(error) {
var bd = Ext.getBody();
bd.unmask();
}
//-->
</script>
</head>
<body class="claro" οncοntextmenu="return false;">
</body>
</html>
144
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
