Interaktiv Test-Rakete
Version 1.2 von Holger Engels am 2026/09/20 12:07
Flugprofil interaktiv komponieren
Entwirf ein eigenes Flugprofil für die 20 Sekunden. Du kannst die vier Eckpunkte des Graphen verschieben. Der Startpunkt ist bei t=0 fixiert, der Endpunkt bei t=20.
Ziel: Finde eine Einstellung, bei der die Rakete am Ende exakt die geforderten 600 Meter zurückgelegt hat.
require.config({
paths: {
'jsxgraph': 'https://cdn.jsdelivr.net/npm/jsxgraph/distrib/jsxgraphcore'
}
});
require(['jsxgraph'], function(JXG) {
var board = JXG.JSXGraph.initBoard('jxgbox_weg', {
boundingbox: [-2, 80, 22, -15],
axis: true,
showCopyright: false,
defaultAxes: {
x: {name: 't [s]', withLabel: true, label: {position: 'rt', offset: [-25, -15]}},
y: {name: 'v [m/s]', withLabel: true, label: {position: 'rt', offset: [-50, -10]}}
}
});
var line0 = board.create('line', [[0, 0], [0, 1]], {visible: false});
var line20 = board.create('line', [[20, 0], [20, 1]], {visible: false});
// Gemeinsame Attribute für das Einrasten
var snapAttr = {
snapToGrid: true,
snapSizeX: 0.5, // Rasterweite auf der x-Achse: 0.5 Sekunden
snapSizeY: 1.0 // Rasterweite auf der y-Achse: 1.0 m/s
};
// Punkte mit Raster-Eigenschaften erstellen (Object.assign kombiniert die Attribute)
var p0 = board.create('glider', [0, 0, line0], Object.assign({name: 'Start', size: 4, color: '#e66224'}, snapAttr));
var p1 = board.create('point', [5, 40], Object.assign({name: 'P_1', size: 4, color: '#336699'}, snapAttr));
var p2 = board.create('point', [15, 40], Object.assign({name: 'P_2', size: 4, color: '#336699'}, snapAttr));
var p3 = board.create('glider', [20, 0, line20], Object.assign({name: 'Ende', size: 4, color: '#e66224'}, snapAttr));
var pol = board.create('polygon', [p0, p1, p2, p3], {
fillColor: '#f39c12',
fillOpacity: 0.4,
borders: {strokeWidth: 2, strokeColor: '#d35400'}
});
var txt = board.create('text', [1, 70, function() {
var area = pol.Area();
var result = 'Zurückgelegter Weg: ' + area.toFixed(1) + ' m';
if (Math.abs(area - 600) < 0.1) {
result += ' 🎉 Ziel (600m) erreicht!';
}
return result;
}], {fontSize: 16, strokeColor: '#2c3e50'});
});