Con AEM è possibile gestire numerosi contenuti di tipo diverso (ad esempio pagine e contenuti). AEM Dashboard offre un metodo facile e personalizzabile per definire le pagine in cui sono visualizzati dati consolidati.
I dashboard di AEM vengono creati a livello di utente e ogni utente può quindi accedere solo al proprio dashboard.
Tuttavia, I modelli di dashboard possono essere utilizzati per condividere la configurazione comune e il layout del dashboard.
Per creare un nuovo dashboard, effettuate le seguenti operazioni:
Nella sezione Strumenti, fate clic su Console di configurazione.
Nella struttura ad albero, fare doppio clic su Dashboard.
Fate clic su Dashboard.
Digitate il Titolo (ad esempio Mio dashboard) e Nome.
Fate clic su Crea.
Può essere utile disporre di più dashboard per vedere rapidamente le informazioni sui contenuti sotto forma diversa. Per facilitare la creazione di nuovi dashboard, AEM consente di clonare, o duplicare, un dashboard esistente. Per clonare un dashboard, effettuate le seguenti operazioni:
Nella sezione Strumenti, fate clic su Console di configurazione.
Nella struttura ad albero, fate clic su Dashboard.
Fate clic sul dashboard da clonare.
Fate clic su Clona.
Digitate il Nome del nuovo dashboard.
Nella sezione Strumenti, fate clic su Console di configurazione.
Nella struttura ad albero, fate clic su Dashboard.
Fate clic sul dashboard da eliminare.
Fate clic su Rimuovi.
Fate clic su Sì per confermare.
I componenti dashboard non sono altro che normali componenti AEM. Questa sezione descrive i componenti per report forniti con AEM.
AEM viene fornito con un set di componenti che eseguono il rendering di più metriche dei dati SiteCatalyst. Tali componenti sono elencati nella barra laterale sotto la sezione Dashboard.
Ciascun componente per report dispone di almeno tre schede:
Base: contiene la configurazione principale.
Report: contiene la configurazione specifica di ciascun report.
Stile: contiene la configurazione di stile, come dimensione del grafico e margini.
I componenti per report vengono inizializzati con una configurazione predefinita che consente di impostare rapidamente il dashboard.
La scheda Base permette di accedere alle seguenti voci di configurazione:
Titolo: il titolo visualizzato sul dashboard.
Tipo di richiestaModalità di richiesta dei dati.
Configurazione SiteCatalyst (facoltativo) Configurazione da utilizzare per la connessione al SiteCatalyst. Se non viene fornita, viene considerata la configurazione sulla pagina Dashboard (tramite le proprietà pagina).
ID suite di rapporti (facoltativo) La suite di rapporti per SiteCatalyst da usare per generare il grafico.
Per visualizzare le statistiche Web, occorre definire l’intervallo di date che interessano. La scheda Report contiene due campi con cui definire tale intervallo.
Se si imposta un intervallo di date ampio, il dashboard potrebbe risultare lento.
Data DaAssoluto o data relativa a partire dalla quale vengono estratti i dati.
Data ToAbsolute o data relativa alla quale vengono estratti i dati.
Per ciascun componente vengono inoltre definite specifiche impostazioni.
Unità data GranularityTime dell’asse X (ad es. giorno, ora).
Metriche: elenco degli eventi da visualizzare.
Elementi: elenco di elementi che compongono i dati delle metriche nel grafico.
Elementi: l’elemento che suddivide i dati delle metriche nel grafico.
Metriche: evento da visualizzare.
No. degli elementi principali Numero di elementi visualizzati dal rapporto.
Metriche: evento da visualizzare.
Elementi: l’elemento che suddivide i dati delle metriche nel grafico.
Questo componente visualizza un grafico che illustra la sezione più visitata del sito Web in base alla seguente configurazione.
No. degli elementi principali Numero di sezioni visualizzate dal report.
Unità data GranularityTime dell’asse X (ad es. giorno, ora).
Metriche: evento da visualizzare.
Elementi: l’elemento che suddivide i dati delle metriche nel grafico.
I dashboard sono normali pagine (cq:Page
) e possono quindi essere assemblati con qualsiasi componente.
Esiste un gruppo di componenti predefinito Dashboard
contenente componenti per report di analisi che sono abilitati per impostazione predefinita sul modello.
Con un modello si definisce il contenuto predefinito di un nuovo dashboard. È possibile disporre di più modelli, con cui creare diversi tipi di dashboard.
I modelli di dashboard vengono creati come altri modelli di pagina, ma sono memorizzati in /libs/cq/dashboards/templates/
. Vedere la sezione Creazione di un modello di pagina contenuto.
I modelli di dashboard possono essere condivisi tra più utenti.
Lo sviluppo di un componente dashboard consiste nella creazione di un normale componente AEM. In questa sezione viene descritto un esempio di componente per visualizzare i primi 10 utenti collaboratori.
I componenti per autori principali sono memorizzati nella directory archivio in /apps/geometrixx-outdoors/components/reporting
ed è composto da:
un file jsp
che legge i dati jcr e definisce il segnaposto html
;
una libreria lato client contenente un file js
che raccoglie e ordina i dati, quindi compila il segnaposto html
.
Il seguente file Javascript è definito nella geout.reporting.topauthors
libreria client come figlio del componente stesso.
La QueryBuilder viene utilizzata per eseguire query sull'archivio per leggere i nodi cq:AuditEvent
. Il risultato della query genera un oggetto JSON dal quale vengono estratti i contributi degli autori.
$.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");
}
});
JSP
include sia global.jsp
che clientlib
.
<%@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>