我非常非常新手网页映射。我有一个从PostGis数据库中的形状文件制作的OpenLayers地图,有一个矢量图层和默认样式(GeoServer SLD),但我想在用户单击刷新按钮时更改矢量图层的样式。我在网上搜索了一下,没有找到简单明了的例子。请有人帮助我,或者可能有人想要做同样的事情并找到了简单的教程?非常感谢任何帮助。
<script type="text/javascript">
var map;
function init() {
var bounds = new OpenLayers.Bounds(
68.089442, 6.752729,
97.407576, 37.072537);
var options = {
controls: [ new OpenLayers.Control.Navigation(),
new OpenLayers.Control.PanZoom()
],
maxExtent: bounds,
maxResolution: 0.11843675,
projection: "EPSG:4326",
units: 'degrees'
};
map = new OpenLayers.Map ("map", options );
var india = new OpenLayers.Layer.WMS(
"cite:india_state - Tiled",
"http://localhost:8080/geoserver/cite/wms",
{LAYERS: 'cite:india_state',STYLES: 'style',
//format: format,
tiled: true,
tilesOrigin: map.maxExtent.left + ',' + map.maxExtent.bottom
},
{buffer: 0, displayOutsideMaxExtent: true,
isBaseLayer: true,
yx: {'EPSG:4326' : true}
}
);
var style = new OpenLayers.Style();
//rule used for all polygons
var rule_fsa = new OpenLayers.Rule({
symbolizer: {
fillColor: "#ff9a9a",
fillOpacity: 0.5,
strokeColor: "#000000",
strokeWidth: 1,
strokeDashstyle: "dash",
label: "${name}",
labelAlign: "cc",
fontColor: "#333333",
fontOpacity: 0.9,
fontFamily: "Arial",
fontSize: 14
}
});
var rule_highlight = new OpenLayers.Rule({
filter: new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.Comparison.EQUAL_TO,
property: "classification",
value: "1",
}),
symbolizer: {
fillColor: "#FF7144",
fillOpacity: 0.6,
strokeColor: "#FF0000",
strokeWidth: 2,
strokeDashstyle: "solid",
label: " ${name}",
labelAlign: "cc",
fontColor: "#000000",
fontOpacity: 1,
fontFamily: "Arial",
fontSize: 16,
fontWeight: "600"
}
});
style.addRules([rule_fsa, rule_highlight]);
var polygon = new OpenLayers.Layer.Vector("Polygon", {
Style: 'style',
rendererOptions: {zIndexing: true}
});
map.addLayers([india,polygon]);
map.zoomToMaxExtent();
}
</script>