1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>OpenLayers map preview</title>
<style type="text/css">
#map {
width: 700px;
height: 700px;
border: 1px solid black;
}
</style>
<script src="http://localhost:8080/geoserver/openlayers/OpenLayers.js" type="text/javascript">
</script>
<script defer="defer" type="text/javascript">
var map;
var untiled;
var tiled;
function setHTML(response) {
OpenLayers.Util.getElement('nodelist').innerHTML = response.responseText;
};
function init(){
map = new OpenLayers.Map('map', {controls:[], 'projection': 'EPSG:42305', 'units':'m'});
OpenLayers.IMAGE_RELOAD_ATTEMPTS = 5;
// setup tiled layer
var bounds = new OpenLayers.Bounds(9.508385215839038E8,3.3602273172680664E8,9.902465641840553E8,3.7504126948208547E8)
tiled = new OpenLayers.Layer.WMS(
"Geoserver layers", "http://localhost:8080/geoserver/wms",
{
height: '700',
width: '700',
layers: 'drdict_carto:SECTIONC,drdict_carto:PARCELL1',
srs: 'EPSG:42305',
format: 'image/png', tiled: 'true', tilesOrigin : "9.508385215839038E8,3.3602273172680664E8"
},
{maxExtent: bounds, maxResolution: 153937.66640684195, projection: "EPSG:42305", buffer: 0}
);
//map.addLayer(tiled);
// setup untiled layer
untiled = new OpenLayers.Layer.WMS.Untiled(
"Geoserver layers", "http://localhost:8080/geoserver/wms",
{
height: '700',
width: '700',
layers: 'drdict_carto:SECTIONC,drdict_carto:PARCELL1',
srs: 'EPSG:42305',
format: 'image/png'
},
{maxExtent: bounds, maxResolution: 153937.66640684195, projection: "EPSG:42305"}
);
untiled.ratio=1;
untiled.setVisibility(false, false);
map.addLayer(untiled);
// setup controls and initial zooms
map.addControl(new OpenLayers.Control.PanZoomBar({div:$('nav')}));
map.addControl(new OpenLayers.Control.MouseDefaults());
map.addControl(new OpenLayers.Control.Scale($('scale')));
map.addControl(new OpenLayers.Control.MousePosition({element: $('position')}));
//map.addControl(new OpenLayers.Control.LayerSwitcher());
//map.addControl(new OpenLayers.Control.OverviewMap());
map.zoomToExtent(bounds);
// support GetFeatureInfo
map.events.register('click', map, function (e) {
OpenLayers.Util.getElement('nodelist').innerHTML = "Loading... please wait...";
var url = map.layers[0].getFullRequestString({
REQUEST: "GetFeatureInfo",
EXCEPTIONS: "application/vnd.ogc.se_xml",
BBOX: map.getExtent().toBBOX(),
X: e.xy.x,
Y: e.xy.y,
INFO_FORMAT: 'text/html',
QUERY_LAYERS: map.layers[0].params.LAYERS,
FEATURE_COUNT: 50,
layers: 'drdict_carto:SECTIONC,drdict_carto:PARCELL1',
srs: 'EPSG:42305',
WIDTH: map.size.w,
HEIGHT: map.size.h},
"http://localhost:8080/geoserver/wms"
);
OpenLayers.loadURL(url, '', this, setHTML, setHTML);
Event.stop(e);
});
}
</script>
</head>
<body onload="init()">
<table>
<tr>
<td style="width:40px" valign="middle" rowspan="3"><div id="nav"></div></td>
<td colspan="3" align="right">
<!-- Switch layers when links are pressed -->
<a id="untiledLink" href="#" onclick="map.removeLayer(tiled);map.addLayer(untiled)">Untiled</a>
<a id="tiledLink" href="#" onclick="map.removeLayer(untiled);map.addLayer(tiled);">Tiled</a>
</td>
</tr>
<tr>
<td colspan="3"><div id="map"></div></td>
</tr>
<tr>
<td><div id="scale"></div></td>
<td/>
<td align="right"><div id="position"></div></td>
</tr>
</table>
<div id="nodelist">Click on the map to get feature infos</div>
</body>
</html> |
