অ্যারাগন, আপনার উত্তর আমাকে সঠিক দিকে নির্দেশ করেছে। অ্যারেতে স্তর যুক্ত করার এবং তারপরে তাদের নিয়ন্ত্রণের জন্য নীচে আমার চূড়ান্ত অশুচি কোড।
একটি জাভাস্ক্রিপ্ট ফাইলে আমি মানচিত্রটি আরম্ভ করেছি এবং দৃশ্যমানতা টগল করার জন্য একটি ফাংশন ব্যবহার করেছি:
//Layer array
var layersArray = [];
//Map view (Initial location)
var view = new ol.View2D({
// the view's initial state
center: ol.proj.transform([*Lat*,*Long*], 'EPSG:4326', 'EPSG:3857'),
zoom: 12
});
/* Map Initialization */
function initializeMap(){
var esribase = new ol.layer.Tile({
preload: Infinity,
source: new ol.source.XYZ({
url: 'http://server.arcgisonline.com/ArcGIS/rest/services/' +
'World_Topo_Map/MapServer/tile/{z}/{y}/{x}'
})
});
var poly1 = new ol.layer.Tile({
source: new ol.source.TileWMS({
url: 'http://localhost:8080/geoserver/wms',
params: {'LAYERS': '*Workspace*:*Layer*', 'TILED': true}
})
});
poly1.setVisible(false);
var poly2 = new ol.layer.Tile({
source: new ol.source.TileWMS({
url: 'http://localhost:8080/geoserver/wms',
params: {'LAYERS': '*Workspace*:*Layer*', 'TILED': true}
})
});
poly2.setVisible(false);
var poly3 = new ol.layer.Tile({
source: new ol.source.TileWMS({
url: 'http://localhost:8080/geoserver/wms',
params: {'LAYERS': '*Workspace*:*Layer*', 'TILED': true}
})
});
poly3.setVisible(false);
layersArray.push(esribase); //0
layersArray.push(poly1); //1
layersArray.push(poly2); //2
layersArray.push(poly3);//3
var map = new ol.Map({
controls: ol.control.defaults().extend([
new ol.control.ScaleLine({
units: ol.control.ScaleLineUnits.METRIC
})
]),
renderer: ol.RendererHint.CANVAS,
target: 'map',
layers: layersArray,
view:view
});
}
// Layer visibility function
function layerswitch(evt){
layersArray[evt.value].setVisible(evt.checked);
}
এইচটিএমএলে আমি সাধারণ চেকবক্স ব্যবহার করেছি (পলি 1 টগলের উদাহরণ):
<input style='cursor:pointer' type="checkbox" value="1" onclick="javascript:layerswitch(this)" class="Cpoly1" name="poly1check" id="poly1check"/><label id="poly1checkLabel" for="poly1check">Polygon 1 Layer Switcher</label>