Wikiversity

CSV2Chart

In dieser Lernressource werden mit einer AppLSAC Daten aus einer CSV-Datei (Comma-separated values) laden und ein Diagramm für Wikiversity-Lernressourcen erstellen. Die AppLSAC ist in der Lage, die Daten in eine JSON-Datei zu speichern und zu laden, die nicht nur die Rohdaten, sondern auch die Titel der Datenzeilen und die Farben der th-Kurven enthält.

Vorschau der erzeugten Graphen für die geladenen CSV-Dateien. Diese Vorschau wird genutzt, um das spätere Aussehen des Graphen beurteilen zu können
Eigenschaften editieren für den Graphen der geladenen CSV-Datei
Wikiversity-Diagramm-App: CSV2WikiChart für Wikiversity und Wikipedia[1]

Bemerkung Bearbeiten

Die textbasierte Erzeugung von Graphiken und Diagrammen ist gegenwärtig nicht verfügbar.

Ziel der Lernressource Bearbeiten

Diese Lernressource wurde am Rande von COVID-19 erstellt. Der Inhalt von COVID-19 in Wikiversity ist dynamisch aufgrund der zunehmenden Menge an wissenschaftlichen Erkenntnissen und Studien und aufgrund der Tatsache, dass die Daten zu COVID-19-Fällen täglich aktualisiert werden. Die tägliche Erstellung neuer Bilder für Grafiken und Diagramme und deren Speicherung in WikiCommons ist ziemlich ineffizient und verbraucht viel Speicherplatz im Vergleich zum Hinzufügen der neuen Daten in einer Zeichenfolge.

  • Diese Lernressource hilft Ihnen, Diagramme für Wikiversity-Lernressourcen auf der Grundlage von Daten in einer CSV-Datei zu erstellen.
  • Diese Lernressource kann als Vorlage für den Workflow zur Erstellung von Wikiversity-Tools als AppLSACs verwendet werden, die Autoren bei der Erstellung und Pflege von Lernressourcen mit dynamischen Daten unterstützen.
  • diese Lernressource ist ein vollständiger Anwendungsfall für die Anwendung von JSON2Schema und den entsprechenden Lernressource in Wikiversity].

Nutzen des Wikiversity-Tools CSV2Chart Bearbeiten

Sie können das CSV2Chart einfach im Browser starten. Als AppLSAC werden die Daten aus der CSV-Datei nicht auf einen Server geladen, sondern direkt im Browser verarbeitet. Sie können das testen, indem Sie das CSV2Chart-Tool als ZIP-Datei von GitHub unter der URL https://github.com/niebert/csv2wikichart_app/archive/master.zip herunterladen und dann die Datei index.html in ihrem Browser laden. Sie können dann auch offline die Konvertierung von CSV-Dateien in Wikiversity-Diagramme vornehmen.

Name der AppLSAC Bearbeiten

Die in dieser Lernressource erstellte AppLSAC wird "CVS2Chart" genannt werden, weil es Daten aus einer CSV-Datei als Eingabe nimmt und die CSV-Datei in ein Diagramm für Wikiversity konvertiert.

Exportierte Dateiformate Bearbeiten

 
CSV2Chart Diagramm speichern und exportieren Formate
 
Exportieren eines SVG-Bildes - Beispiel
  • Grafiken können als JSON-Datei gespeichert werden, die später aufgrund aktualisierter Daten geladen und geändert werden kann,
  • Zielexportformat sind Diagramme im Format, wenn Wiki Graph: Diagrammsyntax,
  • zusätzliches Exportformat SVG wurde aufgrund temporärer nicht verfügbarer Rendering-Funktion hinzugefügt. SVG-Format ist eine Vektorgrafik.

Beispiel für die CSV2Chart-Ausgabe Bearbeiten

Unter COVID-19 Mathematische Modellierung] finden Sie ein grundlegendes Beispiel für die Verwendung von Diagrammen in Lernressourcen und wie die Diagramme mit einer Vorlage (Template) in einer Wikiversity-Lernressource eingebettet werden können.

  • Wenn Sie die AppLSAC in ihrem Browser gestartet haben, können Sie diese WebApp CSV2WikiChart für die Aktualisierung von Diagrammen in Wikiversity-Lernressourcen verwenden. Sie werden in der Lage sein, das aktualisierte CSV zu laden und das neue Diagramm aus CSV2Chart zu exportieren. Die Einstellung für die Farben und x-Achsen können ebenfalls in eine dazugehörige JSON-Datei gespeichert werden, die neben den Daten aus der CSV-Datei auch die Formatierungsinformationen für das Diagramm gespeichert werden. Für das Update von sich dynamisch verändernden Daten (wie z.B. zu der COVID-19 Lernressource) können so Daten im Wiki-Quelltext aktualisiert werden anstatt Bilddatei aus WikiCommons neu hochzuladen.
  • Das folgende Diagramm ist also kein Bild, sondern es sind Daten aus eine CSV-Datei, die mit der CSV2WikiChart-App generiert wurden. Die Ausgabe ist ein Textbaustein, der einen Vorlagenaufruf von dem Template Graph:Chart erzeugt, das das Diagramm auf der Grundlage der CSV-Daten mit der Vorlage erstellt.


