[OpenLayers-Users] Update-Option for Map by clicking

Rüdisüli Bruno rubruno at student.ethz.ch
Fri May 13 03:54:31 EDT 2011 

Hi List,

the page i speak about is the foloowing: http://ows.ethz.ch/gis_ex/www/rubruno_ba_www/index.html. Please notice that there's just a Layer for "Friedhof" and "irgendwo" available yet.
Because of a lof of Layers the Layer-Switcher was too small and I made "my own Switcher" by HTML. Now everytime i click a Layer there will be load a new Map more...logical cause of the code till now...does anybody know an easy way to "update" the first map? By an openlayers-function? Or HTML/javascript?

Thanks a lot for answers.

Code below:

sprachatlas.js

function start() {
    Standardwort = "Limes2";
    init(Standardwort);

}


function init(Standardwort) {

// immer über http://ows.ethz.ch/gis_ex/www/rubruno_ba_www/index.html öffnen!!!


var MyMap = new OpenLayers.Map({
    div: "map",
    projection: new OpenLayers.Projection("EPSG:31468"),
    units: "m",
    maxResolution: 'auto',
    maxExtent: new OpenLayers.Bounds(
      4435000, 5406000, 4483000, 5452000
    )
  });

 var untersuchungsgebiet = new OpenLayers.Layer.WMS(
    "Untersuchungsgebiet",
    "http://ows.ethz.ch/gis_ex/wms?",
    {
      layers: "Gemeinden_clip",
      transparent: "true",
      format: "image/png"
    },
    {isBaseLayer: true, visibility: true, singleTile: true, ratio: 1}
  );

    var vegetation = new OpenLayers.Layer.WMS(
    "Vegetation",
    "http://ows.ethz.ch/gis_ex/wms?",
    {
      layers: "vegetation_f_Intersect",
      transparent: "true",
      format: "image/png"
    },
    {isBaseLayer: false, visibility: true, singleTile: true, ratio: 1}
  );

var gewaesser = new OpenLayers.Layer.WMS(
    "Gewässer",
    "http://ows.ethz.ch/gis_ex/wms?",
    {
      layers: "Gewaesser_clip1",
      transparent: "true",
      format: "image/png"
    },
    {isBaseLayer: false, visibility: true, singleTile: true, ratio: 1}
  );

var limes = new OpenLayers.Layer.WMS(
    "Limes",
    "http://ows.ethz.ch/gis_ex/wms?",
    {
      layers: "Limes",
      transparent: "true",
      format: "image/png"
    },
    {isBaseLayer: false, visibility: true, singleTile: true, ratio: 1}
  );


    var gemeinden = new OpenLayers.Layer.WMS(
    "Gemeinden",
    "http://ows.ethz.ch/gis_ex/wms?",
    {
      layers: "Gemeinden",
      transparent: "true",
      format: "image/png"
    },
    {isBaseLayer: false, visibility: true, singleTile: true, ratio: 1}
  );



  //var irgendwo = new OpenLayers.Layer.WMS(
    //"irgendwo",
    //"http://ows.ethz.ch/gis_ex/wms?",
    //{
     // layers: "irgendwo2",
     // transparent: "true",
     // format: "image/png"
    //},
    //{isBaseLayer: false, visibility: true, singleTile: true, ratio: 2}
  //);

var auswahl = new OpenLayers.Layer.WMS(
    Standardwort,
    "http://ows.ethz.ch/gis_ex/wms?",
    {
      layers: Standardwort,
      transparent: "true",
      format: "image/png"
   },
    {isBaseLayer: false, visibility: true, singleTile: true, ratio: 1}
  );

  layers = new Array(untersuchungsgebiet, vegetation,  gewaesser, limes, gemeinden, auswahl) //Reihenfolge entscheidet Ebene der Darstellung
  MyMap.addLayers(layers);



  info = new OpenLayers.Control.WMSGetFeatureInfo({
            url: "http://ows.ethz.ch/gis_ex/wms?",
            title: "Identify features by clicking",
            layers: [auswahl],
            queryVisible: true,
            eventListeners: {
                getfeatureinfo: function(event) {
                    MyMap.addPopup(new OpenLayers.Popup.FramedCloud(
                        "test",
                        MyMap.getLonLatFromPixel(event.xy),
                        null,
                        event.text,
                        null,
                        true
                    ))
                    ;
                }
            }
        });



MyMap.setCenter(new OpenLayers.LonLat(7.55, 46.45), 0);
var map = new OpenLayers.Map('MyMap', { controls: [] });
MyMap.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':true}));
//map.addControl(new OpenLayers.Control.LayerSwitcher({'div':OpenLayers.Util.getElement('Switcher')}));
var scaleLine = new OpenLayers.Control.ScaleLine({maxWidth: 150, topOutUnits: "km", topInUnits: "m", bottomOutUnits: false, bottomInUnits: false});
MyMap.addControl(scaleLine);
MyMap.addControl(new OpenLayers.Control.KeyboardDefaults());
BlockDoubleClickZoom = new OpenLayers.Control.Navigation({ defaultDblClick: function(event) { return; } });
MyMap.addControl(BlockDoubleClickZoom);
MyMap.addControl(info);
info.activate();
MyMap.zoomToMaxExtent();


}

