[OpenLayers-Users] WFS selection layer deformed

Adrian Popa adrian_gh.popa at romtelecom.ro
Tue Jul 14 01:24:24 EDT 2009


Hi Peter,

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.
To get the layers to overlap, you need to use the same projection 
everywhere - try setting your map and layer projection to:

var lonlat = new OpenLayers.Projection("EPSG:4326");            
var sphericalMercator = new OpenLayers.Projection("EPSG:900913");
var options = { *projection: sphericalMercator, displayProjection: 
lonlat,* units: "m", numZoomLevels: 18, ...};
...
var google_street = new OpenLayers.Layer.Google( 'Google Streets', 
{*'sphericalMercator': true*} );

var ehmpLayer = new OpenLayers.Layer.WMS(
                    "ehmp:catchments", "http://localhost:8080/geoserver/wms",
                    {
                        layers: 'ehmp:catchments92',
                        styles: 'catchments',
                        *srs: 'EPSG:900913', //hopefully!*
                        transparent: true,
                        tiled: false,
                        format: "image/png"
                    },
                    {singleTile: true,
			*projection: sphericalMercator*
			} // needed, otherwise catchments are 
vertically squashed
                );

Your layer should support this type of projection server-side for this 
to work.

The singleTile problem comes most likely from a projection issue.

Good luck,
Adrian

Peter Becker wrote:
> Hello all,
>
> I'm trying to let the user select polygons on a map and started creating some 
> JavaScript based on http://openlayers.org/dev/examples/getfeature-wfs.html
>
> 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", "http://localhost:8080/geoserver/wms",
>                     {
>                         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
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
>
>   


-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20090714/766910c7/attachment.html


More information about the Users mailing list