Dieses Repo stellt Visualisierungsfunktionen für das Projekt Steel Cloud 3D zur Verfügung.
Zur Verwendung des erstellten Codes genügt es, die Datei bundle.js aus dem Ordner /dist herunterzuladen und im <script>
-Tag einzubinden. Anschließend kann über die Variable steelcloud3d_viz
auf die Funktionen zugegriffen werden.
- Um am Projekt mit zu arbeiten, muss zunächst ein Account angelegt werden.
- Installation von Git - Alternativ kann das komfortablere GitHub Desktop mit grafischer Benutzeroberfläche heruntergeladen werden.
- Forken des Projekts.
- Dateien bearbeiten, hinzufügen, etc.
- Änderungen pushen.
- Pull-Request erstellen.
Um den Code weiter bearbeiten oder nutzen zu können, muss Node.js installiert sein. Mit dem Terminal-Befehl npm install
wird die Entwicklungsumgebung vorbereitet und alle notwendigen Tools installiert.
Dieses Projekt ist modular aufgebaut. Es werden einzelne Klassen definiert, die jeweils einen Visualisierungstypen bereitstellen und einer gemeinsamen Schnittstelle entsprechen.
Die Kernkomponenten sind im Verzeichnis src
zu finden.
Die Datei index.ts
ist der Einstiegspunkt in den Code. Hier werden die einzeln definierten Visualisierungsfunktionen gebündelt exportiert.
In der Datei common.ts
sind Anforderungen und Schnittstellen festgelegt, denen alle weiteren Klassen genügen sollten.
Die Datei inStock.ts
enthält eine beispielhafte Implementierung für die Visualisierung von Lagerbeständen.
Enthält die von Webpack generierte bundle.js
.
Enthält eine HTML-Datei, mit der die Visualisierungen überprüft werden können.
- Typescript: Ein Überbau für JavaScript. Ermöglicht die Nutzung von Typen, Klassen und Modulen und wird zu nativem JavaScript kompiliert.
- Webpack: Bündelt mehrere JavaScript-Dateien in eine einzelne Datei, die im Browser eingebunden werden kann. Übersetzt gleichzeitig den node.js-"Dialekt" in browsertaugliches JS.
- d3.js: Eine JS-Bibliothek zur Datenvisualisierung.
- plotly.js?: Ebenfalls eine Bibliothek zur Datenvisualisierung. Setzt auf d3 auf und erlaubt zusätzlich die Erstellung von 3D-Grafiken.
Noch nicht installierte Frameworks und Bibliotheken können mit dem Befehl npm install <name> --save
installiert und als Dependencies eingebunden werden.