index.html

<!DOCTYPE html>
<html>
<head>
  <title>Web-basierter Sprachatlas</title>
  <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
  <script src="./Sprachatlas.js" type="text/javascript"></script>

</head>
<body onLoad="start()">
<strong>Web-basierter Sprachatlas - Bachelorarbeit FS 2011</strong><br>


<div id="Menustruktur"> </div>
<table width="222" height="90" border="0">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>
    <form action="select.htm" name="Form1">
      <p>W&auml;hlen Sie das gew&uuml;nschte Standardwort:</p>
      <p>
        <select name="Standardwort" size="25" style="width:35ex;" onclick="init(this.form.Standardwort.options[this.form.Standardwort.selectedIndex].value)">
          <optgroup label="Jahreszeiten">
            <option value="    Frühling">    Fr&uuml;hling </option>
            <option value="    Sommer    ">    Sommer    </option>
            <option value="    Herbst    ">    Herbst    </option>
            <option value="    Winter    ">    Winter    </option>
          </optgroup>
          <optgroup label="Wochentage">
            <option value="    Montag    ">    Montag    </option>
<option value="    Dienstag    ">    Dienstag    </option>
<option value="    Mittwoch    ">    Mittwoch    </option>
<option value="    Donnerstag    ">    Donnerstag    </option>
<option value="    Freitag    ">    Freitag    </option>
<option value="    Samstag    ">    Samstag    </option>
<option value="    Sonntag    ">    Sonntag    </option>
          </optgroup>
          <optgroup label="Zeitangaben">
            <option value="    voriges Jahr    ">    voriges Jahr    </option>
<option value="    dieses Jahr    ">    dieses Jahr    </option>
<option value="    heute    ">    heute    </option>
<option value="    gestern    ">    gestern    </option>
<option value="    13.45 Uhr    ">    13.45 Uhr    </option>
<option value="    9.15 Uhr    ">    9.15 Uhr    </option>
          </optgroup>
          <optgroup label="Ortsangaben">
<option value="    Friedhof    ">    Friedhof    </option>
<option value="    irgendwo    ">    irgendwo    </option>
<option value="    Wegbiegung    ">    Wegbiegung    </option>
          </optgroup>
          <optgroup label="Familie">
          <option value="    Großmutter    ">    Gro&szlig;mutter    </option>
<option value="    Taufpate    ">    Taufpate    </option>
<option value="    Taufpatin    ">    Taufpatin    </option>
<option value="    Mädchen    ">    M&auml;dchen    </option>
<option value="    Junge    ">    Junge    </option>
          </optgroup>
          <optgroup label="Verbern">
          <option value="    Knarren von neuen Schuhen    ">    Knarren von neuen Schuhen    </option>
<option value="    Mit Schuhen auf dem Eis gleiten     ">    Mit Schuhen auf dem Eis gleiten     </option>
<option value="    hüpfen    ">    h&uuml;pfen    </option>
<option value="    niesen    ">    niesen    </option>
<option value="    herumkramen    ">    herumkramen    </option>
          </optgroup>
          <optgroup label="Spiele">
          <option value="    Fangen spielen    ">    Fangen spielen    </option>
<option value="    Verstecken spielen    ">    Verstecken spielen    </option>
<option value="    Hängeschaukel    ">    H&auml;ngeschaukel    </option>
<option value="    Puppe    ">    Puppe    </option>
          </optgroup>
          <optgroup label="K&ouml;rper/Mensch">
          <option value="    Schluckauf    ">    Schluckauf    </option>
<option value="    Sommersprossen    ">    Sommersprossen    </option>
<option value="    Gänsehaut     ">    G&auml;nsehaut     </option>
<option value="    Beule am Kopf    ">    Beule am Kopf    </option>
<option value="    Schorf    ">    Schorf    </option>
<option value="    Narbe    ">    Narbe    </option>
<option value="    Gesäß    ">    Ges&auml;&szlig;    </option>
          </optgroup>
          <optgroup label="Essen/Nahrung">
          <option value="    Quark    ">    Quark    </option>
