isocuStack

by Javier Puértolas

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/1.1.0/jsxgraphcore.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.7/jsxgraph.css">
<div id="divid" class="jxgbox" style="width:300px; height:300px; border-style: none;
">



</div>

JavaScript

var board = JXG.JSXGraph.initBoard('divid', {
  boundingbox: [-1, 11, 11, -1],
  axis: true,
  grid: true,
  showNavigation: false,
  showCopyright: false,
  pan: {
    enabled: false
  },
  zoom: {
    enabled: false
  }
});
var pt_name = ["A1", "B1", "C1"];
var pt_initial_x = [2, 3, 6];
var answer = [];
var vline = [];

for (let i of [0, 1, 2]) {
answer.push(board.create('point', [pt_initial_x[i], 0], {
    color: '#003399',
    name:pt_name[i],
    showInfobox: true,
    snapToGrid: true,
    snapSizeX: 0.5,
    snapSizeY: 0.1
  }));
 board.on('move', function(){
        answer[i].moveTo([pt_initial_x[i], answer[i].Y()]);
});
}