Testseite JSXGraph

Aus Wiki1

(Unterschied zwischen Versionen)
Wechseln zu: Navigation, Suche
 
(Der Versionsvergleich bezieht 59 dazwischenliegende Versionen mit ein.)
Zeile 1: Zeile 1:
-
<jsxgraph box="BOARD1" width="600" height="600">
+
<jsxgraph box="box" width="600" height="600">
-
let input = [[0, 0, 2], [2, 3, 0], [0, 1, 0]];
+
var x_min=0;
-
+
var x_max=2;
-
let active = [[0, 0, 0], [0, 1, 0], [0, 0, 0]];
+
var y_min=0;
-
+
var y_max=2;
-
let settings = {
+
var dx=(x_max-x_min)/100;
-
    'projection': {
+
var dy=(y_max-y_min)/100;
-
        'top': true,        // top view
+
 
-
        'north': true,      // view from north
+
var brd = JXG.JSXGraph.initBoard('box', {boundingbox: [x_min,y_max,x_max,y_min]});
-
        'east': true,      // view from east
+
 
-
        'south': true,      // view from south
+
 
-
        'west': true,      // view from west
+
  var bound = [0, 10];
-
        'base': true,      // view from below
+
  var view = brd.create('view3d',
-
        'update': false    // false: projections from the initial matrix ([[.., .., ..], [.., .., ..], [.., ..,.]] are displayed
+
      [[0.5, 0.5], [1, 1],
-
    },                      // true:  projections from the active matrix are displayed
+
      [bound, bound, bound]],
-
    'navigation': {
+
      {});
-
        'visible': true,    // show navigation button
+
 
-
        'keyboard': true,  // keyboard control
+
let baseCube1 = view.create('polyhedron3d', [
-
        'azimuth': true,    // azimuth control
+
     [
-
        'elevation': true,  // elevation control
+
         [0, 0, 0], [10, 0, 0], [10, 10, 0], [0, 10, 0], [0, 0, 10], [10, 0, 10], [10, 10, 10], [0, 10, 10]
-
        'view': [-0.3, 0.5] // initial values for azimuth and elevation (also used for the reset button "O")
+
     ], [
-
    },
+
        [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
-
    'output': {            // xx view of input matrix equals xx view of active matrix
+
     ]
-
        'top': true,        // add top value to output()
+
], {visible: true, color: 'red', opacity: 1
-
        'north': true,      // add north value to output()
+
-
        'east': true,      // add east value to output()
+
-
        'south': true,      // add south value to output()
+
-
        'west': true,      // add west value to output()
+
-
        'base': true,      // add base value to output()
+
-
        'matrix': true      // add active matrix to output()
+
-
    }
+
-
}
+
-
+
-
// JSXGraph board
+
-
+
-
let board = JXG.JSXGraph.initBoard(BOARD1, boardAttr());
+
-
+
-
let view = initBoard3D(board);
+
-
+
-
let superM = {
+
-
    'top':
+
-
    input
+
-
}
+
-
let mx = 1;
+
-
let my = 1;
+
-
+
-
let cubes = new Array();
+
-
+
-
let col = {
+
-
    'north': '#009e73',
+
-
    'south': '#f0e442',
+
-
    'west': '#56b4e9',
+
-
    'east': '#d65c00',
+
-
    'top': '#0072b2',
+
-
    'base': '#e69f00',
+
-
    'button': '#999999'
+
-
};
+
-
+
-
function scaleView() {
+
-
    return (board.create('point', [1, 1], {visible: false}).coords.scrCoords[1] - board.create('point', [0, 0], {visible: false}).coords.scrCoords[1]) / 40;
+
-
}
+
-
+
-
let factor = scaleView();
+
-
+
-
function cVis(x, y, z) {
+
-
    return (JXG.evaluate(cubes[x][y][z].visProp.visible) ? 1 : 0);
+
-
}
+
-
+
-
function viewButton() {
+
-
    view.setView(settings['navigation']['view'][0] + Math.PI, settings['navigation']['view'][1], 0);
+
-
    mx = 1;
+
-
    my = 1;
+
-
    board.update();
+
-
}
+
-
+
-
let buttonEast = board.create('button', [8.25, 4, 'E', () => {
+
-
     eastButton();
+
-
    try {
+
-
         setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['east']);
+
-
let buttonWest = board.create('button', [4.75, 4, 'W', () => {
+
-
    westButton();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['west']);
+
-
let buttonNorth = board.create('button', [6.5, 5.75, 'N', () => {
+
-
     northButton();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['north']);
+
-
let buttonSouth = board.create('button', [6.5, 2.25, 'S', () => {
+
-
    southButton();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['south']);
+
-
let buttonPlus = board.create('button', [7.5, -0.25, ' + ', () => {
+
-
    plusButton();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['top']);
+
-
let buttonMinus = board.create('button', [5.5, -0.25, ' – ', () => {
+
-
    minusButton();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['base']);
+
-
let viewMinus = board.create('button', [6.5, 4, ' O ', () => {
+
-
     viewButton();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
}], {fixed: true, visible: settings['navigation']['visible']}).rendNodeButton.style = bStyle(col['button']);
+
-
+
-
function bStyle(c) {
+
-
    return 'width: +' + (50 * factor) + 'px; height: ' + (50 * factor) + 'px; border: solid gray ' + (3 * factor) + 'px; border-radius: ' + (15 * factor) + 'px; color: black; padding: 1px 3px; text-align: center; text-decoration: none; display: inline-block; font-size: ' + (24 * factor) + 'px; background-color:' + c + ';';
+
-
}
+
-
+
-
document.getElementById(BOARD1).addEventListener("keydown", function (e) {
+
-
    if (settings['navigation']['keyboard'])
+
-
        if (e.key === "ArrowUp") {
+
-
            northButton();
+
-
        } else if (e.key === "ArrowDown") {
+
-
            southButton();
+
-
        } else if (e.key === "ArrowLeft") {
+
-
            westButton();
+
-
        } else if (e.key === "ArrowRight") {
+
-
            eastButton();
+
-
        } else if (e.key === "+" | e.key === " ") {
+
-
            plusButton();
+
-
        } else if (e.key === "-") {
+
-
            minusButton();
+
-
        } else if (e.key === "o" | e.key === "O") {
+
-
            viewButton();
+
-
        }
+
-
        e.preventDefault();
+
-
    try {
+
-
        setOutput();
+
-
    } catch (e) {
+
-
    }
+
-
    board.update();
+
});
});
-
+
 
-
+
let baseCube2 = view.create('polyhedron3d', [
-
// JSXGraph construction
+
    [
-
+
        [10, 10, 0], [9, 10, 0], [9, 9, 0], [10, 9, 0], [10, 10, 1], [9, 10, 1], [9, 9, 1], [10, 9, 1]
-
view.create('point3d', [0, 0, 0], {
+
     ], [
-
     name: '',
+
        [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
-
     size: 8 * factor,
+
     ]
-
     fixed: true,
+
], {
-
    fillColor: '#000000',
+
     visible: true, color: 'blue', opacity: 1
-
    showinfobox: false
+
});
});
-
+
 
-
let baseCube = view.create('polyhedron3d', [
+
let baseCube3 = view.create('polyhedron3d', [
     [
     [
-
         [0, 0, 0], [1, 0, 0], [1, 1, 0], [0, 1, 0], [0, 0, 1], [1, 0, 1], [1, 1, 1], [0, 1, 1]
+
         [9, 10, 0], [8, 10, 0], [8, 9, 0], [9, 9, 0], [9, 10, 2], [8, 10, 2], [8, 9, 2], [9, 9, 2]
     ], [
     ], [
         [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
         [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
     ]
     ]
], {
], {
-
     visible: false
+
     visible: true, color: 'green', opacity: 1
});
});
-
+
 
-
let markCube = view.create('polyhedron3d', [
+
let baseCube4 = view.create('polyhedron3d', [
     [
     [
-
         [0, 0, 0], [1, 0, 0], [1, 1, 0], [0, 1, 0], [0, 0, 1], [1, 0, 1], [1, 1, 1], [0, 1, 1]
+
         [8, 10, 0], [7, 10, 0], [7, 9, 0], [8, 9, 0], [8, 10, 3], [7, 10, 3], [7, 9, 3], [8, 9, 3]
     ], [
     ], [
-
         [0, 4], [1, 5], [2, 6], [3, 7], [4, 5], [5, 6], [6, 7], [7, 4]
+
         [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
     ]
     ]
], {
], {
-
     visible: false
+
     visible: true, color: 'yellow', opacity: 1
});
});
-
+
 
-
let arrows = view.create('polyhedron3d', [
+
let baseCube5 = view.create('polyhedron3d', [
     [
     [
-
         [1.25, -0.25, 0], [1.75, -0.25, 0], [1.5, -0.5, 0],
+
         [7, 10, 0], [6, 10, 0], [6, 9, 0], [7, 9, 0], [7, 10, 5], [6, 10, 5], [6, 9, 5], [7, 9, 5]
-
        [3.25, 1.25, 0], [3.25, 1.75, 0], [3.5, 1.5, 0],
+
-
        [1.25, 3.25, 0], [1.75, 3.25, 0], [1.5, 3.5, 0],
+
-
        [-0.25, 1.25, 0], [-0.25, 1.75, 0], [-0.5, 1.5, 0]
+
     ], [
     ], [
-
         [0, 1, 2], [3, 4, 5], [6, 7, 8], [9, 10, 11]
+
         [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
     ]
     ]
], {
], {
-
     fillColorArray: [col['south'], col['east'], col['north'], col['west']],
+
     visible: true, color: 'orange', opacity: 1
-
    opacity: 1,
+
-
    fillOpacity: 1,
+
-
    strokeWidth: 3 * factor,
+
-
    strokeColor: 'gray',
+
-
    visible: true
+
});
});
-
+
 
-
let base = view.create('polyhedron3d', [
+
let baseCube6 = view.create('polyhedron3d', [
     [
     [
-
         [0, 0, 0], [1, 0, 0], [2, 0, 0], [3, 0, 0],
+
         [6, 10, 0], [5, 10, 0], [5, 9, 0], [6, 9, 0], [6, 10, 8], [5, 10, 8], [5, 9, 8], [6, 9, 8]
-
        [0, 1, 0], [1, 1, 0], [2, 1, 0], [3, 1, 0],
+
-
        [0, 2, 0], [1, 2, 0], [2, 2, 0], [3, 2, 0],
+
-
        [0, 3, 0], [1, 3, 0], [2, 3, 0], [3, 3, 0]
+
     ], [
     ], [
-
         [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6],
+
         [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
-
        [4, 5, 9, 8], [5, 6, 10, 9], [6, 7, 11, 10],
+
-
        [8, 9, 13, 12], [9, 10, 14, 13], [10, 11, 15, 14]
+
     ]
     ]
], {
], {
-
     fillColorArray: [col['button']],
+
     visible: true, color: 'grey', opacity: 1
-
    fillOpacity: 0.25,
+
-
    strokeWidth: 3 * factor,
+
-
    strokeColor: 'lightgray',
+
-
    visible: true,
+
-
    layer: 0
+
});
});
-
+
 
-
for (let i = 0; i < 3; i++) {
+
let baseCube7 = view.create('polyhedron3d', [
-
    cubes[i] = new Array();
+
     [
-
    for (let j = 0; j < 3; j++) {
+
         [5, 10, 0], [4, 10, 0], [4, 9, 0], [5, 9, 0], [5, 10, 10], [4, 10, 10], [4, 9, 10], [5, 9, 10]
-
        cubes[i][j] = new Array();
+
     ], [
-
        for (let k = 0; k < 3; k++) {
+
         [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
-
            cubes[i][j][k] = view.create('polyhedron3d', [baseCube, [view.create('transform3d', [i, j, k], {type: 'translate'})]], {
+
     ]
-
                fillColorArray: [col['base'], col['south'], col['east'], col['north'], col['west'], col['top']],
+
], {
-
                fillOpacity: 1,
+
     visible: true, color: 'darkgrey', opacity: 1
-
                strokeColor: 'gray',
+
-
                strokeWidth: 3 * factor,
+
-
                visible: () => {
+
-
                    return superM['top'][j][i] > k ? true : false;
+
-
                }
+
-
            });
+
-
        }
+
-
     }
+
-
}
+
-
+
-
// Projections
+
-
function topP() {
+
-
    return (settings['projection']['update']) ? active : input;
+
-
}
+
-
+
-
function northP() {
+
-
    return [
+
-
         [cVis(2, 0, 0) + cVis(2, 1, 0) + cVis(2, 2, 0), cVis(1, 0, 0) + cVis(1, 1, 0) + cVis(1, 2, 0), cVis(0, 0, 0) + cVis(0, 1, 0) + cVis(0, 2, 0)],
+
-
        [cVis(2, 0, 1) + cVis(2, 1, 1) + cVis(2, 2, 1), cVis(1, 0, 1) + cVis(1, 1, 1) + cVis(1, 2, 1), cVis(0, 0, 1) + cVis(0, 1, 1) + cVis(0, 2, 1)],
+
-
        [cVis(2, 0, 2) + cVis(2, 1, 2) + cVis(2, 2, 2), cVis(1, 0, 2) + cVis(1, 1, 2) + cVis(1, 2, 2), cVis(0, 0, 2) + cVis(0, 1, 2) + cVis(0, 2, 2)]
+
-
    ];
+
-
}
+
-
+
-
function southP() {
+
-
    return [
+
-
        [cVis(0, 0, 0) + cVis(0, 1, 0) + cVis(0, 2, 0), cVis(1, 0, 0) + cVis(1, 1, 0) + cVis(1, 2, 0), cVis(2, 0, 0) + cVis(2, 1, 0) + cVis(2, 2, 0)],
+
-
        [cVis(0, 0, 1) + cVis(0, 1, 1) + cVis(0, 2, 1), cVis(1, 0, 1) + cVis(1, 1, 1) + cVis(1, 2, 1), cVis(2, 0, 1) + cVis(2, 1, 1) + cVis(2, 2, 1)],
+
-
        [cVis(0, 0, 2) + cVis(0, 1, 2) + cVis(0, 2, 2), cVis(1, 0, 2) + cVis(1, 1, 2) + cVis(1, 2, 2), cVis(2, 0, 2) + cVis(2, 1, 2) + cVis(2, 2, 2)]
+
-
    ];
+
-
}
+
-
+
-
function eastP() {
+
-
    return [
+
-
        [cVis(0, 0, 0) + cVis(1, 0, 0) + cVis(2, 0, 0), cVis(0, 1, 0) + cVis(1, 1, 0) + cVis(2, 1, 0), cVis(0, 2, 0) + cVis(1, 2, 0) + cVis(2, 2, 0)],
+
-
        [cVis(0, 0, 1) + cVis(1, 0, 1) + cVis(2, 0, 1), cVis(0, 1, 1) + cVis(1, 1, 1) + cVis(2, 1, 1), cVis(0, 2, 1) + cVis(1, 2, 1) + cVis(2, 2, 1)],
+
-
        [cVis(0, 0, 2) + cVis(1, 0, 2) + cVis(2, 0, 2), cVis(0, 1, 2) + cVis(1, 1, 2) + cVis(2, 1, 2), cVis(0, 2, 2) + cVis(1, 2, 2) + cVis(2, 2, 2)]
+
-
     ];
+
-
}
+
-
+
-
function westP() {
+
-
    return [
+
-
        [cVis(0, 2, 0) + cVis(1, 2, 0) + cVis(2, 2, 0), cVis(0, 1, 0) + cVis(1, 1, 0) + cVis(2, 1, 0), cVis(0, 0, 0) + cVis(1, 0, 0) + cVis(2, 0, 0)],
+
-
        [cVis(0, 2, 1) + cVis(1, 2, 1) + cVis(2, 2, 1), cVis(0, 1, 1) + cVis(1, 1, 1) + cVis(2, 1, 1), cVis(0, 0, 1) + cVis(1, 0, 1) + cVis(2, 0, 1)],
+
-
         [cVis(0, 2, 2) + cVis(1, 2, 2) + cVis(2, 2, 2), cVis(0, 1, 2) + cVis(1, 1, 2) + cVis(2, 1, 2), cVis(0, 0, 2) + cVis(1, 0, 2) + cVis(2, 0, 2)]
+
-
    ];
+
-
}
+
-
+
-
function baseP() {
+
-
    return [
+
-
        [cVis(2, 0, 0), cVis(1, 0, 0), cVis(0, 0, 0)],
+
-
        [cVis(2, 1, 0), cVis(1, 1, 0), cVis(0, 1, 0)],
+
-
        [cVis(2, 2, 0), cVis(1, 2, 0), cVis(0, 2, 0)]
+
-
    ];
+
-
}
+
-
+
-
superM = {
+
-
    'top':
+
-
        topP(),
+
-
    'north':
+
-
        northP(),
+
-
    'south':
+
-
        southP(),
+
-
    'west':
+
-
        westP(),
+
-
    'east':
+
-
        eastP(),
+
-
    'base':
+
-
        baseP()
+
-
}
+
-
+
-
function eastButton() {
+
-
    mx++;
+
-
    setOutput();
+
-
}
+
-
+
-
function westButton() {
+
-
    mx--;
+
-
}
+
-
+
-
function northButton() {
+
-
    my++;
+
-
}
+
-
+
-
function southButton() {
+
-
    my--;
+
-
}
+
-
+
-
function plusButton() {
+
-
    //inXXput[my][mx] == 3 ? 3 : inXXput[my][mx]++;
+
-
    superM['top'][my][mx] == 3 ? 3 : superM['top'][my][mx]++;
+
-
    updateP();
+
-
}
+
-
+
-
function minusButton() {
+
-
    //inXXput[my][mx] == 0 ? 0 : inXXput[my][mx]--;
+
-
    superM['top'][my][mx] == 0 ? 0 : superM['top'][my][mx]--;
+
-
    updateP();
+
-
}
+
-
+
-
let pjX = -8;
+
-
+
-
if (settings['projection']['top']) {
+
-
    projection('top', pjX, 8, true);
+
-
    pjX += 3.5;
+
-
}
+
-
if (settings['projection']['south']) {
+
-
    projection('south', pjX, 8, true);
+
-
    pjX += 2.5
+
-
}
+
-
if (settings['projection']['east']) {
+
-
    projection('east', pjX, 8, true);
+
-
    pjX += 2.5;
+
-
}
+
-
if (settings['projection']['north']) {
+
-
    projection('north', pjX, 8, false);
+
-
    pjX += 2.5;
+
-
}
+
-
if (settings['projection']['west']) {
+
-
    projection('west', pjX, 8, false);
+
-
    pjX += 3.5;
+
-
}
+
-
if (settings['projection']['base']) {
+
-
    projection('base', pjX, 8, false)
+
-
}
+
-
+
-
function updateP() {
+
-
    if (settings['projection']['update']) {
+
-
        copyM(superM['north'], northP());
+
-
        copyM(superM['south'], southP());
+
-
        copyM(superM['east'], eastP());
+
-
        copyM(superM['west'], westP());
+
-
        copyM(superM['base'], baseP());
+
-
    }
+
-
}
+
-
+
-
function copyM(A, B) {
+
-
    for (let i = 0; i < 3; i++)
+
-
        for (let j = 0; j < 3; j++)
+
-
            A[i][j] = B[i][j];
+
-
}
+
-
+
-
+
-
superM['top'] = active;
+
-
updateP();
+
-
+
-
let initSuperM = {
+
-
    'top': [[0, 0, 0], [0, 0, 0], [0, 0, 0]],
+
-
    'north': [[0, 0, 0], [0, 0, 0], [0, 0, 0]],
+
-
     'south': [[0, 0, 0], [0, 0, 0], [0, 0, 0]],
+
-
    'west': [[0, 0, 0], [0, 0, 0], [0, 0, 0]],
+
-
    'east': [[0, 0, 0], [0, 0, 0], [0, 0, 0]],
+
-
    'base': [[0, 0, 0], [0, 0, 0], [0, 0, 0]]
+
-
};
+
-
copyM(initSuperM['south'], southP());
+
-
+
-
+
-
function projection(mx, x, y, lft) {
+
-
     let M = superM[mx];
+
-
    for (let i = 0; i < 3; i++) {
+
-
        for (let j = 0; j < 3; j++) {
+
-
            board.create('point', [x + (j / 2) * 1.1, y + (i / 2) * 1.1], {
+
-
                name: '', face: '[]', strokeWidth: 2 * factor, strokeColor: 'gray', fillColor: () => {
+
-
                    return (M[i][j] > 0) ? col[mx] : '#eeeeee';
+
-
                }, size: 11 * factor, highlight: false, fixed: true, showinfobox: false
+
-
            });
+
-
        }
+
-
    }
+
-
    board.create('point', [x - 0.25 + (lft ? -0.05 : 1.65), y - 0.3], {
+
-
        name: '',
+
-
        size: 4 * factor,
+
-
        fixed: true,
+
-
        fillColor: '#000000',
+
-
        strokeWidth: 0,
+
-
        highlight: false,
+
-
        showinfobox: false
+
-
    });
+
-
}
+
-
+
-
let trKeys = view.create('transform3d', [() => {
+
-
    (mx >= 3) ? mx = 2 : (mx < 0) ? mx = 0 : mx;
+
-
    return mx;
+
-
}, () => {
+
-
    (my >= 3) ? my = 2 : (my < 0) ? my = 0 : my;
+
-
    return my;
+
-
}, 0], {type: 'translate'});
+
-
+
-
let trSl = view.create('transform3d', [0, 0, 1], {type: 'translate'});
+
-
+
-
view.create('polyhedron3d', [markCube, [trKeys]], {
+
-
    fillColorArray: [col['button']],
+
-
    fillOpacity: 0.15,
+
-
    strokeColor: 'gray',
+
-
    strokeWidth: 3 * factor,
+
-
    dash: 2,
+
-
    visible: () => superM['top'][my][mx] < 1 ? true : false
+
});
});
-
view.create('polyhedron3d', [markCube, [trKeys, trSl]], {
+
 
-
    fillColorArray: [col['button']],
+
let baseCube8 = view.create('polyhedron3d', [
-
    fillOpacity: 0.15,
+
    [
-
     strokeColor: 'gray',
+
        [4, 10, 0], [3, 10, 0], [3, 8, 0], [4, 8, 0], [4, 10, 10], [3, 10, 10], [3, 8, 10], [4, 8, 10]
-
    strokeWidth: 3 * factor,
+
     ], [
-
    dash: 2,
+
        [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
-
    visible: () => superM['top'][my][mx] < 2 ? true : false
+
    ]
 +
], {
 +
    visible: true, color: 'lightblue', opacity: 1
});
});
-
view.create('polyhedron3d', [markCube, [trKeys, trSl, trSl]], {
+
 
-
    fillColorArray: [col['button']],
+
let baseCube9 = view.create('polyhedron3d', [
-
    fillOpacity: 0.15,
+
    [
-
    strokeColor: 'gray',
+
        [3, 10, 0], [0, 10, 0], [0, 7, 0], [3, 7, 0], [3, 10, 10], [0, 10, 10], [0, 7, 10], [3, 7, 10]
-
    strokeWidth: 3 * factor,
+
     ], [
-
     dash: 2,
+
        [0, 1, 2, 3], [0, 1, 5, 4], [1, 2, 6, 5], [2, 3, 7, 6], [3, 0, 4, 7], [4, 5, 6, 7]
-
    visible: () => superM['top'][my][mx] < 3 ? true : false
+
     ]
-
});
+
], {
-
view.create('polyhedron3d', [markCube, [trKeys, trSl, trSl, trSl]], {
+
     visible: true, color: 'white', opacity: 1
-
     fillColorArray: [col['button']],
+
-
     fillOpacity: 0.15,
+
-
    strokeColor: 'gray',
+
-
    strokeWidth: 3 * factor,
+
-
    dash: 2
+
});
});
-
+
 
-
function initBoard3D(b) {
+
-
+
-
    let v = b.create('view3d', [[-4 - (settings['navigation']['visible'] ? 2 : 0), -6.25], [9, 9], [[0, 3], [0, 3], [0, 3]]],
+
-
        {
+
-
            projection: 'parallel',
+
-
            trackball: false,
+
-
            depthOrder: {enabled: true},
+
-
            axesPosition: 'center',
+
-
            xAxis: {visible: false},
+
-
            yAxis: {visible: false},
+
-
            zAxis: {visible: false},
+
-
            xPlaneRear: {
+
-
                visible: false
+
-
            },
+
-
            yPlaneRear: {
+
-
                visible: false
+
-
            },
+
-
            zPlaneRear: {
+
-
                visible: false
+
-
            },
+
-
            el: {
+
-
                pointer: {enabled: settings['navigation']['elevation']},
+
-
                keyboard: {enabled: settings['navigation']['elevation']}
+
-
            },
+
-
            az: {
+
-
                pointer: {enabled: settings['navigation']['azimuth']},
+
-
                keyboard: {enabled: settings['navigation']['azimuth']}
+
-
            }
+
-
        }
+
-
    );
+
-
+
-
    v.setView(settings['navigation']['view'][0] + Math.PI, settings['navigation']['view'][1], 0);
+
-
+
-
    return v;
+
-
}
+
-
+
-
function boardAttr() {
+
-
    let bA = {
+
-
        boundingbox: [-10, 10, 10, -10],
+
-
        keepaspectratio: true,
+
-
        axis: false,
+
-
        showcopyright: false,
+
-
        shownavigation: false,
+
-
        movetarget: false,
+
-
        pan: {
+
-
            enabled: false
+
-
        },
+
-
        browserpan:false,
+
-
        zoom: {
+
-
            enabled: false,
+
-
        },
+
-
        keyboard: {
+
-
            enabled: false
+
-
        }
+
-
    };
+
-
    return bA;
+
-
}
+
-
+
-
function compareM(m) {
+
-
    let b = true;
+
-
    for (let i = 0; i < 3; i++)
+
-
        for (let j = 0; j < 3; j++) {
+
-
            if (superM[m][i][j] == 0) {
+
-
                if (initSuperM[m][i][j] != 0)
+
-
                    b = false;
+
-
            } else {
+
-
                if (initSuperM[m][i][j] == 0)
+
-
                    b = false;
+
-
            }
+
-
        }
+
-
    return b;
+
-
}
+
-
+
-
function copyS() {
+
-
    copyM(initSuperM['top'], topP());
+
-
    copyM(initSuperM['north'], northP());
+
-
    copyM(initSuperM['south'], southP());
+
-
    copyM(initSuperM['west'], westP());
+
-
    copyM(initSuperM['east'], eastP());
+
-
    copyM(initSuperM['base'], baseP());
+
-
}
+
-
+
-
// output data for LMS, additional binding to LMS necessary
+
-
+
-
function output() {
+
-
    let out = [];
+
-
    copyS();
+
-
+
-
+
-
    if (settings['output']['top']) {
+
-
        out.push('' + compareM('top'));
+
-
    }
+
-
+
-
    if (settings['output']['north']) {
+
-
        out.push('' + compareM('north'));
+
-
    }
+
-
+
-
    if (settings['output']['east']) {
+
-
        out.push('' + compareM('east'));
+
-
    }
+
-
+
-
    if (settings['output']['south']) {
+
-
        out.push('' + compareM('south'));
+
-
    }
+
-
+
-
    if (settings['output']['west']) {
+
-
        out.push('' + compareM('west'));
+
-
    }
+
-
+
-
    if (settings['output']['base']) {
+
-
        out.push('' + compareM('base'));
+
-
    }
+
-
+
-
    if (settings['output']['matrix']) {
+
-
        out.push(JXG.evaluate(() => {
+
-
            return '[[' + active[0] + '],[' + active[1] + '],[' + active[2] + ']]';
+
-
        }));
+
-
    }
+
-
+
-
    return out.toString();
+
-
}
+
-
+
-
// output events, binding to LMS
+
-
+
-
function setOutput() {
+
-
    document.getElementById('outputID').innerHTML = output();
+
-
}
+
</jsxgraph>
</jsxgraph>

Aktuelle Version vom 14:25, 8. Sep. 2025

Von „https://www.technikundkultur.de/wiki1/index.php5?title=Testseite_JSXGraph“
Persönliche Werkzeuge