JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.98/jsxgraphcore.js"></script>
<div id="box" class="jxgbox" style="width: 500px; height: 500px;"></div>
<div id="out"></div>

JavaScript

var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-10,10,10,-10], axis: true, backgroundColor: '#0000FF' });

//$(board.renderer.container).css('backgroundColor', '#0000FF');

ineq = board.create(
    'inequality', 
    [board.create(
        'line',
        [board.create('point', [-20, 20]),
         board.create('point', [20, 20])])],
        { fillColor: '#FFFFFF', fillOpacity: 1 });

p = board.create('point', [0, 0]);
q = board.create('point', [1, 1]);
l = board.create('line', [p, q]);
ineq = board.create('inequality', [l], { fillColor: '#FFFFFF', fillOpacity: 1 });

/*
a = board.create('point', [0, 0]);
b = board.create('point', [1, 2]);
c = board.create('line', [a, b]);
ineq = board.create('inequality', [c]);
*/