<br>I have some functionality where the user clicks on some shapes displayed through WFS. The click then<br>propogates to the server and it sends back info to the client on how to makes those shapes appear as highlighted <br>
by simply displaying them in a different set of layers. These layers have been styled with blue, red, or green colors. I worked out this from some examples, but the question is if there was a better way to do this. For one thing, do I need a background layer to style an object or can that object style itself ? <br>
<br> The functions below are in the init() function and when the data comes back from the server it will get passed to highlight_tiles() farther below. I did not have much luck styling the WFS object either as I wanted to see if I could get it to display some other color besides the default yellow. I didn't put the WFS code in here to see however .. <br>
<br><br><br>//--------------------------------------<br> <br> function get_style(color,opacity,sel_color)<br> {<br> if (sel_color == null){<br> sel_color = "#0000FF";<br> }<br>
<br> var sty = new OpenLayers.StyleMap({<br> 'default' : new OpenLayers.Style({<br> fillColor: color<br> ,fillOpacity: opacity<br> ,pointRadius: 4<br>
,strokeColor: color<br> ,strokeWidth: 2<br> })<br> ,'select': new OpenLayers.Style({<br> fillColor: sel_color<br> ,fillOpacity: 0.4<br>
,strokeColor: sel_color<br> })});<br> return(sty);<br> }<br><br><br><br><br> sel_vectors = new Array();<br><br> var sel_vecstyles = new Array();<br> vec_colors = ['BLUE','GREEN','RED'];<br>
<br> for (var i = 0; i < vec_colors.length; i++) <br> {<br> var vstyle = get_style(vec_colors[i],1.0);<br><br> var vec = new OpenLayers.Layer.Vector(vec_colors[i] + " Vector",<br>
{<br> styleMap: vstyle<br> }<br> );<br> sel_vectors[i] = vec;<br> map.addLayer(sel_vectors[i]);<br><br> }<br><br><br><br>// ----------------------------------<br>
<br><br><br><br><br> function highlight_tiles(geo_ar)<br> {<br> for (var i=0;i<geo_ar.length;i++)<br> {<br> geo = geo_ar[i];<br> var pointList = geo.poly;<br> vec_idx = i % sel_vectors.length;<br>
// alert(vec_idx.toString());<br> addTile(pointList, <a href="http://geo.id">geo.id</a>,'object',sel_vectors[vec_idx]);<br> }<br> }<br><br><br> // typ is the type of each element of pointList, either array<br>
// or object.<br><br> function addTile(pointList, id, typ, vec)<br> {<br> var plist = [];<br> for(i = 0; i < pointList.length; i++) {<br> var pnt = pointList[i];<br>
// alert(pnt);<br> <br> var gpnt;<br> if (typ == 'array')<br> {<br> gpnt = new OpenLayers.Geometry.Point(pnt[0],pnt[1]);<br> }<br>
else<br> {<br> if (i == 0) {<br> // alert(pnt.lon);<br> }<br> gpnt = new OpenLayers.Geometry.Point(pnt.lon,pnt.lat);<br> }<br>
plist.push(gpnt);<br> }<br> var linearRing = new OpenLayers.Geometry.LinearRing(plist);<br><br><br><br> var polygonFeature = new OpenLayers.Feature.Vector(<br> new OpenLayers.Geometry.Polygon([linearRing]),<br>
{id: id});<br> vec.addFeatures([polygonFeature]);<br> }<br><br><br>