Wiki-Quellcode von JSXGraph Objekte nutzen
Version 8.1 von Carina Enke am 05.11.2024
Zeige letzte Bearbeiter
| author | version | line-number | content |
|---|---|---|---|
| 1 | {{section}} | ||
| 2 | {{column width="60%"}} | ||
| 3 | [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] ONYX unterstützt die Einbindung von JSXGraph Objekten. | ||
| 4 | |||
| 5 | JSXGraph ist eine JavaScript-Bibliothek zur Erstellung interaktiver mathematischer Grafiken und Diagramme im Web. JSXGraph-Objekte bilden die Grundlage von Visualisierungen und können verschiedene Formen wie Punkte, Linien, Kreise und Funktionsgraphen annehmen. Die Einbindung von JSXGraph-Objekten unterstützt eine Vielzahl von mathematischen und geometrischen Konstruktionen und erleichtert die Visualisierung komplexer mathematischer Konzepte. | ||
| 6 | {{/column}} | ||
| 7 | |||
| 8 | {{column width="30%"}} | ||
| 9 | {{panel title="Inhalt"}} | ||
| 10 | {{toc start="2"/}} | ||
| 11 | {{/panel}} | ||
| 12 | |||
| 13 | {{panel title="Verwandte Themen"}} | ||
| 14 | * [[3D-Objekt einbinden>>doc:ONYX.Erstellung von Testinhalten.Aufgaben.Medien einbinden.3D-Objekte einbinden.WebHome]] | ||
| 15 | {{/panel}} | ||
| 16 | |||
| 17 | {{panel title="Weiterführende Inhalte"}} | ||
| 18 | * [[JSXGraph (Uni Bayreuth)>>https://jsxgraph.uni-bayreuth.de/wp/index.html]] | ||
| 19 | {{/panel}} | ||
| 20 | {{/column}} | ||
| 21 | {{/section}} | ||
| 22 | |||
| 23 | == JSXGraph-Objekt im Editor einbinden == | ||
| 24 | |||
| 25 | Sie können JSX-Objekte in alle Bereiche einbinden in denen der HTML-Editor verfügbar ist und das JSX-Icon [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] zu sehen ist. | ||
| 26 | |||
| 27 | Öffnen Sie die Aufgabe oder den Test, in dem ein JSX-Objekt eingebunden werden soll. Klicken Sie auf das Icon [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] im Kopfbereich des HTML-Editors. | ||
| 28 | |||
| 29 | [[image:Editor - JSX im Tiny_de.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]] | ||
| 30 | |||
| 31 | Es öffnet sich ein Dialog zum Bearbeiten des JSX-Objektes. Darin enthalten ist bereits der JavaScript-Code für ein JSX-Beispielobjekt. | ||
| 32 | |||
| 33 | [[image:Editor - JSX Dialog geöffnet_de.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]] | ||
| 34 | |||
| 35 | Tauschen Sie diesen Inhalt gegen Ihren eigenen JSX-Code aus. Informationen zur Erstellung von JSX-Objekten erhalten Sie auf den Webseiten des [[JSXGraph Projektes>>https://jsxgraph.uni-bayreuth.de/wp/index.html]]. | ||
| 36 | |||
| 37 | Mit Klick auf den Button Fertig wird das Objekt eingefügt. | ||
| 38 | |||
| 39 | [[image:Editor - JSX Objekt speichern_de.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]] | ||
| 40 | |||
| 41 | Im HTML-Editor wird ein eingefügtes JSX-Objekt mit dem Symbol [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] gekennzeichnet. | ||
| 42 | |||
| 43 | [[image:Editor - Aufgabenstellung mit JSX-Objekt_de.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]] | ||
| 44 | |||
| 45 | |||
| 46 | |||
| 47 | == Beispielaufgaben mit JSXGraph-Objekten == | ||
| 48 | |||
| 49 | Einige Beispielaufgaben und deren Erstellung wird auf folgenden Seiten erläutert: | ||
| 50 | |||
| 51 | * [[Beispielaufgabe Punkte im Koordinatensystem>>doc:.Beispiel Punkte im Koordinatensystem.WebHome]] | ||
| 52 | * [[Beispielaufgabe Schnittpunkt x-Achse>>doc:.Beispielaufgabe Schnittpunkt x-Achse.WebHome]] | ||
| 53 | * [[Beispielaufgabe Schnittpunkt x-Achse II>>doc:.Beispielaufgabe Schnittpunkt x-Achse II.WebHome]] | ||
| 54 | |||
| 55 | == Interaktivität des JSXGraph-Objekt ausprobieren == | ||
| 56 | |||
| 57 | Bereits im Editor wird bei der Konfiguration das Objektes im Dialog unter der JSXGraph-Beschreibung eine verkleinerte Vorschau angezeigt. Eine vollständige Vorschau mit allen eventuell zusätzlichen Medieninhalten erhalten Sie durch Aufruf der Vorschau der erstellten Aufgabe bzw. des Tests. Um das JSX-Objekt zu bewegen, halten Sie den Inhalt mit dem Mauszeiger fest und bewegen den Mauszeiger anschließend in die gewünschte Richtung. | ||
| 58 | |||
| 59 | == Bestehendes JSXGraph-Objekt bearbeiten == | ||
| 60 | |||
| 61 | Ein bereits eingebundenes JSX-Objekt können Sie wie folgt editieren: | ||
| 62 | |||
| 63 | Öffnen Sie die betreffende Aufgabe im Editor. Klicken Sie das Symbol [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] für das JSX-Objekt im Editorfeld an und wählen Sie anschließend die Schaltfläche [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] zum Bearbeiten eines JSX-Objektes in den Bearbeitungsoptionen aus. | ||
| 64 | |||
| 65 | [[image:Editor - JSX Objekt bearbeiten_de.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]] | ||
| 66 | |||
| 67 | Es öffnet sich der Dialog "JSX bearbeiten" und Sie können Ihre Anpassungen vornehmen. Mit Klick auf den Button Fertig im Dialog, werden die Änderungen gespeichert und übernommen. | ||
| 68 | |||
| 69 | == JSXGraph-Objekt in einem PDF-Dokument == | ||
| 70 | |||
| 71 | Bitte beachten Sie, dass ein JSX-Element **nicht** in einem PDF-Dokument dargestellt werden kann. Es erscheint an dessen Stelle ein allgemeines Icon. | ||
| 72 | |||
| 73 | == JSXGraph-Objekt in Auswertungsansichten == | ||
| 74 | |||
| 75 | Die Auswertungsdokumente des Testversuches eines Lernenden zeigen die individuellen JSX-Objekte an. In der Statistischen Auswertung jedoch kann das JSX-Element **nicht** dargestellt werden. Es erscheint an dessen Stelle das allgemeine Icon [[image:ONYX._Include Library.Onyx Icons und Buttons.WebHome@Icon_JSX.png||data-xwiki-image-style="img-icon" height="27" width="30"]] . | ||
| 76 | |||
| 77 |