How to show one layer map with many style

Question

I want to show a layer map with many style depending on some attribute in the layer, but don't know how,. If I use SLD in geoserver I just show only one style, I have tried writing something in javascript (based on Openlayer library) like below, but it didn't work, the code didn't have any effect to the layer map. Any suggestion will be greatly appreciated.


    //create a style object
    var style = new OpenLayers.Style();
    //rule used for all polygons

    var rule_p1 = new OpenLayers.Rule({
        filter: new OpenLayers.Filter.Comparison({
        type: OpenLayers.Filter.Comparison.EQUAL_TO,
        property: "vi_tri",
        value: "1",
        }),
        symbolizer: {
        fillColor: "#00FF00",
        fillOpacity: 0.6,
        strokeColor: "#FF0000",
        strokeWidth: 2,
        strokeDashstyle: "solid",
        }
    });
    var rule_p2 = new OpenLayers.Rule({
        filter: new OpenLayers.Filter.Comparison({
        type: OpenLayers.Filter.Comparison.EQUAL_TO,
        property: "vi_tri",
        value: "2",
        }),
        symbolizer: {
        fillColor: "#40FF00",
        fillOpacity: 0.6,
        strokeColor: "#FF0000",
        strokeWidth: 2,
        strokeDashstyle: "solid",
        }
    });
    var rule_p3 = new OpenLayers.Rule({
        filter: new OpenLayers.Filter.Comparison({
        type: OpenLayers.Filter.Comparison.EQUAL_TO,
        property: "vi_tri",
        value: "3",
        }),
        symbolizer: {
        fillColor: "#80FF00",
        fillOpacity: 0.6,
        strokeColor: "#FF0000",
        strokeWidth: 2,
        strokeDashstyle: "solid",
        }
    });
    var rule_p4 = new OpenLayers.Rule({
        filter: new OpenLayers.Filter.Comparison({
        type: OpenLayers.Filter.Comparison.EQUAL_TO,
        property: "vi_tri",
        value: "4",
        }),
        symbolizer: {
        fillColor: "#FFFF00",
        fillOpacity: 0.6,
        strokeColor: "#FF0000",
        strokeWidth: 2,
        strokeDashstyle: "solid",
        }
    });
    style.addRules([rule_p1, rule_p2, rule_p3, rule_p4]);
    mybinh = new OpenLayers.Layer.WMS(
            "Lớp Mỹ Bình", urlmapfile,
            {
            LAYERS: 'demo:mybinh',
            transparent:"true",
            format: format,
            styleMap: style
            },
            {singleTile: true, ratio: 1, isBaseLayer: false} 
    );

mounty0722 mounty0722 · Accepted Answer · 2014-11-06T16:19:48

From your code snippet I assume that you want to serve a WMS Layer provided by the GeoServer. In this case you receive an image file rendered by the server and the styling is part of the Geoserver (SLD). On client side (OpenLayers) you are only able to style Vector features.

You can define different Styles (SLD) for your layer and switch between the styles by changing the WMS query parameter (see http://docs.geoserver.org/latest/en/user/services/wms/reference.html ).

How to show one layer map with many style

1 Answers