Bounding box

From JSXGraph Wiki
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

The bounding box defines the viewport of the board, i.e. the portion of the [math]\displaystyle{ \mathbb{R}^2 }[/math] that is shown. The JavaScript code

var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-5,10,5,-2], keepaspectratio: true, axis:true});

sets the vertical and horizontal units and the position of the origin such that the upper left corner of the drawing panel has position (-5,10) and the lower right corner of the drawing panel has position (5,-2).

The source code of the page looks like this:

<link rel="stylesheet" type="text/css" href="https://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
<script type="text/javascript" src="https://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
<div id="jxgbox" class="jxgbox" style="width:500px; height:600px;"></div>
<script type="text/javascript">
var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-5,10,5,-2], axis:true});
</script>