Dashboards

Bei der Verwendung von AEM können Sie viele Inhalte verschiedener Art (z. B. Seiten, Assets) verwalten. AEM-Dashboards stellen eine benutzerfreundliche, anpassbare Methode dar, Seiten zu definieren, in denen konsolidierte Daten angezeigt werden.

HINWEIS

AEM-Dashboards werden benutzerabhängig erstellt. Das bedeutet, dass ein Benutzer nur auf seine eigenen Dashboards zugreifen kann.

Allerdings können Dashboard-Vorlagen für die Freigabe der gemeinsamen Konfiguration und des Dashboard-Layouts verwendet werden.

chlimage_1-22

Verwalten von Dashboards

Erstellen eines Dashboards

Um ein neues Dashboard zu erstellen, gehen Sie wie folgt vor:

  1. Klicken Sie im Bereich Tools auf Konfigurationskonsole.
  2. Doppelklicken Sie in der Struktur auf Dashboard.
  3. Klicken Sie auf Dashboard.
  4. Geben Sie den Titel (z. B. „Mein Dashboard“) und den Namen ein.
  5. Klicken Sie auf Erstellen.

Klonen eines Dashboards

Möglicherweise möchten Sie mehrere Dashboards, um die Informationen zu Ihrem Inhalt aus verschiedenen Perspektiven zu betrachten. Zur Unterstützung der Erstellung eines neuen Dashboards stellt AEM eine Klonfunktion bereit, die Sie zum Duplizieren eines vorhandenen Dashboards verwenden können. Um ein Dashboard zu klonen, gehen Sie wie folgt vor:

  1. Klicken Sie im Bereich Tools auf Konfigurationskonsole.

  2. Klicken Sie im Baum auf Dashboard.

  3. Klicken Sie auf das Dashboard, das Sie klonen möchten.

  4. Klicken Sie auf Klonen.

  5. Geben Sie den Namen des neuen Dashboards ein.

Entfernen von Dashboards

  1. Klicken Sie im Bereich Tools auf Konfigurationskonsole.

  2. Klicken Sie im Baum auf Dashboard.

  3. Klicken Sie auf das Dashboard, das Sie löschen möchten.

  4. Klicken Sie auf Entfernen.

  5. Klicken Sie zur Bestätigung auf Ja.

Dashboard-Komponenten

Übersicht

Dashboard-Komponenten sind nichts anderes als reguläre AEM-Komponenten. Dieser Abschnitt beschreibt die Berichtskomponenten, die im Lieferumfang von AEM enthalten sind.

Reporting-Komponenten zur Web-Analyse

AEM enthält eine Reihe von Komponenten, die mehrere Metriken Ihrer SiteCatalyst-Daten rendern. Diese Komponenten sind im Sidekick im Bereich Dashboard aufgeführt.

Jede Berichtskomponente enthält mindestens drei Registerkarten:

  • Allgemein: Enthält die Hauptkonfiguration.

  • Bericht: Enthält die spezifische Konfiguration des jeweiligen Berichts.

  • Stil: enthält Stilkonfigurationen wie Diagrammgröße und Rand.

Die Berichtskomponenten werden mit einer Standardkonfiguration initialisiert, mit der Sie Ihr Dashboard schnell einrichten können.

Konfiguration „Allgemein“

Auf der Registerkarte Allgemein wird der Zugriff auf die folgenden Konfigurationseinträge bereitgestellt:

Titel: Der im Dashboard angezeigte Titel.

Anfrage-Typ: Die Art und Weise, wie Daten angefragt werden.

SiteCatalyst-Konfiguration (optional): Die Konfiguration, die Sie für die Verbindung mit SiteCatalyst verwenden möchten. Falls nicht näher erläutert, wird von einer Konfiguration auf der Dashboardseite (über die Seiteneigenschaften) ausgegangen.

Report Suite-ID (optional): Die SiteCatalyst-Report Suite, die Sie für die Erstellung des Diagramms verwenden möchten.

Berichtskonfiguration

Zur Anzeige der Web-Statistiken müssen Sie den Datenbereich der Daten definieren, die Sie abrufen möchten. Auf der Registerkarte Bericht finden Sie zwei Felder, in denen Sie diesen Bereich festlegen können.

HINWEIS

Wenn Sie einen großen Datumsbereich festlegen, reagiert das Dashboard unter Umständen nicht mehr so schnell.

Ab-Datum Absolutes oder relatives Datum, ab dem die Daten abgerufen werden.

Bis-Datum: Absolutes oder relatives Datum, bis zu dem die Daten abgerufen werden.

Jede Komponente definiert außerdem bestimmte Einstellungen.

Überstunden-Bericht

chlimage_1-26

Datumsgranularität: Zeiteinheit der X-Achse (z. B. Tag, Stunde).

Metriken: Die Liste der Ereignisse, die angezeigt werden sollen.

Elemente: Die Liste der Elemente, in der die Daten zu den Metriken im Diagramm aufgeschlüsselt sind.

Bewerteter Listenbericht

