0

我试图让 JQuery 和 OpenLayers 一起玩得很好。作为一个 javascript 新手，我无法使用与给定图层关联的 jQuery 生成不透明度滑块和可见性复选框。

在此之前，我不知道有多少层可用。此信息通过 python 脚本加载，该脚本向 Geoserver 执行 WMS 请求。

我来自python，发现我真正想要的是一个字典来存储层对象和一个键。这是我尝试使用哈希来做到这一点。我正在寻找任何建议，从“不要使用哈希，看” _ ___ ”到“你错过了 '()'。

下面的代码将图层添加到地图、将其名称添加到内容列表、不透明度栏和设置可见性的复选框。它非常适合单层。每个后续图层都会覆盖先前图层的不透明度滑块和复选框。

//If the thumbnail is clicked load the layer.
$('table').on('click','.thumbnail',function(event){
var layer = {};

//This info is placed into the img tag via jQuery   
var name = ($(this).attr("layername_id"));
var title = ($(this).attr("titlename_id"));

//OpenLayers creates the layer here
layer[i] = new OpenLayers.Layer.WMS(title, "geoserver/wms?",{LAYERS: name,FORMAT: 'image/png',TRANSPARENT: 'true',PROJECTION:'EPSG:30100',BBOX: '-180,-60,180,60'},{OPACTIY: 0.1, isBaseLayer: false, tiled:true} );

//Do not add the same layer multiple times
if (map.getLayersByName(name) == false) {
        map.addLayers([layer[i]]);  
}

//Defined just to make life easier in this part of the code.
var name = layer[i].name;

//Check box for visibility in a table of contents DIV tag.
$('.toc').append('<div><input class="toc_inline" id="check'+i+'" type="checkbox" checked="checked"></div>');
    $("[id^=check]").click(function(){
    var $input = $(this);
    if($input.prop('checked') == true){
        layer[i].setVisibility(true);
    }
    else {
        layer[i].setVisibility(false);
    }
    });

//Layer name in the TOC and slider to handle transparency.
    $('.toc').append('<div class="toc_inline" unique_id="'+name+'">'+name+'</div>');

//Slider for transparency
$('.toc').append('<div id="slider-'+i+'"><div class="ui-slider-handle"></div></div>');

    $("[id^=slider]").slider({
    value: 100,
    slide: function(e, ui) {
        layer[i].setOpacity(ui.value / 100);
        }
    });
//My attempt to step to the next integer
i++;

});
4

0 回答 0