<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html;charset=UTF-8" http-equiv="Content-Type">
</head>
<body bgcolor="#ffffff" text="#000000">
Hi Peter,<br>
<br>
It seems you're trying to use google maps as base layer with your data
overlaid on top. The problem is google maps uses spherical mercator
projection, while your layer (and map) uses EPSG:4326.<br>
To get the layers to overlap, you need to use the same projection
everywhere - try setting your map and layer projection to:<br>
<br>
var lonlat = new OpenLayers.Projection("EPSG:4326"); <br>
var sphericalMercator = new OpenLayers.Projection("EPSG:900913");<br>
var options = { <b>projection: sphericalMercator, displayProjection:
lonlat,</b> units: "m", numZoomLevels: 18, ...};<br>
...<br>
var google_street = new OpenLayers.Layer.Google( 'Google Streets', {<b>'sphericalMercator':
true</b>} );<br>
<pre wrap="">var ehmpLayer = new OpenLayers.Layer.WMS(
"ehmp:catchments", <a class="moz-txt-link-rfc2396E" href="http://localhost:8080/geoserver/wms">"http://localhost:8080/geoserver/wms"</a>,
{
layers: 'ehmp:catchments92',
styles: 'catchments',
<b>srs: 'EPSG:900913', //hopefully!</b>
transparent: true,
tiled: false,
format: "image/png"
},
{singleTile: true,
<b>projection: sphericalMercator</b>
} // needed, otherwise catchments are
vertically squashed
);</pre>
Your layer should support this type of projection server-side for this
to work.<br>
<br>
The singleTile problem comes most likely from a projection issue.<br>
<br>
Good luck,<br>
Adrian<br>
<br>
Peter Becker wrote:
<blockquote cite="mid:200907141008.16446.pbecker@itee.uq.edu.au"
type="cite">
<pre wrap="">Hello all,
I'm trying to let the user select polygons on a map and started creating some
JavaScript based on <a class="moz-txt-link-freetext" href="http://openlayers.org/dev/examples/getfeature-wfs.html">http://openlayers.org/dev/examples/getfeature-wfs.html</a>
As opposed to the example everything I use is in WGS84, so I don't need all
the extra projection options. The polygons I have are served from a local
Geoserver instance (1.7.5). The OpenLayers version is the hosted one (BTW: may
I recommend adding a version number into the URL and then setting all cache
headers so clients don't have to hit the server for 304s all the time? That
tends to make a huge difference for client-side performance and also takes load
of the server. I can dig out a detailed explanation if wanted.)
I encountered two problems: at first both the WMS layer and the selection layer
where vertically squashed. Somehow I fixed that by adding the {singleTile:
true} option for that layer, but I don't understand why that should be needed
or why it helps. But even after that change the selection layer is still in
the old form, i.e. the highlights don't match the map. They tend to be higher,
the difference seems to be in screen coordinates, not in the geospatial
coordinates. The selection itself seems to work correctly in every case:
wherever I click I seem to select the polygon that should be there,
independent of what is or is not displayed in the location.
Why is this happening? How do I fix it? Is there any documentation I might have
missed to explain this type of frontend? It would be very useful if it works.
Code below.
TIA,
Peter
<script type="text/javascript">
var map, styleMap;
function init(){
OpenLayers.DOTS_PER_INCH = 25.4 / 0.28;
var bounds = new OpenLayers.Bounds(151.5516558, -28.48572915,
153.6472702, -25.87920985);
var options = {
controls: [],
projection: "EPSG:4326",
units: 'degrees'
};
map = new OpenLayers.Map('map', options);
var gsat = new OpenLayers.Layer.Google(
"Google Satellite",
{type: G_SATELLITE_MAP, numZoomLevels: 20}
);
var gphy = new OpenLayers.Layer.Google(
"Google Physical",
{type: G_PHYSICAL_MAP}
);
var gmap = new OpenLayers.Layer.Google(
"Google Streets",
{numZoomLevels: 20}
);
var ghyb = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: G_HYBRID_MAP, numZoomLevels: 20}
);
var ehmpLayer = new OpenLayers.Layer.WMS(
"ehmp:catchments", <a class="moz-txt-link-rfc2396E" href="http://localhost:8080/geoserver/wms">"http://localhost:8080/geoserver/wms"</a>,
{
layers: 'ehmp:catchments92',
styles: 'catchments',
srs: 'EPSG:4326',
transparent: true,
tiled: false,
format: "image/png"
},
{singleTile: true} // needed, otherwise catchments are
vertically squashed
);
var select = new OpenLayers.Layer.Vector("Selection", {styleMap:
new
OpenLayers.Style(OpenLayers.Feature.Vector.style["select"])
});
map.addLayers([gsat, gphy, gmap, ghyb, ehmpLayer, select]);
// build up all controls
map.addControl(new OpenLayers.Control.PanZoomBar({
position: new OpenLayers.Pixel(2, 15)
}));
map.addControl(new OpenLayers.Control.Navigation());
map.addControl(new OpenLayers.Control.Scale($('scale')));
map.addControl(new OpenLayers.Control.MousePosition({element:
$('location')}));
map.addControl(new OpenLayers.Control.LayerSwitcher());
var control = new OpenLayers.Control.GetFeature({
protocol: OpenLayers.Protocol.WFS.fromWMSLayer(ehmpLayer),
box: false,
hover: false,
multipleKey: "shiftKey",
toggleKey: "ctrlKey"
});
control.events.register("featureselected", this, function(e) {
select.addFeatures([e.feature]);
});
control.events.register("featureunselected", this, function(e) {
select.removeFeatures([e.feature]);
});
map.addControl(control);
control.activate();
map.zoomToExtent(bounds);
}
</script>
_______________________________________________
Users mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Users@openlayers.org">Users@openlayers.org</a>
<a class="moz-txt-link-freetext" href="http://openlayers.org/mailman/listinfo/users">http://openlayers.org/mailman/listinfo/users</a>
</pre>
</blockquote>
<br>
<br>
</body>
</html>