如何使用传单在下拉列表选择中添加wms图层 [英] How to add wms layers in dropdown selection using leaflet

问题描述

我可以在下拉列表选择中从geoserver中选择geojson图层，但我想添加wms图层，就像我选择geojson图层一样。此代码适用于geojson图层...但我想添加wms图层。谢谢你帮忙..



我尝试过：



< pre lang =Javascript> var map，layerControl;

var dropdownlayers = {};
dropdownlayers [ 04] = {
name： Cluster Bahraich，
layer：L.geoJson（），
url： http：// localhost：8080 / geoserver / nird / ows？service = WFS& version = 1.0.0& request = GetFeature& typeName = nird：cluster_bahraich& maxFeatures = 50& outputFormat = application％2Fjson，


};
dropdownlayers [ 4] = {
name： Cluster Bahraich GM，
layer：L.geoJson（），
url： http://127.0.0.1:8080/geoserver/nird/ows?service=WFS&version=1.0.0&request = GetFeature& typeName = nird：Cluster_Bahraich_GM& maxFeatures = 50& outputFormat = application％2Fjson，
style：style

};
function load_layer（dropdownchoice）{
$ .ajax（{
dataType： json，

url：dropdownchoice.url，
成功： function （data）{
var layer = dropdownchoice.layer;
layer.clearLayers（）;
layer .addTo（map）;

$（data.features）.each（ function （key，data）{
layer。 addData（data）;
}）;
function getstates（choice）{
load_layer（dropdownlayers [choice.value]）;
var text = choice.options [choice.selectedIndex] .text
var ddl2 = document .querySelectorAll（ ＃choic e选项）;

for （ var i = 1 ; i< ddl2.length; i ++）{
var option = ddl2 [i];
option.style.display = ' none';
/ * 州* /

if （text == ' Uttar Pradesh'）{
if （[' Bahraich' ] .indexOf（option.text）> -1）
option.style.display = ' block'



}
if （text == ' Jharkhand'）{
if （[' Gumla'，' Hazirabagh'] .indexOf（option.text）> -1）
option.style.display = ' block'
}
}
}

解决方案

.ajax（{
dataType： json，

url：dropdownchoice.url，
成功： function （数据）{
var layer = dropdownchoice.layer;
layer.clearLayers（）;
layer.addTo（map）;

（data.features）.each（ function （key，data） {
layer.addData（data）;
}）;
function getstates（choice）{
load_layer（dropdownlayers [choice.value]）;
var text = choice.options [choice.selectedIndex] .text
var ddl2 = document .querySelectorAll（ ＃choice option< /跨度>）;

for （ var i = 1 ; i< ddl2.length; i ++）{
var option = ddl2 [i];
option.style.display = ' none';
/ * 州* /

if （text == ' Uttar Pradesh'）{
if （[' Bahraich' ] .indexOf（option.text）> -1）
option.style.display = ' block'



}
if （text == ' Jharkhand'）{
if （[' Gumla'，' Hazirabagh'] .indexOf（option.text）> -1）
option.style.display = ' block'
}
}
}

I am able select geojson layers from geoserver in dropdown selection but i want to add wms layers in the same how i am select the geojson layers . This code working for geojson layers...but i want add wms layers . thank you help..

What I have tried:

var map, layerControl;

var dropdownlayers = {};
dropdownlayers["04"] = {
  name: "Cluster Bahraich ",
  layer: L.geoJson(),
  url:"http://localhost:8080/geoserver/nird/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=nird:cluster_bahraich&maxFeatures=50&outputFormat=application%2Fjson",

    
};
dropdownlayers["4"] = {
	name: "Cluster Bahraich GM",
	layer: L.geoJson(),
	url:"http://127.0.0.1:8080/geoserver/nird/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=nird:Cluster_Bahraich_GM&maxFeatures=50&outputFormat=application%2Fjson",
	style:style
    
};
function load_layer(dropdownchoice) {
  $.ajax({
     dataType: "json",
    
	url: dropdownchoice.url,
    success: function(data) {
      var layer = dropdownchoice.layer;
      layer.clearLayers();
      layer.addTo(map);
       
      $(data.features).each(function(key, data) {
        layer.addData(data);
      });
function getstates(choice) {
  load_layer(dropdownlayers[choice.value]);
            var text = choice.options[choice.selectedIndex].text
            var ddl2 = document.querySelectorAll("#choice option");
           
            for (var i = 1; i < ddl2.length; i++) {
                var option = ddl2[i];
                option.style.display = 'none'; 
            /* state*/

                if (text == 'Uttar Pradesh') {
                    if (['Bahraich'].indexOf(option.text) > -1)
                        option.style.display = 'block'



                }
                if (text == 'Jharkhand') {
                    if (['Gumla', 'Hazirabagh'].indexOf(option.text) > -1)
                        option.style.display = 'block'
                }
			}
}

解决方案

.ajax({ dataType: "json", url: dropdownchoice.url, success: function(data) { var layer = dropdownchoice.layer; layer.clearLayers(); layer.addTo(map);

(data.features).each(function(key, data) { layer.addData(data); }); function getstates(choice) { load_layer(dropdownlayers[choice.value]); var text = choice.options[choice.selectedIndex].text var ddl2 = document.querySelectorAll("#choice option"); for (var i = 1; i < ddl2.length; i++) { var option = ddl2[i]; option.style.display = 'none'; /* state*/ if (text == 'Uttar Pradesh') { if (['Bahraich'].indexOf(option.text) > -1) option.style.display = 'block' } if (text == 'Jharkhand') { if (['Gumla', 'Hazirabagh'].indexOf(option.text) > -1) option.style.display = 'block' } } }

这篇关于如何使用传单在下拉列表选择中添加wms图层的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！