Sprache: Deutsch · English

Charts

Diagramme visualisieren Kennzahlen direkt im Webclient. Die Konfiguration erfolgt per JSON; ein Diagramm bezieht seine Daten aus Unterformularen bzw. (dynamischen) Business-Objekten.

Diagrammtypen

Verwendung

• In einem Business-Objekt: Daten aus Unterformularen – auch dynamische BOs (zum Gruppieren/Summieren) sind möglich; ein Nuclet kann Diagrammvorlagen mitliefern.
• In einer Sideview/Listview: über Such-/Filterkriterien.

Konfiguration (JSON)

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)

1. NVD3
   https://github.com/angularjs-nvd3-directives/angularjs-nvd3-directives -> http://nvd3.org
   (Beispiel: http://fiddle.angularjs.de/#/9270086)
2. 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

...

{
	"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"
			} 
		]
	}
}

Verwandte Seiten