<div dir="ltr">Hi everybody,<div><br></div><div style>For my research project, I try to develop a web map application but I'm a great beginner in web development.</div><div style>My web app has to change the style of the layers according to selected radio button.</div>
<div style>I have written these two files. The first is my page in php :</div><div style><div>--------------------------------------------------------------------------------</div><div><?php<br></div><div><span class="" style="white-space:pre"> </span>session_start();</div>
<div><span class="" style="white-space:pre"> </span>$_SESSION["login"]="bob";</div><div>?></div><div><!DOCTYPE html></div><div><html></div><div><span class="" style="white-space:pre"> </span><head></div>
<div><span class="" style="white-space:pre"> </span><meta http-equiv="content-type" content="text/html; charset=utf-8"/></div><div><span class="" style="white-space:pre"> </span><title>IMaDeS bis</title></div>
<div><span class="" style="white-space:pre"> </span><script type="text/javascript" src="IMaDeS/OpenLayers/lib/OpenLayers.js"></script></div><div><span class="" style="white-space:pre"> </span><link rel="stylesheet" href="test.css" type="text/css"></div>
<div><span class="" style="white-space:pre"> </span></head></div><div><span class="" style="white-space:pre"> </span><body onload="init()"></div><div><span class="" style="white-space:pre"> </span><form name="formulaire" method="post" action="test_carte.php"></div>
<div><span class="" style="white-space:pre"> </span><div id="bloc"></div><div><span class="" style="white-space:pre"> </span><div id="bloc_alea"></div><div><span class="" style="white-space:pre"> </span>Bonjour <?php echo $_SESSION["login"]; ?></div>
<div><span class="" style="white-space:pre"> </span><div id="couche_alea"></div><div><span class="" style="white-space:pre"> </span><input type="radio" name="alea" value="alea_value_green" id="alea_id_green" checked="checked" onchange="init(alea);" />green</div>
<div><span class="" style="white-space:pre"> </span><input type="radio" name="alea" value="alea_value_blue" id="alea_id_blue" onchange="init(alea);" />blue</div>
<div><span class="" style="white-space:pre"> </span></div></div><div><span class="" style="white-space:pre"> </span></div></div><div><span class="" style="white-space:pre"> </span></div></div><div>
<span class="" style="white-space:pre"> </span><div id="mapdiv" ></div><div><span class="" style="white-space:pre"> </span><script type='text/javascript' src='IMaDeS/carte.js'></script></div>
<div><span class="" style="white-space:pre"> </span></div></div><div><span class="" style="white-space:pre"> </span></form></div><div><span class="" style="white-space:pre"> </span></body></div><div></html></div>
<div>--------------------------------------------------</div><div style>the second is my script in js to display and to modify my map :</div><div style>--------------------------------------------------</div><div style><div>
function init() {</div><div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Choix des éléments de contrôle à afficher</div><div><span class="" style="white-space:pre"> </span>var navigation_control = new OpenLayers.Control.Navigation({});</div>
<div><span class="" style="white-space:pre"> </span>var controls_array = [</div><div><span class="" style="white-space:pre"> </span>navigation_control,<span class="" style="white-space:pre"> </span>//ne pas commenter</div>
<div><span class="" style="white-space:pre"> </span>new OpenLayers.Control.PanZoomBar({}),</div><div><span class="" style="white-space:pre"> </span>new OpenLayers.Control.MousePosition({}),</div><div><span class="" style="white-space:pre"> </span>];</div>
<div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Construction de la carte</div><div><span class="" style="white-space:pre"> </span>var map = new OpenLayers.Map("mapdiv", {controls: controls_array});</div>
<div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Définition des styles</div><div><span class="" style="white-space:pre"> </span>if (document.getElementById("alea_id_non").checked) {</div>
<div><span class="" style="white-space:pre"> </span>var style = new OpenLayers.Style({</div><div><span class="" style="white-space:pre"> </span>fillColor : "green",</div><div><span class="" style="white-space:pre"> </span>fillOpacity : 0.5,</div>
<div><span class="" style="white-space:pre"> </span>strokeColor : "green",</div><div><span class="" style="white-space:pre"> </span>strokeWidth: 0,</div><div><span class="" style="white-space:pre"> </span>});</div>
<div><span class="" style="white-space:pre"> </span>}</div><div><span class="" style="white-space:pre"> </span>if (document.getElementById("alea_id_oui").checked) {</div><div><span class="" style="white-space:pre"> </span>var style = new OpenLayers.Style({</div>
<div><span class="" style="white-space:pre"> </span>fillColor : "blue",</div><div><span class="" style="white-space:pre"> </span>fillOpacity : 0.5,</div><div><span class="" style="white-space:pre"> </span>strokeColor : "blue",</div>
<div><span class="" style="white-space:pre"> </span>strokeWidth: 0,</div><div><span class="" style="white-space:pre"> </span>});</div><div><span class="" style="white-space:pre"> </span>}</div><div><span class="" style="white-space:pre"> </span>var map_style = new OpenLayers.StyleMap({"default":style});</div>
<div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Construction des BaseLayers</div><div><span class="" style="white-space:pre"> </span>var osm = new OpenLayers.Layer.OSM();</div>
<div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Construction des Layers</div><div><span class="" style="white-space:pre"> </span>var alea = new OpenLayers.Layer.Vector("alea", {</div>
<div><span class="" style="white-space:pre"> </span>styleMap: map_style,</div><div><span class="" style="white-space:pre"> </span>protocol: new OpenLayers.Protocol.HTTP({</div><div><span class="" style="white-space:pre"> </span>url: "IMaDeS/data/alea_37/alea_37_wgs84.gml",</div>
<div><span class="" style="white-space:pre"> </span>format: new OpenLayers.Format.GML(),</div><div><span class="" style="white-space:pre"> </span>}),</div><div><span class="" style="white-space:pre"> </span>strategies: [new OpenLayers.Strategy.Fixed()]</div>
<div><span class="" style="white-space:pre"> </span>});</div><div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Affichage des BaseLayers et des Layers</div><div>
<span class="" style="white-space:pre"> </span>map.addLayers([osm, alea]);</div><div><span class="" style="white-space:pre"> </span></div><div><span class="" style="white-space:pre"> </span>//Options d'affichage</div>
<div><span class="" style="white-space:pre"> </span>map.setCenter(new OpenLayers.LonLat(65400, 6002141),10);</div><div>}</div><div><br></div><div>function changeByButtonRadio(layerToRedraw) {</div><div><span class="" style="white-space:pre"> </span>layerToRedraw.redraw();</div>
<div>}</div><div>----------------------------------------------------------</div><div style>I think it lacks something in my js, probably in the function changeByButtonRadio() but I don't know what.</div><div style><br>
</div><div style>Thank you for your help.</div></div></div></div>