<option value="    Sahne    ">    Sahne    </option>
<option value="    Brotanschnitt    ">    Brotanschnitt    </option>
<option value="    Brötchen     ">    Br&ouml;tchen     </option>
<option value="    Zuckerbonbon     ">    Zuckerbonbon     </option>
<option value="    Frühstück    ">    Fr&uuml;hst&uuml;ck    </option>
<option value="    Abendbrot    ">    Abendbrot    </option>
<option value="    kleines Weihnachtsgebäck     ">    kleines Weihnachtsgeb&auml;ck     </option>
<option value="    Früchtebrot    ">    Fr&uuml;chtebrot    </option>
          </optgroup>
          <optgroup label="Haushalt">
          <option value="    großes Waschgefäß    ">    gro&szlig;es Waschgef&auml;&szlig;    </option>
<option value="    Holzkorb    ">    Holzkorb    </option>
<option value="    Wäscheklammern     ">    W&auml;scheklammern     </option>
<option value="    Spüllappen     ">    Sp&uuml;llappen     </option>
<option value="    Wäsche klarspülen     ">    W&auml;sche klarsp&uuml;len     </option>
<option value="    Verbrannt riechen     ">    Verbrannt riechen     </option>
          </optgroup>
          <optgroup label="Haus">
          <option value="    Rauchabzug     ">    Rauchabzug     </option>
<option value="    Dachrinnne    ">    Dachrinnne    </option>
<option value="    Dachboden    ">    Dachboden    </option>
<option value="    Hauseingang    ">    Hauseingang    </option>
<option value="    Treppe/Stiege    ">    Treppe/Stiege    </option>
          </optgroup>
          <optgroup label="Tiere">
          <option value="    Stechmücke    ">    Stechm&uuml;cke    </option>
<option value="    Rabe    ">    Rabe    </option>
<option value="    Katze    ">    Katze    </option>
<option value="    Kater    ">    Kater    </option>
<option value="    Hahn    ">    Hahn    </option>
<option value="    Küken    ">    K&uuml;ken    </option>
<option value="    Henne/Huhn    ">    Henne/Huhn    </option>
<option value="    Zuchtstier    ">    Zuchtstier    </option>
<option value="    Kuh    ">    Kuh    </option>
<option value="    Kühe    ">    K&uuml;he    </option>
<option value="    Kalb    ">    Kalb    </option>
<option value="    Schwein männl.     ">    Schwein m&auml;nnl.     </option>
<option value="    Schwein weibl.    ">    Schwein weibl.    </option>
<option value="    Ferkel    ">    Ferkel    </option>
<option value="    Pferd    ">    Pferd    </option>
<option value="    Schaf männl.     ">    Schaf m&auml;nnl.     </option>
<option value="    Schaf weibl.     ">    Schaf weibl.     </option>
<option value="    Lamm    ">    Lamm    </option>
          </optgroup>
          <optgroup label="Landwirtschaft">
          <option value="    Getreide    ">    Getreide    </option>
<option value="    Getreideernte    ">    Getreideernte    </option>
<option value="    Heu    ">    Heu    </option>
<option value="    Heu produzieren     ">    Heu produzieren     </option>
          </optgroup><optgroup label="Pflanzen/Fr&uuml;chte">
          <option value="    Tannenzapfen    ">    Tannenzapfen    </option>
<option value="    Kartoffeln    ">    Kartoffeln    </option>
<option value="    Johannisbeeren    ">    Johannisbeeren    </option>
<option value="    Rote Beete    ">    Rote Beete    </option>
<option value="    Erdbeere    ">    Erdbeere    </option>
<option value="    Karotte    ">    Karotte    </option>
          </optgroup>
          <optgroup label="Lokaladverbien">
          <option value="    herinnen    ">    herinnen    </option>
<option value="    drinnen    ">    drinnen    </option>
<option value="    herüben    ">    her&uuml;ben    </option>
<option value="    drüben    ">    dr&uuml;ben    </option>
<option value="    diesseits    ">    diesseits    </option>
<option value="    jenseits    ">    jenseits    </option>
          </optgroup>
          <optgroup label="Verben">
          <option value="    gehen    ">    gehen    </option>
<option value="    drehen    ">    drehen    </option>
<option value="    sein    ">    sein    </option>
<option value="    wir le-sen    ">    wir le-sen    </option>
<option value="    käme    ">    k&auml;me    </option>
<option value="    täte    ">    t&auml;te    </option>
<option value="    gewesen    ">    gewesen    </option>
<option value="    geschneit    ">    geschneit    </option>
<option value="    gesagt    ">    gesagt    </option>
          </optgroup>
          <optgroup label="Pronomina">
          <option value="    ihr    ">    ihr    </option>
<option value="    uns    ">    uns    </option>
<option value="    euch    ">    euch    </option>
          </optgroup>
        </select>
      </p>
    </form>


    </td>
    <td><div id="map" style="width: 800px; height: 600px"></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

More information about the Users mailing list