Zum Inhalt springen

Änderungen von Dokument Interaktiv Skizzieren

Zuletzt geändert von Holger Engels am 2024/10/06 16:24
Von Version 2.1
bearbeitet von Holger Engels
am 2024/10/06 16:20
Änderungskommentar: Neuen Anhang power-function.html hochladen
Auf Version 1.1
bearbeitet von Holger Engels
am 2024/10/06 16:20
Änderungskommentar: Es gibt keinen Kommentar für diese Version

Zusammenfassung

Details

power-function.html
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.holgerengels
Größe
... ... @@ -1,1 +1,0 @@
1 -2.5 KB
Inhalt
... ... @@ -1,49 +1,0 @@
1 -<!doctype html>
2 -<html lang="de">
3 -<head>
4 - <title>Potenzfunktion</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 - <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.css" crossorigin="anonymous">
11 - <script src="https://cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.js" crossorigin="anonymous"></script>
12 -
13 - <style>
14 - body {
15 - margin: 0px;
16 - padding: 0px;
17 - overflow: hidden;
18 - }
19 - .container {
20 - display: grid;
21 - grid-template-columns: 1fr;
22 - position: relative;
23 - }
24 - .jxgbox { border-radius: 0px; border: none}
25 - </style>
26 -</head>
27 -<body>
28 -
29 -<div class="container">
30 - <div id='board' class='jxgbox' style='width: 100%; aspect-ratio: 1'></div>
31 -</div>
32 -
33 -<script type='text/javascript'>
34 - var board = JXG.JSXGraph.initBoard('board', {boundingbox: [-8, 8, 8, -8], axis: true, showNavigation: false, showZoom: false, showCopyright: false, pan: { enabled: false}});
35 -
36 - var n = board.create('slider', [[1.5, -7], [6, -7], [-4, 2, 5]], { snapWidth: 1, size: 4, ticks: { ticksDistance: 1, insertTicks: false, drawLabels: true, label: {fontSize: 1, fontUnit: 'em', offset: [-4, -16], } }, name: 'n', digits: 0, label: {fontSize: 1, fontUnit: 'em', cssClass: 'term'}});
37 - var para = board.create('functiongraph', [(x) => JXG.Math.ratpow(x, n.Value(), 1)], {strokeWidth: 3, strokeColor: JXG.palette.green});
38 - var hype = board.create('functiongraph', [(x) => JXG.Math.ratpow(x, -n.Value(), 1)], {strokeWidth: 3, strokeColor: JXG.palette.blue});
39 - var root = board.create('functiongraph', [(x) => JXG.Math.ratpow(x, 1, n.Value())], {strokeWidth: 3, strokeColor: JXG.palette.red});
40 -
41 - var parat = board.create('text', [1.5, -5, () => `\\large p(x)=x^${n.Value()}`], { cssClass: 'term', fixed: true, useKatex: true, color: JXG.palette.green });
42 - var hypet = board.create('text', [1.5, -4, () => `\\large h(x)=x^{${-n.Value()}}`], { cssClass: 'term', fixed: true, useKatex: true, color: JXG.palette.blue });
43 - var roott = board.create('text', [1.5, -3, () => `\\large r(x)=x^{\\frac{1}{${n.Value()}}}`], { cssClass: 'term', fixed: true, useKatex: true, color: JXG.palette.red });
44 -
45 -</script>
46 -
47 -</body>
48 -</html>
49 -