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> |
Partager