1+ <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2+ < html xmlns ="http://www.w3.org/1999/xhtml ">
3+
4+ < head >
5+ < meta http-equiv ="Content-Type " content ="text/html; charset=utf-8 " />
6+ < title > </ title >
7+ <!--当前示例页面样式表引用-->
8+ < link rel ="stylesheet " href ="./static/demo/openlayers/example/style.css " />
9+ < script include ="jquery " src ="./static/libs/include-lib-local.js "> </ script >
10+ < script src ="./static/libs/include-openlayers-local.js "> </ script >
11+ < script type ="text/javascript ">
12+ var map = null ;
13+ var resultBaseUrl = "gdbp://MapGisLocal/OpenLayerVecterMap/sfcls/" ; //缓存结果图层的基地址
14+ var resultLayerArr = new Array ( ) ;
15+ function init ( ) {
16+ //初始化地图容器
17+ map = new ol . Map ( {
18+ target : 'mapCon' , //地图容器div的ID
19+ controls : ol . control . defaults ( {
20+ attributionOptions : ( {
21+ collapsible : true
22+ } )
23+ } ) ,
24+ view : new ol . View ( {
25+ center : [ 54.54 , 25 ] , //地图初始中心点
26+ maxZoom : 28 , //最大瓦片显示级数
27+ minZoom : 1 , //最小瓦片显示级数
28+ zoom : 3 , //地图初始显示级数
29+ projection :"EPSG:4326"
30+ } )
31+ } ) ;
32+ var tdk = "4c27d6e0e8a90715b23a989d42272fd8" ; //天地图密钥
33+ //加载天地图瓦片图层数据
34+ map . addLayer ( new ol . layer . Tile ( {
35+ title : "天地图矢量图层" ,
36+ source : new ol . source . XYZ ( {
37+ url : "http://t0.tianditu.com/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=" + tdk ,
38+ wrapX : false
39+ } ) ,
40+ projection :"EPSG:4326"
41+ } ) ) ;
42+ map . addLayer ( new ol . layer . Tile ( {
43+ title : "天地图矢量注记图层" ,
44+ source : new ol . source . XYZ ( {
45+ url : "http://t0.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=" + tdk ,
46+ wrapX : false
47+ } ) ,
48+ projection :"EPSG:4326"
49+ } )
50+ ) ;
51+ }
52+
53+
54+ function clipByLayer ( )
55+ {
56+ var resultname = resultBaseUrl + "clipByLayerAnalysisResultLayer" + getCurentTime ( ) ;
57+ //实例化ClipByLayer类
58+ var clipParam = new Zondy . Service . ClipByLayer ( {
59+ ip : "develop.smaryun.com" ,
60+ port : "6163" , //访问IGServer的端口号,.net版为6163,Java版为8089,
61+ //源简单要素类的URL
62+ srcInfo1 : "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流" ,
63+ //裁剪框简单要素类的URL
64+ srcInfo2 : "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界政区" ,
65+ //设置结果URL
66+ desInfo : resultname
67+ } ) ;
68+ //调用基类的execute方法,执行图层裁剪分析。AnalysisSuccess为结果回调函数
69+ clipParam . execute ( AnalysisSuccess , "post" , false , "json" , ( ) => { } ) ;
70+ }
71+
72+ //分析成功后的回调
73+ function AnalysisSuccess ( data ) {
74+ if ( ! data . results ) {
75+ alert ( "裁剪失败,请检查参数!" ) ;
76+ }
77+ else {
78+ if ( data . results . length != 0 ) {
79+ var resultLayerUrl = data . results [ 0 ] . Value || data . results [ 0 ] . value ;
80+ //将结果图层添加到地图视图中显示
81+ var resultLayer = new Zondy . Map . GdbpLayer ( "MapGIS IGS BuffAnalyResultLayer" , [ resultBaseUrl + resultLayerUrl ] , {
82+ ip : "develop.smaryun.com" ,
83+ port : "6163" , //访问IGServer的端口号,.net版为6163,Java版为8089,
84+ isBaseLayer : false
85+ } ) ;
86+ map . addLayer ( resultLayer ) ;
87+ resultLayerArr . push ( resultLayer ) ;
88+ }
89+ }
90+ }
91+
92+ function deleteAll ( )
93+ {
94+ while ( resultLayerArr . length > 0 )
95+ {
96+ map . removeLayer ( resultLayerArr . pop ( ) ) ;
97+ }
98+ }
99+
100+ function getCurentTime ( ) {
101+ var now = new Date ( ) ;
102+ //获取当前年份
103+ var year = now . getFullYear ( ) ;
104+ //获取当前月份
105+ var month = now . getMonth ( ) + 1 ;
106+ //获取当前日期
107+ var day = now . getDate ( ) ;
108+ //获取当前时刻
109+ var hh = now . getHours ( ) ;
110+ //获取当前分钟
111+ var mm = now . getMinutes ( ) ;
112+ //获取当前秒钟
113+ var ss = now . getSeconds ( ) ;
114+ //将当前的日期拼串
115+ var clock = year + "-" ;
116+ if ( month < 10 )
117+ clock += "0" ;
118+ clock += month + "-" ;
119+ if ( day < 10 )
120+ clock += "0" ;
121+ clock += day + "-" ;
122+ if ( hh < 10 )
123+ clock += "0" ;
124+ clock += hh ;
125+ if ( mm < 10 ) clock += '0' ;
126+ clock += mm ;
127+ if ( ss < 10 ) clock += '0' ;
128+ clock += ss ;
129+ return ( clock ) ;
130+ }
131+ </ script >
132+ </ head >
133+
134+ < body onload ="init() ">
135+ < div id ="mapCon ">
136+ </ div >
137+
138+ < div id ="menuContain " class ='menuContain '>
139+ < div id ="tool-container ">
140+ < div id ='dataSourceMenuID ' class ="optmain " status ="unactive " onclick ="switchMenuStatus(this,'menu1') ">
141+ < span > </ span > < i class ="menuGroup "> 裁剪分析</ i > < em > </ em >
142+ </ div >
143+
144+ </ div >
145+ </ div >
146+ < div id ="menu1 " class ="menuStrip " style ='display:none ' >
147+ < ul class ="menuItems ">
148+ < li onclick ="clipByLayer() "> < span class ="item1 "> </ span > < i > 图层裁剪</ i >
149+ </ li >
150+ < li class ="divider "> </ li >
151+ < li onclick ="deleteAll() "> < span class ="item3 "> </ span > < i > 清除</ i >
152+ </ li >
153+ </ ul >
154+ </ div >
155+ < script >
156+ function switchMenuStatus ( div , menuitemFrameID ) {
157+ var temDivs = document . getElementsByClassName ( 'optmain' ) ;
158+ if ( temDivs . length > 0 ) {
159+ for ( var i = 0 ; i < temDivs . length ; i ++ ) {
160+ if ( temDivs [ i ] === div ) {
161+ var status = div . getAttribute ( "status" ) ;
162+ if ( status == "unactive" ) {
163+ div . setAttribute ( "status" , "active" ) ;
164+ var tem_spans = div . getElementsByTagName ( "span" ) ;
165+ var tem_ems = div . getElementsByTagName ( "em" ) ;
166+ tem_spans [ 0 ] . className = "active" ;
167+ tem_ems [ 0 ] . className = "active" ;
168+
169+ //显示菜单项
170+ DisplayMenuItem ( true , menuitemFrameID ) ;
171+
172+ }
173+ else {
174+ div . setAttribute ( "status" , "unactive" ) ;
175+ var tem_spans = div . getElementsByTagName ( "span" ) ;
176+ var tem_ems = div . getElementsByTagName ( "em" ) ;
177+ tem_spans [ 0 ] . className = "" ;
178+ tem_ems [ 0 ] . className = "" ;
179+
180+ //隐藏菜单项
181+ DisplayMenuItem ( false , menuitemFrameID ) ;
182+ }
183+ }
184+ else {
185+ var status = temDivs [ i ] . getAttribute ( "status" ) ;
186+ if ( status == "active" ) {
187+ temDivs [ i ] . setAttribute ( "status" , "unactive" ) ;
188+ var tem_spans = temDivs [ i ] . getElementsByTagName ( "span" ) ;
189+ var tem_ems = temDivs [ i ] . getElementsByTagName ( "em" ) ;
190+ tem_spans [ 0 ] . className = "" ;
191+ tem_ems [ 0 ] . className = "" ;
192+ }
193+ }
194+ }
195+ }
196+ }
197+
198+ function DisplayMenuItem ( isDisplay , iframeID ) {
199+ var menuItemFrame = document . getElementById ( iframeID ) ;
200+ if ( menuItemFrame != null ) {
201+ if ( isDisplay ) {
202+ var temDivs = document . getElementsByClassName ( 'menuStrip' ) ;
203+ if ( temDivs . length > 0 ) {
204+ for ( var i = 0 ; i < temDivs . length ; i ++ ) {
205+ if ( temDivs [ i ] != menuItemFrame ) {
206+ temDivs [ i ] . style . display = "none" ;
207+ }
208+ }
209+ }
210+ menuItemFrame . style . display = "" ;
211+ }
212+ else {
213+ menuItemFrame . style . display = "none" ;
214+ }
215+ }
216+ } ;
217+ </ script >
218+ </ body >
219+
220+ </ html >
0 commit comments