1

I've struggled to use radio buttons to toggle multiple map service layers. So far it's fine to add but I can't then add another map service and remove the previous at the same time - I just can't figure out the problem:

$("input[type='radio']").click(function () {

    var radioValue = $("input[name='exampleSwitch']:checked").val();
    if (radioValue == 'on') {

        map.addLayer(mapidurl);

    } else if (radioValue == 'off') {
        debugger
        map.removeLayer(mapidurl);
    };
}

The HTML:

<div class="switch tiny" style="float:right;padding-top:0px;">
      <input class="switch-input" id="switch3" type="radio" name="exampleSwitch">
      <label class="switch-paddle" for="switch3">
          <span class="switch-active" value="on" aria-hidden="true"></span>
          <span class="switch-inactive" value="off" aria-hidden="true"></span>
      </label>
</div>

Can anyone offer any guidance?

  • please explain more ! waht do you mean by "can't then add another map service and remove the previous at the same time" ? – Springer F Aug 25 '16 at 10:54
  • Well when I click on the radio button a map layer is added ie. map.addLayer. When an alternative radio button on the same toc is checked then the previous map service layer is replaced removeLayer (switched off) and a new map layer is added in its place. – user2932466 Aug 25 '16 at 13:27
1

You might consider using checkboxes instead of radio buttons. The way that your if/then statement is set up seems to indicate there is no default "off" position to begin with (i.e., by having radioValue == 'off' trigger removeLayer). I successfully used checkboxes with the following code:

<input type="checkbox" id="check1" onclick="toggleLayers(1);"/><label for="check1">Map Layer Title</label>

var layers = [];
layers[1] = link to layer

// Create function to toggle layers in array on and off
function toggleLayers(i){
    if(layers[i].getMap()==null) {
        layers[i].setMap(map);
    }
    else {
        layers[i].setMap(null);
    }
}

The code above was modified from this post https://stackoverflow.com/questions/17409598/toggle-multiple-kml-kml-layers-in-google-maps-api-v3. And though for Google Maps API rather than ArcGIS, could be helpful in refining your toggle code.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.