radio boton fuera y dentro

Template for JSXGraph

by Javier Puértolas

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.7/jsxgraphcore.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.7/jsxgraph.css">
    <input type="checkbox" id="vertg"  />
    <label for="vertg">Ver tangente</label>
<div id="board" class="jxgbox" style="width:500px; height:500px">
</div>

CSS

.myText {
    border: 1px black solid;
    border-radius: 5px;
    padding:10px;
    background-color: #ffcccc;
}

JavaScript

// Define the id of your board in BOARDID

const board = JXG.JSXGraph.initBoard('board', {
    boundingbox: [-1, 5, 5, -1],
    axis: true
});

/* var radio = board.create('text', [2, 3, `
    <input type="checkbox" id="vertg"  />
    <label for="vertg">Ver tangente</label>
`], {fixed: true, frozen: true});*/

/*var vertg = document.getElementById("vertg");*/

var ptoa= board.create('point', [2,2], {size:2, visible:false});
var ptob= board.create('point', [2,1], {size:2, visible:false});

/*vertg.on('down', function(){ptoa.setAttribute({visible:radio.checked==false?true:false}); ptob.setAttribute({visible:vertg.checked==false?true:false}) }); */
document.getElementById('vertg').onclick = function(){ptoa.setAttribute({visible:vertg.checked==false?false:true}); ptob.setAttribute({visible:vertg.checked==false?false:true}) };