1- <!DOCTYPE html>
2- < html >
3- < head >
4- < meta charset ="UTF-8 ">
5- < title > SuperMap 图层信息</ title >
6-
7- < link href ="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css " rel ="stylesheet ">
8- < link href ="http://cdn.bootcss.com/openlayers/4.2.0/ol.css " rel ="stylesheet ">
9- < style >
10- .ol-popup {
11- position : absolute;
12- background-color : white;
13- -webkit-filter : drop-shadow (0 1px 4px rgba (0 , 0 , 0 , 0.2 ));
14- filter : drop-shadow (0 1px 4px rgba (0 , 0 , 0 , 0.2 ));
15- padding : 15px ;
16- border-radius : 10px ;
17- border : 1px solid # cccccc ;
18- bottom : 12px ;
19- left : -50px ;
20- min-width : 280px ;
21- }
22-
23- .ol-popup : after , .ol-popup : before {
24- top : 100% ;
25- border : solid transparent;
26- content : " " ;
27- height : 0 ;
28- width : 0 ;
29- position : absolute;
30- pointer-events : none;
31- }
32-
33- .ol-popup : after {
34- border-top-color : white;
35- border-width : 10px ;
36- left : 48px ;
37- margin-left : -10px ;
38- }
39-
40- .ol-popup : before {
41- border-top-color : # cccccc ;
42- border-width : 11px ;
43- left : 48px ;
44- margin-left : -11px ;
45- }
46-
47- </ style >
48- </ head >
49- < body style =" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100% ">
50- < div id ="map " style ="width: 100%;height:100% "> </ div >
51- < div id ="popup " class ="ol-popup ">
52- < div id ="popup-content "> </ div >
53- </ div >
54-
55- < script src ="http://cdn.bootcss.com/openlayers/4.2.0/ol.js "> </ script >
56- < script type ="text/javascript " src ="../../dist/iclient9-openlayers.min.js "> </ script >
57- < script type ="text/javascript ">
58- var container = document . getElementById ( 'popup' ) ;
59- var content = document . getElementById ( 'popup-content' ) ;
60- var overlay = new ol . Overlay ( ( {
61- element : container ,
62- autoPan : true ,
63- autoPanAnimation : {
64- duration : 250
65- }
66- } ) ) ;
67- var map , url = "http://support.supermap.com.cn:8090/iserver/services/map-world/rest/maps/World" ;
68- map = new ol . Map ( {
69- target : 'map' ,
70- controls : ol . control . defaults ( { attributionOptions : { collapsed : false } } )
71- . extend ( [ new ol . supermap . control . Logo ( ) ] ) ,
72- view : new ol . View ( {
73- center : [ 0 , 0 ] ,
74- zoom : 3 ,
75- projection : 'EPSG:4326'
76- } ) ,
77- overlays : [ overlay ]
78- } ) ;
79- var layer = new ol . layer . Tile ( {
80- source : new ol . source . TileSuperMapRest ( {
81- url : url
82- } ) ,
83- projection : 'EPSG:4326'
84- } ) ;
85- map . addLayer ( layer ) ;
86- layerService ( ) ;
87-
88- function layerService ( ) {
89- new ol . supermap . LayerInfoService ( url ) . getLayersInfo ( function ( serviceResult ) {
90- var innerHtml = "" ;
91- serviceResult . result . subLayers . layers . map ( function ( layer ) {
92- innerHtml += layer . name + "<br>" ;
93- } ) ;
94- content . innerHTML = innerHtml ;
95- overlay . setPosition ( [ 0 , 0 ] ) ;
96- } ) ;
97- }
98- </ script >
99- </ body >
1+ <!DOCTYPE html>
2+ < html >
3+ < head >
4+ < meta charset ="UTF-8 ">
5+ < title > SuperMap 图层信息</ title >
6+ < script type ="text/javascript " include ="bootstrap-css " src ="../include-web.js "> </ script >
7+ < script type ="text/javascript " src ="../../dist/include-openlayers.js "> </ script >
8+ < style >
9+ .ol-popup {
10+ position : absolute;
11+ background-color : white;
12+ -webkit-filter : drop-shadow (0 1px 4px rgba (0 , 0 , 0 , 0.2 ));
13+ filter : drop-shadow (0 1px 4px rgba (0 , 0 , 0 , 0.2 ));
14+ padding : 15px ;
15+ border-radius : 10px ;
16+ border : 1px solid # cccccc ;
17+ bottom : 12px ;
18+ left : -50px ;
19+ min-width : 280px ;
20+ }
21+
22+ .ol-popup : after , .ol-popup : before {
23+ top : 100% ;
24+ border : solid transparent;
25+ content : " " ;
26+ height : 0 ;
27+ width : 0 ;
28+ position : absolute;
29+ pointer-events : none;
30+ }
31+
32+ .ol-popup : after {
33+ border-top-color : white;
34+ border-width : 10px ;
35+ left : 48px ;
36+ margin-left : -10px ;
37+ }
38+
39+ .ol-popup : before {
40+ border-top-color : # cccccc ;
41+ border-width : 11px ;
42+ left : 48px ;
43+ margin-left : -11px ;
44+ }
45+
46+ </ style >
47+ </ head >
48+ < body style =" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100% ">
49+ < div id ="map " style ="width: 100%;height:100% "> </ div >
50+ < div id ="popup " class ="ol-popup ">
51+ < div id ="popup-content "> </ div >
52+ </ div >
53+ < script type ="text/javascript ">
54+ var container = document . getElementById ( 'popup' ) ;
55+ var content = document . getElementById ( 'popup-content' ) ;
56+ var overlay = new ol . Overlay ( ( {
57+ element : container ,
58+ autoPan : true ,
59+ autoPanAnimation : {
60+ duration : 250
61+ }
62+ } ) ) ;
63+ var map , url = "http://support.supermap.com.cn:8090/iserver/services/map-world/rest/maps/World" ;
64+ map = new ol . Map ( {
65+ target : 'map' ,
66+ controls : ol . control . defaults ( { attributionOptions : { collapsed : false } } )
67+ . extend ( [ new ol . supermap . control . Logo ( ) ] ) ,
68+ view : new ol . View ( {
69+ center : [ 0 , 0 ] ,
70+ zoom : 3 ,
71+ projection : 'EPSG:4326'
72+ } ) ,
73+ overlays : [ overlay ]
74+ } ) ;
75+ var layer = new ol . layer . Tile ( {
76+ source : new ol . source . TileSuperMapRest ( {
77+ url : url
78+ } ) ,
79+ projection : 'EPSG:4326'
80+ } ) ;
81+ map . addLayer ( layer ) ;
82+ layerService ( ) ;
83+
84+ function layerService ( ) {
85+ new ol . supermap . LayerInfoService ( url ) . getLayersInfo ( function ( serviceResult ) {
86+ var innerHtml = "" ;
87+ serviceResult . result . subLayers . layers . map ( function ( layer ) {
88+ innerHtml += layer . name + "<br>" ;
89+ } ) ;
90+ content . innerHTML = innerHtml ;
91+ overlay . setPosition ( [ 0 , 0 ] ) ;
92+ } ) ;
93+ }
94+ </ script >
95+ </ body >
10096</ html >
0 commit comments