Edit in JSFiddle

var board = JXG.JSXGraph.initBoard('box', {
    boundingbox: [-2, 2, 6.6, -2],
    keepaspectratio: true,
    axis: true
});
var O = board.create('point', [0, 0], {
    fixed: true,
    visible:false
});
var circgon = board.create('circle', [O, 1]); //circonferenza goniometrica

var P = board.create('glider', [1, 0, circgon],{name:'P'}); //viene creato il punto P sulla circonferenza goniometrica
var U = board.create('point', [1, 0], {
    visible: false,
    fixed: true
}); //Il punto U, necessario alla definizione dell'angolo al centro
var arco = board.create('arc', [O, U, P], {
    strokeColor: 'red',
    strokeWidth: 3
}); // disegna l'arco sulla circonferenza goniometrica
t=function(){return a.Value();};
var a = board.create('angle', [U, O, P]); // angolo UOP
//board.create('text', [-1.5, 1, function() {return a.Value()}]);
board.create('text', [-1.5, 1.5, "Grafico di sin(x)"]);

var S = board.create('point', [t, function() {
    return P.Y();}], {
    trace: true,
    traceAttributes: {
        strokeColor: 'green',
        fillColor: 'green'
    },name:'S'
});
board.create('segment', [P, S], {
    dash: 2
});
var C = board.create('point', [t, 0], {
    visible: false,
    fixed: true
});    

board.create('segment', [O, C], {
    dash: 0,
    strokeColor:'red'
});