Untitled

<html>
<head>
  <title>Example</title>
  <script type="text/javascript" charset="UTF-8"
   src="//cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.3/jsxgraphcore.js"></script>
</head>
<body>
<div id="box" class="jxgbox" style="width:500px; height:500px;"></div>
<script type="text/javascript">
var addRandPoint = function(x) {
  p.push(brd.create('point',
              [x,(Math.random()-0.5)*3],{style:6}));
  brd.update();
};

// Init board
var brd = JXG.JSXGraph.initBoard('box',
            {axis:true, boundingbox:[-5, 10, 5, -10]});

// Create points
var p = [];
p[0] = brd.create('point', [-4,2], {style:6});
p[1] = brd.create('point', [3,-1], {style:6});
addRandPoint(-2);
addRandPoint(0.5);
addRandPoint(1);

// Draw function graph
var pol = JXG.Math.Numerics.lagrangePolynomial(p);
var g = brd.create('functiongraph', [pol, -10, 10], {strokeWidth:1});

// Draw derivative
var g2 = brd.create('functiongraph', [JXG.Math.Numerics.D(pol), -10, 10],
           {dash:3, strokeWidth:1, strokeColor:'#ff0000'});

</script>
</body>
</html>