chlimage_1-27

Elemente: Das Element, in dem die Daten zu den Metriken im Diagramm aufgeschlüsselt sind.

Metriken Das Ereignis, das Sie anzeigen möchten.

Anzahl von Top-Elementen: Anzahl der vom Bericht angezeigten Elemente.

Rangbericht

chlimage_1-28

Metriken Das Ereignis, das Sie anzeigen möchten.

Elemente: Das Element, in dem die Daten zu den Metriken im Diagramm aufgeschlüsselt sind.

Bericht zu oberem Site-Bereich

Diese Komponente zeigt ein Diagramm an, das den laut folgender Konfiguration häufiger besuchten Bereich einer Website aufzeigt.

chlimage_1-29

Anzahl von Top-Elementen: Anzahl der vom Bericht angezeigten Abschnitte.

Trendbericht

chlimage_1-30

Datumsgranularität: Zeiteinheit der X-Achse (z. B. Tag, Stunde).

Metriken Das Ereignis, das Sie anzeigen möchten.

Elemente: Das Element, in dem die Daten zu den Metriken im Diagramm aufgeschlüsselt sind.

Erweitern des Dashboards

Übersicht

Dashboards sind normale Seiten (cq:Page), deshalb können zum Zusammenstellen von Dashboards beliebige Komponenten verwendet werden.

Es gibt die Standardkomponentengruppe Dashboard, die Reporting-Komponenten zur Analyse enthält, die standardmäßig in der Vorlage aktiviert sind.

Erstellen einer Dashboard-Vorlage

Eine Vorlage definiert den Standardinhalt eines neuen Dashboards. Sie können mehrere Vorlagen für die Erstellung verschiedener Arten von Dashboards verwenden.

Dashboard-Vorlagen werden auf die gleiche Weise wie andere Seitenvorlagen erstellt, mit dem Unterschied, dass sie unter /libs/cq/dashboards/templates/ gespeichert werden. Weitere Informationen finden Sie im Abschnitt Erstellen einer contentpage-Vorlage.

HINWEIS

Dashboard-Vorlagen werden von mehreren Benutzern verwendet.

Entwickeln einer Dashboard-Komponente

Die Entwicklung einer Dashboard-Komponente besteht aus der Erstellung einer regulären AEM-Komponente. In diesem Abschnitt ist ein Beispiel für eine Komponente beschrieben, die die Top 10 der Mitwirkenden anzeigt.

chlimage_1-31

Die wichtigsten Autorkomponenten sind im Repository unter /apps/geometrixx-outdoors/components/reporting gespeichert und bestehen aus:

  1. einer jsp-Datei, die jcr-Daten liest und den html-Platzhalter definiert

  2. einer Client-seitigen Bibliothek, die eine js-Datei enthält. Diese ruft die Daten ab und gliedert sie und trägt dann den html-Platzhalter ein.

chlimage_1-32

Die folgende Javascript-Datei wird in der geout.reporting.topauthors-Client-Bibliothek als untergeordnetes Element der Komponente selbst definiert.

Der QueryBuilder wird verwendet, um beim Repository das Lesen der cq:AuditEvent-Knoten anzufragen. Das Ergebnis der Abfrage ist ein JSON-Objekt, aus dem Autorenbeiträge extrahiert werden.

top_authors.js

$.ajax({
  url: "/bin/querybuilder.json",
  cache: false,
  data: {
       "orderby": "cq:time",
       "orderby.sort": "desc",
       "p.hits": "full",
       "p.limit": 100,
       "path": "/var/audit/com.day.cq.wcm.core.page/",
       "type": "cq:AuditEvent"
   },
  dataType: "json"
}).done(function( res ) {
    var authors = {};
    // from JSON to Object
    for(var r in res.hits) {
        var userId = res.hits[r].userId;
        if(userId == undefined) {
            continue;
        }
        var auth = authors[userId] || {userId : userId};
        auth.contrib = (auth.contrib || 0) +1;

        authors[userId] = auth;
    }

    // order by contribution
    var orderedByContrib = [];
    for(var a in authors) {
        orderedByContrib.push(authors[a]);
    }
    orderedByContrib.sort(function(a,b){return b.contrib - a.contrib});

    // produce the list
    for (var i=0, tot=orderedByContrib.length; i < tot; i++) {
        var current = orderedByContrib[i];
        $("<div> #" + (i + 1) +" "+ current.userId + " (" + current.contrib +" contrib.)</div>").appendTo("#authors-list");

    }
});

Die JSP-Datei enthält sowohl global.jsp als auch clientlib.

top_authors.jsp

<%@page session="false" contentType="text/html; charset=utf-8" %><%
%><%
%><%@include file="/libs/foundation/global.jsp" %><%
%>
<ui:includeClientLib categories="geout.reporting.topauthors" />
<%
String reportletTitle = properties.get("title", "Top Authors");
%>
<html>
     <h3><%=xssAPI.encodeForHTML(reportletTitle) %></h3>
     <div id="authors-list"></div>
</html>

Auf dieser Seite