0

Wish I could change the layers according to a certain selection criterion.

For this I made a select that acts an onchange event that normally should change what is seen on the map ....

But unfortunately this does not happen :(

Please help, I am very new to these things ....

Here is what I've done so far:

$( document ).ready(function() {
          $("#id_primarie").change(function(){
               console.log('test');
               
               var id_primarie = $('#id_primarie').val();
               
                var teren = new ol.layer.Tile({
                    source: new ol.source.TileWMS({
                              url:'http://127.0.0.1:10000/geoserver/ADMINISTRATIE/wms',
                              params: {'LAYERS': 'ADMINISTRATIE:teren', 
                                       'STYLES':'TEREN', 
                                       tiled:true, 
                                       transparent: true, 
                                       viewparams: 'id_primarie:'+id_primarie },
                              format: new ol.format.GeoJSON(),
                              ratio: 1,
                              serverType:'geoserver'
                    })
                });
                
                map.addLayer(teren);
               
          })
      });
  

Use: OpenLayers: 6.4.3 Geoserver 2.15.1

UPDATE:

cod:

$( document ).ready(function() {
          $("#id_primarie").change(function(){
               console.log('test');
               
               var id_primarie = $('#id_primarie').val();
               
               
                var map = new ol.Map({
                  target: 'map',
                  layers: [
                    new ol.layer.Tile({
                      source: new ol.source.OSM()
                    }),
                    new ol.layer.Tile({
                          source: new ol.source.XYZ({
                                  attributions: ['Powered by Esri', 'Source: Esri, DigitalGlobe, GeoEye, Earthstar Geographics, CNES/Airbus DS, USDA, USGS, AeroGRID, IGN, and the GIS User Community'],
                                  attributionsCollapsible: true,
                                  url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
                                  maxZoom: 16
                          })
                      }),
                  ],
          
                  view: new ol.View({
                    center: [469713.24, 505416.01],
                    zoom: 35
                  })
                });
                
                proj4.defs('EPSG:31700','+proj=sterea +lat_0=46 +lon_0=25 +k=0.99975 +x_0=500000 +y_0=500000 +ellps=krass +towgs84=28,-121,-77,0,0,0,0 +units=m +no_defs');                      
                ol.proj.proj4.register(proj4);
      
               
               
                var teren = new ol.layer.Tile({
                    source: new ol.source.TileWMS({
                              url:'http://127.0.0.1:10000/geoserver/ADMINISTRATIE/wms',
                              params: {'LAYERS': 'ADMINISTRATIE:teren', 
                                       'STYLES':'TEREN', 
                                       tiled:true, 
                                       transparent: true, 
                                       viewparams: 'id_primarie:'+id_primarie },
                              format: new ol.format.GeoJSON(),
                              ratio: 1,
                              serverType:'geoserver'
                    })
                });
                
                
                map.addLayer(teren);
               
          })
      });

Now he does what he needs only because the problem is that he puts the same map with different layers twice :(

2
  • Can you clarify if you are trying to remove one layer and add a different layer, or are you trying to change what records are displayed in a lyer. With wms and Geoserver, you can change what records are displayed with a CQL filter. See here: docs.geoserver.org/stable/en/user/tutorials/cql/…. If you want to actually remove a layer and add a different layer, use ol remove layer. Here is one of many stack exchange posts discussing how to remove a wms layer: stackoverflow.com/questions/30838856/… – jgm_GIS Oct 13 '20 at 19:49
  • I try to erase one layer and put another layer in its place. – CoderCoder42 Oct 14 '20 at 6:17
3

In your first example teren should be global so you can remove the old layer before adding a new one

$( document ).ready(function() {
          var teren;

          $("#id_primarie").change(function(){
               console.log('test');
               
               map.removeLayer(teren);
               var id_primarie = $('#id_primarie').val();
               
                teren = new ol.layer.Tile({
                    source: new ol.source.TileWMS({
                              url:'http://127.0.0.1:10000/geoserver/ADMINISTRATIE/wms',
                              params: {'LAYERS': 'ADMINISTRATIE:teren', 
                                       'STYLES':'TEREN', 
                                       tiled:true, 
                                       transparent: true, 
                                       viewparams: 'id_primarie:'+id_primarie },
                              ratio: 1,
                              serverType:'geoserver'
                    })
                });
                
                map.addLayer(teren);
               
          })
      });

But it would be better to keep the same layer and update it by calling updateParams

$( document ).ready(function() {
          var teren = new ol.layer.Tile({
                    source: new ol.source.TileWMS({
                              url:'http://127.0.0.1:10000/geoserver/ADMINISTRATIE/wms',
                              params: {'LAYERS': 'ADMINISTRATIE:teren', 
                                       'STYLES':'TEREN', 
                                       tiled:true, 
                                       transparent: true, 
                                       viewparams: 'id_primarie:'+ $('#id_primarie').val() },
                              ratio: 1,
                              serverType:'geoserver'
                    })
                });
                
          map.addLayer(teren);

          $("#id_primarie").change(function(){
               teren.getSource().updateParams({
                   viewparams: 'id_primarie:'+ $('#id_primarie').val()
               });
          })
      });
1
  • thank you very much ! Can you help me to center after selection on geometries automatically when I make the selection? – CoderCoder42 Oct 14 '20 at 9:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.