AW: [OpenLayers-Users] WMS polygon fill color

Arnd Wippermann arnd.wippermann at web.de
Tue May 17 16:14:31 EDT 2011


Hi,
 
SLD is good way to style a WMS layer from clientside.
There are two options SLD_BODY and SLD.
 
//lyrWMS = new OpenLayers.Layer.WMS(title, url, params, options);
 
lyrWMS = new OpenLayers.Layer.WMS("Title",
    url, 
    {   //WMS parameters
        'layers': 'one,two,three',
        'transparent': true,
        'format': 'image/png',
        //sld_body : sends the sld as part of the url to the server
        'sld_body': sld
        //sld : sends the url of a SLD file to the server
        //'sld': urltosldfile
    },
    {   //options
        isBaseLayer: false
    }
);
 
you can set the parameter at layer creation and can set or change it later
by mergeNewParams.
 
WMS parameter SLD_BODY:
lyrWMS.mergeNewParams({ SLD_BODY : '<?xml version="1.0"
encoding="utf-8"?><StyledLayerDescriptor
version="1.0.0"><NamedLayer><Name>GEM_NRW</Name><UserStyle><Name>Default</Na
me><Title>line</Title><FeatureTypeStyle><Rule><LineSymbolizer><Stroke><CssPa
rameter
name="stroke">#ff0000</CssParameter></Stroke></LineSymbolizer></Rule></Featu
reTypeStyle></UserStyle></NamedLayer></StyledLayerDescriptor>' });
 
or
 
WMS parameter SLD:
lyrWMS.mergeNewParams({ "SLD" : "http://server/file.sld" });
 
OpenLayers example (it' also valid for WMS layers):
http://dev.openlayers.org/releases/OpenLayers-2.10/examples/WMSPost.html
 
some own examples:
http://gis.ibbeck.de/OLClient/examples/wms_sld_world.asp
http://gis.ibbeck.de/ginfo/apps/OLExamples/OL210/MapServer_SLD_Demo/MapServe
r_SLD_Demo.asp
http://gis.ibbeck.de/ginfo/apps/OLExamples/OL210/MapServer_SLD_World/MapServ
er_SLD_World.asp?SLDsrcIdx=16
 
Arnd


  _____  

Von: openlayers-users-bounces at lists.osgeo.org
[mailto:openlayers-users-bounces at lists.osgeo.org] Im Auftrag von IvanBell
Gesendet: Dienstag, 17. Mai 2011 20:38
An: users at openlayers.org
Betreff: [OpenLayers-Users] WMS polygon fill color



What is the best strategy for coloring a polygon in a map? I am using WMS
and my map contains polygon layer(s) in which I wish to change the colors
based upon some dynamic information.

The map is a floor plan consisting of several layers (a campus, building,
section, room, and detail polygon layer on top of a vectored image drawing
of the campus/building). I have found that by creating a Polygon feature in
a vector overlay, I can achieve my goal. However, I ran into a problem with
using Internet Explorer 8. It seems that IE does not support SVG, only VML,
and that VML starts to creep when adding too many features to a map. "Too
many" [for me] appears to be 40. Firefox and Chrome load the map
instantaneously; but IE takes 45 seconds for just 40 polygon features. This
number is but a fraction of what I need to add; so, I really need help to
solve this.


            coloredPolygonLayer = new OpenLayers.Layer.WMS(

               "Colored Polygon Layer",

               {

                  displayInLayerSwitcher: false,

                  isBaseLayer: false

               }

            );



            var red = {

                strokeColor: "#800000",

                strokeOpacity: 1,

                strokeWidth: 2,

                fillColor: "#FF0000",

                fillOpacity: 0.7

            };

            var blue = {

                strokeColor: "#000080",

                strokeOpacity: 1,

                strokeWidth: 2,

                fillColor: "#0000FF",

                fillOpacity: 0.7

            };



            //

            // Fill the red polygons.

            //

            var polygonGeometries = [];

            polygonGeometries.push( "660.9979763,-450.06682014
663.68078041,-446.75461388 683.77661324,-447.03618622
683.85334587,-485.23556328 682.4714489,-493.15101433
675.89935875,-494.919487 664.72382164,-485 661.58379173,-484.58379173
660.93322945,-452.20343971 660.9979763,-450.06682014" );

            polygonGeometries.push( "703.94480705,-446.4528904
703.97554207,-448.92936516 703.62247276,-484.80152512
700.20403099,-486.69899178 699.01870537,-494.97194099
691.6276722,-491.50213814 682.07145119,-481.42777443
681.64668465,-447.09778786 703.94480705,-446.4528904" );

            ...

            fillPolygons( coloredPolygonLayer, polygonGeometries, red );





            //

            // Fill the blue polygons.

            //

            polygonGeometries = [];

            polygonGeometries.push( "724.09494972,-372 726.3353672,-372
741.87992287,-371.93996048 744.00000191,-394.06738853 736.00000191,-406
725.00000191,-419 722.08182335,-414.23610878 724.09494972,-372" );

            polygonGeometries.push( "745.35787392,-371.64212608
767.78647041,-371.10543823 765.72203255,-409.48135376
757.43100548,-417.14139557 748.8010273,-417.10012817
745.41958427,-411.84170532 752.00000191,-406.38969803
742.34921837,-396.52966118 744.00000191,-373.90360832
745.35787392,-371.64212608" );

            ...

            fillPolygons( coloredPolygonLayer, polygonGeometries, blue );







            ...







         function fillPolygons( layer, polygonGeometries, style ) {

            //

            // Parse geometries to get the specified polygons.
Specifically,

            // parse the points of the polygon and add them to the linear
ring

            // array.  The linear ring defines the boundary of each polygon.

            //

            // This parsing is only necessary since store the polygon
geometries

            // in the same format as sent from the map server (i.e., a

            // space-delimited string of point sets, each set being

            // comma-delimited.

            //

            var linearRings = [];

            var polygonPoints = null;

            var polygonPoints = null;

            var nextPoint = null;



            for ( var i = 0; i < polygonGeometries.length; i++ ) {

               polygonPoints = polygonGeometries[ i ].split( ' ' );



               polygonPoints = [];

               nextPoint = null;



               for ( var j = 0; j < polygonPoints.length; j++ ) {

                  nextPoint = polygonPoints[ j ].split( ',' );

                  polygonPoints.push( new OpenLayers.Geometry.Point(
nextPoint[ 0 ], nextPoint[ 1 ] ) );

               }



               linearRings.push( new OpenLayers.Geometry.LinearRing(
polygonPoints ) );

            }



            //

            // Fill selected polygons.

            //

            for ( var i = 0; i < linearRings.length; i++ ) {

               layer.addFeatures( [ new OpenLayers.Feature.Vector(
linearRings[ i ], null, style ) ] );

            }

         }

I am a newbie to OpenLayers and, for the most part, I have been able to
solve most every problem that I have (e.g., highlight polygon, select
polygon, drag marker, styles, etc.). This one has me stumped.

The polygons that I am coloring have significance only at the time the map
is loaded. I.e., their color represents various things in various contexts
(e.g., volume or assignments or ...). I do not need to hover, select,
hyperlink, or otherwise reference the polygon in any way. So, adding it as a
feature to the vector layer is not necessary [for me]. All I really need is
to color each of them one time when the map is loaded.

Can anyone tell me the best approach for this? I have seen a lot of "hints"
at how to accomplish this; but no solutions yet. E.g., I have seen SLD; but,
like with the technology, don't know a lot about this. It looks like I have
to create a file to be posted to the map server. I really need this to be
dynamic, as the context/colors may change between page loads.

Any help is greatly appreciated, especially code examples.

Sincerely,

Ivan


  _____  

View this message in context: WMS
<http://osgeo-org.1803224.n2.nabble.com/WMS-polygon-fill-color-tp6374589p637
4589.html> polygon fill color
Sent from the OpenLayers
<http://osgeo-org.1803224.n2.nabble.com/OpenLayers-Users-f1822463.html>
Users mailing list archive at Nabble.com.

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


More information about the Users mailing list