Hi Robert, I'm reporting back. I have something that works, though I have a feeling it could be a lot cleaner than the way I did it. I'm a newbie when it comes to javascript and dojo, so the way I do things might be kind of clunky...definitely open to suggestions.
Here is the HTML:
<body>
<div id="viewDiv"></div>
<div id="toggleLayers">
<legend>Toggle layers:</legend>
<label><input type="radio" id="qhStatusLyr" name="chosenLayer" value="qhStatus" checked> Quail Habitat Status</label>
<label><input type="radio" id="coarseHabLyr" name="chosenLayer" value="coarse"> Coarse-level Habitat Types</label>
<label><input type="radio" id="fineHabLyr" name="chosenLayer" value="fine"> Fine-level Habitat Types</label>
</div>
</body>
I then created three different UniqueValueRenderers and switch between them using this javascript:
var qhStatusToggle = dom.byId("qhStatusLyr");
var coarseToggle = dom.byId("coarseHabLyr");
var fineToggle = dom.byId("fineHabLyr");
on(qhStatusToggle, "change", function(){
if (qhStatusToggle.checked){
featureLayer.renderer = qhRenderer;
}
});
on(coarseToggle, "change", function(){
if (coarseToggle.checked){
featureLayer.renderer = coarseRenderer;
}
});
on(fineToggle, "change", function(){
if (fineToggle.checked){
featureLayer.renderer = fineRenderer;
}
});
I really want to come up with a way to use a switch statement, but I can't figure out how to get the value from the radio buttons using dojo. If I could get all the radio buttons in a group based on the "name" attribute (because name is the same for all of them), then I think I could get the value of whatever one is checked and use a switch statement to set the renderer. Just an idea.
