Trig Graph

by turtaniumx

HTML

<script src="https://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
<link rel="stylesheet" href="https://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css">
<div id='box' class='jxgbox'></div>

CSS

#box {
    width:500px;
    height:500px;
}

JavaScript

var brd = JXG.JSXGraph.initBoard('box', 
	{axis: false, 
  boundingbox: [-8,8,8,-8], 
  keepaspectratio: true, 
  zoom: {factorX: 2,factorY: 2,wheel: true,needshift: true, min: 0.1, max: 12},
  zoomY: 3,
  showCopyright:false
  });

var a = brd.create('axis', [[0, 0], [1, 0]], {ticks: {scale: 1*Math.PI/6, scaleSymbol: 'π/6'}});
var b = brd.create('axis', [[0, 0], [0, 1]], {ticks: {scale: 1}});

var factPI = 2
var setScale = function() {
	brd.removeObject(a);
	var a = brd.create('axis', [[0, 0], [1, 0]], {ticks: {scale: 1*Math.PI/factPI, scaleSymbol: 'π/6'}});
}
//setScale();



var f = brd.jc.snippet(
    // the function term
    'sin(x)',
    // wrap a function around it
    true,
    // the parameters to the function
    'x'
);

brd.create('plot', [f]);