The graph uses a logarithmic scale on the y-axis. yAxisMin was set to 0.5 to avoid display problems for y-values equal to 0 ( .

Lernbeispiel Bearbeiten

Wir werden in dieser Lernaufgabe ein AppLSAC erstellen, das Daten in einer CSV-Datei in ein Diagramm konvertiert, das in Lernressourcen verwendet werden kann.

  • Starten Sie CSV2WikiChart in Ihrem Browser als AppLSAC. Exportieren Sie die generierte Ausgabe. Die WebApp enthält einige Demo-Daten für Ihren ersten Export.
  • Erstellen Sie Ihr CSV z.B. in LibreOffice und lassen Sie sich das generierte Diagramm in CSV2WikiChart in einer Vorschau anzeigen. Ändern Sie einige Einstellungen und sehen Sie, wie das exportierte Diagramm in MorrisJS aussieht. Es fehlen einige Funktionen von MorrisJS, um eine ähnliche Ansicht des Endergebnisses in Wikiversity zu erstellen.

Beispiel-Export Bearbeiten

Im Vergleich zum obigen Diagramm sind hier zwar die Daten identisch, aber die Skalierung der y-Achse ist hier linear und logarithmisch, wie im obigen Diagramm. Diese Einstellung können in der JSON-Datei in CSV2WikiChart abgespeichert werden.

Motivation Bearbeiten

Angenommen, Ihnen liegen COVID-19 Daten über die epidemiologische Ausbreitung der Krankheit vor, die täglich auf Wikipedia in einer Kurve aktualisiert werden. Es ist wirklich sehr zeitaufwendig, die Daten in eine Kurve umzuwandeln und das Bild der Darstellung der Kurve zu aktualisieren. Dazu ist eine neue Version des Bildes auf WikiCommons erforderlich. Die zugrunde liegende Idee ist also, eine CSV-Datei mit den Daten zu verwenden und die Daten direkt in der Graph-Template zu aktualisieren. Im Allgemeinen können Tabellenkalkulationsdaten für Lernressourcen in Wikiversity vorbereitet und aktualisiert werden.

Aktueller Status des AppLSAC Bearbeiten

Eine beta-Version des AppLSAC ist verfügbar unter GitHub csv2wikichart_app. Der Export der Graph und Diagramme von CSV2WikiChart[2] verwendet die Graph-Chart-Vorlage für die Darstellung der Diagramme.

Hintergrundtheorie Bearbeiten

  • (JSON) Lernen Sie JSON als JavaScript-Objektnotation, um Daten in WebApps zu speichern und zu laden.
  • (JSON Editor) Erfahren Sie mehr über webbasierte Anwendungen (WebApps), mit denen Daten in einem JSON-Datencontainer geladen, gespeichert und geändert werden können.
  • (AppLSAC) Erfahren Sie mehr über AppLSAC|AppLSAC webbasierte Anwendungen, die keine Internet-Konnektivität benötigen und in Ihrem Browser als Laufzeitumgebung laufen.
  • (JSON-Schema)' Erfahren Sie mehr über das JSON-Schema - siehe JSON-Schema - Schritt-für-Schritt-Tutorial[3]
  • (Vorschau des Graphen[4]) Die Vorschau der Daten im Diagramm sollte möglich sein, so dass das Diagramm überprüft werden kann, ohne dass das Diagramm in Wikiversity oder Wikipedia gerendert werden muss. OpenSource-Bibliotheken in Javascript müssen identifiziert werden, die das Rendern der Daten in der Grafik ermöglichen (z.B. MorrisJS).

Siehe auch Bearbeiten

Quellennachweise Bearbeiten

  1. ↑ CSV2WikiChart (2019) Bert Niehaus, Wikiversity Support Tool as WebApp for Charts in Learning resources - URL: https://niebert.github.io/csv2wikichart_app/ ZIP of AppLSAC: https://github.com/niebert/csv2wikichart_app/archive/master.zip (accessed 2021/12/06)
  2. ↑ CSV2WikiChart (2020) Support-Tool for Wikiversity-Learning Resources - URL: https://niebert.github.io/csv2wikichart_app/ (accessed 2020/11/27)
  3. ↑ Web Portal JSON Schema: Getting Started Step-By-Step (en) 2020. Abgerufen am 10. August 2020..
  4. ↑ Olly Smith: Javascript Graph Rendering Library morris.js. 2013. Abgerufen am 5. Oktober 2020..
Abgerufen von „https://de.wikiversity.org/w/index.php?title=CSV2Chart&oldid=932217“