Seitenhistorie

Framework

http://d3js.org soll für die Visualisierung verwendet werden.

Galerie: https://github.com/mbostock/d3/wiki/Gallery

Tutorials: https://github.com/mbostock/d3/wiki/Tutorials

Einstieg: http://bost.ocks.org/mike/bar/ (Beispiel: http://codepen.io/mbostock/pen/Jaemg)

Einbindung in den Nuclos Webclient (zu prüfen)

NVD3
https://github.com/angularjs-nvd3-directives/angularjs-nvd3-directives -> http://nvd3.org
(Beispiel: http://fiddle.angularjs.de/#/9270086)
Manuell
http://bl.ocks.org/biovisualize/5372077

Anforderungen

Typen	(Englisch)
Säulendiagramm	Column Chart
Balkendiagramm	Bar Chart
Liniendiagramm	Line Chart
Kombiniertes Säulen- / Liniendiagramm	Combined Column / Line Chart
Kuchendiagramm	Pie Chart
Streudiagramm (Fliegenschiss )	Scatter Chart
Tacho	Speedometer

Verwendung

Die Verwendung von Diagrammen soll in verschiedenen Bereichen möglich sein.

1. In einem Business Objekt

Ein Diagramm kann in diesem Fall seine Daten nur von Unterformularen beziehen. Hierfür können auch Dynamische BOs verwendet werden, um z.b. zu Gruppieren und zu Summieren. Es wird eine neue Möglichkeit benötigt, solche BOs anzulegen und zu berechtigen, ohne das sie in einem Layout konfiguriert werden müssten. Ein Nuclet soll damit Vorlagen für Diagramme mitliefern, wobei ein User selbst entscheiden kann, welche er in welchem Format konfiguriert.

2. In einer Sideview / Listview

Ein Suchkriterium oder Suchfilter sollte die Basis eines Diagrammes sein. Unklar ist jedoch noch, wie man eine Gruppierung ermöglicht. Vielleicht über eine Erweiterung des QueryProviders. Eine Nutzung im BO (Punkt 1.) könnte dann auch ohne dynamische BOs auskommen. Allerdings muss der User schon wissen was er da macht. Als Alternative könnte man auch noch über Report-Datenquellen nachdenken, die einem BO zugewiesen werden können. Aktuell gibt es noch gar keine Reports im Webclient.

3. Im Dashboard (gibt es noch nicht)

Wäre eine Willkommensansicht mit Diagrammen im Webclient nicht schön?

Konfigurationsbeispiel

Codeblock

language	js
theme	FadeToGrey
title	chart.json
collapse	true

{
	"chartLabel": {"de": "Umsatzanalyse", "en": "sales analysis"},
	"primaryChart": {
		"chartType": "(Column|Bar|Line|Pie|Scatter|Speedometer)",
		"boMetaId": "com_buymore_Umsaetze",
		"categoryAttrId": "com_buymore_Umsaetze_umsatzjahr",
		"categoryLabel": {"de": "Jahr"},
		"scaleLabel": {"de": "TEuro"},
		"series": [
			{
				"boAttrId": "com_buymore_Umsaetze_umsatz",
				"label": {"de": "Umsatz"},
				"color": "#000000"
			}, 
			{
				"boAttrId": "com_buymore_Umsaetze_gewinn",
				"label": {"de": "Gewinn"},
				"color": "#222222"
			}
		],
 
		"searchTemplate": [
			{
				"label": "Jahr von",
				"boAttrId" : "com_buymore_Umsaetze_umsatzjahr",
				"comparisonOperator": ">=",
				"mandatory": true
			},
			{
				"label": "bis",
				"boAttrId" : "com_buymore_Umsaetze_umsatzjahr",
				"comparisonOperator": "<=",
				"mandatory": true
			},
			{
				"label": "Artikelkategorie",
				"boAttrId" : "com_buymore_Umsaetze_kategorie",
				"comparisonOperator": "=",
				"mandatory": true,
				"dropdown": true
			}
		]
	},
	"secondaryChart": {
		"chartType": "Line",
		"useCombinedScaleWithPrimary": false,
		"boMetaId": "com_buymore_Arbeitsleistung",
		"categoryAttrId": "com_buymore_Arbeitsleistung_jahr",
		"scaleLabel": {"de": "h"},
		"series": [
			{
				"boAttrId": "com_buymore_Arbeitsleistung_stunden",
				"color": "#777777"
			} 
		]
	}
}

Notizen

nur zur Auswahl stellen was Sinn macht

Arbeitspakete

Paket	Aufwand in Tagen	Erledigt
Version 0.1 Demonstration fertiger Diagramme
Einbindung prüfen		x
Neue JSON Struktur zur Ablage solch einer Diagrammkonfiguration. Möglicherweise neues Konzept für "Preferences" aller Art.		x
Strukturdefinition		x
Nuclos Kern Erweiterung		x
Rest Erweiterung		x
Rendern der Diagramme im Webclient		x
Integration Chartkomponente	2	x
Diagrammauswahl über Tabs	3	x
Integration Preferences-Service in Webclient (Lesen/Schreiben/Löschen)	1	x
Typescript Buildprozess erweitern	0,5	x
Version 0.2 Erste Lieferung (Interaktivität, Filterung)
Diagramm-Datenquellen sollen einem Benutzer ebenfalls als "Datenherkunft" angeboten werden. Hierfür muss in der Datenquelle das Attribut "Eltern-Businessobjekt" (NEU) gesetzt sein. Für BOs mit Statusmodell muss zusätzlich im Statusmodell eine Berechtigung vergeben werden, ähnlich den Unterformularen.	0,5	x
Filterung der Daten		x
Server		x
Client (nur Benutzung der im Diagramm konfigurierten Filtermöglichkeiten)		x
~~Timestamp Problem muss noch behoben werden~~ Wird umgangen: Timestamp wird in Chart als Kategorie zwar angezeigt, gefiltert wird aber über ein zusätzliches Date Attribut (hat vom Prinzip her den gleichen Inhalt). Wieder mal ein Workaround zum Thema Timestamp...		x
Konfiguration der Diagramme
Typ: 4-Quadranten-Diagramm
Typ: Kombiniertes Säulen- / Liniendiagramm
Preferences Sharing, Berechtigung und Nucletzuweisung (derzeit hat jeder Benutzer seine eigenen Prefs / Diagrammkonfigurationen)		x
Analyse		x
Server		x
Klick / Touch auf einen Punkt, Balken etc. soll Details anzeigen. Verwendung 1 (im BO):	1,5	x
Normales SubBO: Wenn Layout und Berechtigung existiert.		x
Dynamisches BO/ Chart DS: Allgemein gilt, prüfe wie normales SubBO, jedoch verwende die MetaId aus boMeta.detailBoMetaId (NEU in den Metadaten) wenn vorhanden. Letzteres wird in der Datenquelle konfiguriert.		x
Version 1.0
Konfiguration der Diagramme
Farbauswahl
Diagrammtyp-Auswahl
weitere komplexe Diagramm-Typen (Tacho, Kombiniertes Säulen- / Liniendiagramm)
Datenherkunft und Filtermöglichkeiten
weiter Konfiguration (Breite, Höhe, Beschriftung, ...) ?
Preferences Sharing - Teil II
Client
Version 2.0
Verwendung 2. u. 3.
Interaktivität
Spätestens jetzt benötigen wir eine Gruppierungsfunktion auf eine BOs Liste. Dies wird dann auch für Verwendung 1 interessant, da nicht unbedingt dynamische BOs gebaut werden müssen.

Seitenhierarchie

Versionen im Vergleich

Alte Version 1

Neue Version 2

Schlüssel