Sine Function Parameters

by FLeupold

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="BOARDID0" class="jxgbox" style="width:800px; height:400px">
</div>

JavaScript

const col1 = '#4285F4', col2 = '#EA4335', col3 = '#34A853', col4 = '#FBBC05';
const colVecN = '#4285F4', colVecS = '#EA4335', colVecC = '#34A853';


const A1 = 1.5, T1 = 1.5, P1 = 0.5, Y1 = 0.5;


var brd = JXG.JSXGraph.initBoard('BOARDID0', {
	boundingbox: [-0.5, 3, 10, -3], axis: false, 
	zoom: {enabled: false, wheel: false},
	pan: {enabled: false, needTwoFingers: false},
	showCopyright: false, showNavigation: false
});
// console.log(brd);


var xAxis = brd.create('axis', [ [0,0],[5.4,0] ], {
	straightFirst: false, straightLast: false,
	withLabel: true, name: 't (s)', /* name: '$$x\\;\\mathrm{(m)}$$', */
    label: {position: 'rt', offset: [0, 15], anchorX: 'right', parse: false, fontSize: 12 },
	ticks: {ticksDistance: 1, majorHeight: 267, tickEndings: [1,1],
		insertTicks: false, minorTicks: 1, minorHeight: 267,
		label: {anchorX: 'middle', anchorY: 'top', offset: [0,-3] } }
	});
var yAxis = brd.create('axis', [ [0,-2.4],[0,2.4] ], {
	straightFirst: false, straightLast: false,
	withLabel: true, name: 'y (m)', /* name: '$$x\\;\\mathrm{(m)}$$', */
    label: {position: 'rt', offset: [12, -3], anchorX: 'left', parse: false, fontSize: 12 },
	ticks: {ticksDistance: 1, majorHeight:762, drawZero: true,
		insertTicks: false, minorTicks: 1, minorHeight: 762,
		label: {anchorX: 'right', anchorY: 'middle', offset: [-3,0] } }
	}); 

var sliderA = brd.create('slider', [[6.5, 2.0], [8.5, 2.0], [0, 0, 1.5]], {
	name: 'ŷ', postLabel:' m', 
	withTicks: false, precision: 1, snapWidth: 0.1,
	size: 4, highline:{visible: false} });
var sliderT = brd.create('slider', [[6.5, 1.5], [8.5, 1.5], [0.5, 2, 4]], {
	name: 'T', postLabel:' s',
	withTicks: false, precision: 1, snapWidth: 0.1,
	size: 4, highline:{visible: false} });
var sliderP = brd.create('slider', [[6.5, 1.0], [8.5, 1.0], [0, 0, 2]], {
	name: 'φ', postLabel:' π',
	withTicks: false, precision: 1, snapWidth: 0.1,
	size: 4, highline:{visible: false} });
var sliderY = brd.create('slider', [[6.5, 0.5], [8.5, 0.5], [-1, 0, 1]],...