Estoy desarrollando un mapa web. Este mapa debe incluir dos herramientas (deslizar capas y espiar capas) para que el usuario explore las diferencias entre dos capas superpuestas.

Mi objetivo es crear dos botones de radio donde una de las herramientas se activa cuando se selecciona el botón de radio correspondiente.

Los botones de opción:

 <div class="toolbar-centered"> <input type="radio" id="swipelayer" name = "mainfunction" onclick="mainfunx()" > Swipe <input type="radio" id="layerspy" name = "mainfunction" onclick="mainfunx()"> Layer spy </div>

Mi función javascript para cambiar entre las dos herramientas (las herramientas se definen como swipefunction() y spyfunction() ):

 function mainfunx() { var s = document.getElementById('swipelayer').checked, p = document.getElementById('layerspy').checked; if (s) swipefunction() if (p) spyfunction() }

Una vez que cambio mi selección en los botones de radio, las herramientas no se desactivan. En cambio, ambos se activan al mismo tiempo. Soy muy nuevo en Javascript y realmente no tengo ni idea de cómo asegurarme de que la otra función esté desactivada mientras la otra está activada.