Zum Inhalt springen

Änderungen von Dokument Interaktiv Besondere Geraden

Zuletzt geändert von Holger Engels am 2024/11/03 09:44
Von Version 4.1
bearbeitet von Holger Engels
am 2024/11/03 09:44
Änderungskommentar: Neuen Anhang linear-function-main-form.html hochladen
Auf Version 1.1
bearbeitet von Holger Engels
am 2024/11/03 09:39
Änderungskommentar: Es gibt keinen Kommentar für diese Version

Zusammenfassung

Details

Seiteneigenschaften
Inhalt
... ... @@ -1,3 +1,3 @@
1 -{{html clear="false"}}
2 -<iframe style="width: 100%; min-width: 350px; max-width: 450px; aspect-ratio: 1; border: none" src="/xwiki/bin/download/Eingangsklasse/BPE_1_4/Interaktiv%20Besondere%20Geraden/WebHome/linear-function-main-form.html?rev=1.1"></iframe>
1 +{{html wiki="true"}}
2 +<iframe style="width: 100%; min-width: 350px; max-width: 450px; aspect-ratio: 1; border: none" src="[[attach:linear-function-main-form.html]]"></iframe>
3 3  {{/html}}
linear-function-main-form.html
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.holgerengels
Größe
... ... @@ -1,1 +1,0 @@
1 -3.2 KB
Inhalt
... ... @@ -1,96 +1,0 @@
1 -<!doctype html>
2 -<html lang="de">
3 -<head>
4 - <title>Lineare Funktion - Hauptform</title>
5 - <meta charset="utf-8">
6 - <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
7 - <link rel='stylesheet' type='text/css' href='https://cdn.jsdelivr.net/npm/jsxgraph@latest/distrib/jsxgraph.css'/>
8 - <script src='https://cdn.jsdelivr.net/npm/jsxgraph@latest/distrib/jsxgraphcore.js' type='text/javascript'></script>
9 -
10 - <style>
11 - body {
12 - margin: 0px;
13 - padding: 0px;
14 - overflow: hidden;
15 - }
16 - .container {
17 - display: grid;
18 - grid-template-columns: 1fr;
19 - position: relative;
20 - }
21 - .jxgbox { border-radius: 0px; border: none}
22 - </style>
23 -</head>
24 -<body>
25 -
26 -<div class="container">
27 - <div id='board' class='jxgbox' style='width: 100%; aspect-ratio: 1'></div>
28 -</div>
29 -
30 -<script type='text/javascript'>
31 - var board = JXG.JSXGraph.initBoard('board', {boundingbox: [-5, 5, 5, -5], axis: true, showNavigation: false, showZoom: false, showCopyright: false, pan: { enabled: false}});
32 - var a = board.create('point', [-1, -1], {visible: true, name: 'A', snapToGrid: true, snapSizeX: .5, snapSizeY: .5});
33 - var b = board.create('point', [1, 1], {visible: true, name: 'B', snapToGrid: true, snapSizeX: .5, snapSizeY: .5});
34 - var g = board.create('line', [a, b], {});
35 - var p1 = board.create('point', [0, -5], {visible: false,});
36 - var p2 = board.create('point', [0, 5], {visible: false});
37 - var l = board.create('line', [p1, p2], {visible: false});
38 - var i = board.create('intersection', [g, l], {visible: false});
39 -
40 -
41 - var text = board.create('text', [.5, -4.5, () => {
42 - if (a.X() === b.X())
43 - return "keine Funktion!";
44 -
45 - let dx = b.X() - a.X();
46 - let dy = b.Y() - a.Y();
47 - let m = dy/dx;
48 - let mi = dy%dx === 0;
49 - let e = "f(x) = ";
50 -
51 - if (m === 0)
52 - return "f(x) = " + b.Y();
53 - else if (m === 1)
54 - e += "x";
55 - else if (m === -1)
56 - e += "-x";
57 - else if (mi)
58 - e += m + "x";
59 - else {
60 - if (Math.floor(dx) + .5 === dx || Math.floor(dy) + .5 === dy) {
61 - dx *=2;
62 - dy *=2;
63 - }
64 - e += (dy / dx < 0 ? "-" : "") + Math.abs(dy) + "/" + Math.abs(dx) + "x";
65 - }
66 - let tz = - dy * b.X() + b.Y() * dx;
67 - tz *=4;
68 - if (tz !== 0) {
69 - let tn = dx * 4;
70 - let ts = tz * tn >= 0;
71 - let t = (!ts ? " - " : " + ") + reduceFraction(Math.abs(tz), Math.abs(tn));
72 - e += t;
73 - }
74 - return e;
75 - }], {fontSize: 1.1, fontUnit: 'em', color: '#D55E00', cssStyle: 'background-color: white'});
76 -
77 - function reduceFraction(numOne, numTwo) {
78 - var result = '';
79 - for (var i = Math.max(numOne, numTwo); i > 1; i--) {
80 - if ((numOne % i == 0) && (numTwo % i == 0)) {
81 - numOne /= i;
82 - numTwo /= i;
83 - }
84 - }
85 - if (numTwo === 1) {
86 - result = numOne.toString()
87 - } else {
88 - result = numOne.toString() + '/' + numTwo.toString()
89 - }
90 - return result
91 - }
92 -</script>
93 -
94 -</body>
95 -</html>
96 -