2017-04-17 3 views
0

Est-il possible d'avoir une seule couche visible sur la carte dans ce widget LayerList ESRI tutorial?Couche unique visible dans le widget LayerList (ArcGIS JavaScript)

Chaque fois que vous cliquez sur un calque, le précédent doit être désactivé. Vous avez donc toujours une seule couche sur la carte.

Michelle

enter image description here

+0

Nécessité de passer outre un widget layerlist ... Permettez-moi de vérifier le code .. –

+0

viennent les couches de service de carte unique ou plusieurs ceux? Si vous pouvez fournir le code que je pourrais vous aider – Ashraf

+0

Salut @Ashraf Je voudrais utiliser le code du tutoriel ESRI mentionné ci-dessus. La carte est basée sur un identifiant de carte Web ArcGIS Online. – Michelle

Répondre

1

j'ai réussi à écrire un code pour vous. Vérifiez et faites-moi savoir:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> 
<title>Layer List Dijit</title> 
<link rel="stylesheet" href="https://js.arcgis.com/3.20/dijit/themes/claro/claro.css"> 
<link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css"> 
<script language="javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
<style> 
html, body, .container, #map { 
height:100%; 
width:100%; 
margin:0; 
padding:0; 
margin:0; 
font-family: "Open Sans"; 
} 
#map { 
padding:0; 
} 
#layerListPane{ 
width:25%; 
} 
.esriLayer{ 
    background-color: #fff; 
} 
.esriLayerList .esriList{ 
    border-top:none; 
} 
.esriLayerList .esriTitle { 
    background-color: #fff; 
    border-bottom:none; 
} 
.esriLayerList .esriList ul{ 
    background-color: #fff; 
} 

</style> 
<script>var dojoConfig = { parseOnLoad: true };var busy=false;</script> 
<script src="https://js.arcgis.com/3.20/"></script> 
<script> 
require([ 
"esri/arcgis/utils", 
"esri/dijit/LayerList", 
"dijit/layout/BorderContainer", 
"dijit/layout/ContentPane", 
"dojo/domReady!" 
], function(
arcgisUtils, 
LayerList 
) { 
//Create a map based on an ArcGIS Online web map id 
arcgisUtils.createMap("f63fed3f87fc488489e27c026fa5d434", "map").then(function(response){ 
    var myWidget = new LayerList({ 
     map: response.map, 
     layers: arcgisUtils.getLayerList(response) 
    },"layerList"); 

    myWidget.on("toggle",function(evt){ 
     if(busy) return; 

     selectedLayerSubIndex = evt.subLayerIndex; 
     if(selectedLayerSubIndex) return; 

     selectedLayerIndex = evt.layerIndex; 
     visibility = evt.visible; 

     elm = $("#layerListPane input[type=checkbox][data-layer-index="+selectedLayerIndex+"]:not([data-sublayer-index])"); 


     otherCheckedElems = $("#layerListPane input[type=checkbox][data-layer-index!="+selectedLayerIndex+"]:not([data-sublayer-index]):checked"); 
     if(visibility){ 
      busy=true; 
      otherCheckedElems.each(function() { 
       $(this).click(); 
      }); 
      busy=false; 
     } 
     else{ 
      checkedLength = otherCheckedElems.length 
      if(checkedLength==0) setTimeout("elm.click();", 100); 
     } 
    }) 

    myWidget.startup(); 
}); 

}); 
</script> 
</head> 
<body class="claro"> 
<div class="container" data-dojo-type="dijit/layout/BorderContainer" 
data-dojo-props="design:'headline',gutters:false"> 
<div id="layerListPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'"> 
    <div id="layerList"></div> 
</div> 
<div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"></div> 
</div> 
</body> 
</html> 
+0

Charmant. J'ai juste commencé à apprendre à coder, très utile pour moi. Serait-il possible d'avoir toujours une couche sur la carte (comme mentionné dans la question)? À ce stade, vous pouvez désactiver la couche et n'en avoir aucune sur la carte; ce comportement peut-il être évité? – Michelle

+0

Initialement, vous obtiendrez les couches comme leur visibilité dans le service de carte. Alors voulez-vous remplacer cela? vous pouvez par exemple activer uniquement le premier calque. Si c'était votre question s'il vous plaît faites le moi savoir afin que je mette à jour le code. Et bien sûr, vous pouvez garder au moins un calque. Mettra à jour la réponse plus tard après avoir confirmé votre question. – Ashraf

+0

Bonjour @Ashraf Je ne veux pas remplacer la visibilité initiale du service de carte. Lors de la sélection d'une couche dans la liste, vous pouvez également la désélectionner et rester sans couches sur la carte. Je voudrais empêcher ce comportement afin que vous ayez toujours un calque dessus. – Michelle