JSFiddle - React, Tailwind, and code Playground

by orthosie

HTML

<script src="https://math.tools/js/jsxgraphcore.js"></script>
<div id='jxgbox' class='jxgbox' style='width:100%; min-height:1000px;'></div>

JavaScript

var color = ['blue','red','magenta', 'green', 'black','yellow'];
var nr = 0;
var maxX = 0.0;
var maxY = 0.0;
var minY = 100000.0;

var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,showCopyright: false});

var plotData = function() {
    var i, x=[], y=[], d;
    for (i=0;i<100;i++) {
        x[i] = i;
        y[i] = i * i * i;
        if (x[i]>maxX) maxX = x[i];
        if (y[i]>maxY) maxY = y[i];
        if (y[i]<minY) minY = y[i];
    }
    brd.setBoundingBox([-2,maxY*1.01,maxX*1.05,minY*0.95]);
    var c = brd.create('curve',[x,y],{strokeColor:color[nr%color.length]});
    nr++;
    brd.update();
};


plotData();