Wenn Sie Einblicke in die Daten geben möchten, die das Tagebuch generiert (sowohl für den Kunden als auch für den Leistungserbringer), ist es eine gute Idee, diese Einblicke in einem Diagramm zu visualisieren. 

 

Als Entwickler von Interventionen ist es wichtig, sorgfältig darüber nachzudenken, welche Variablen Sie im Diagramm anzeigen möchten und was die beste visuelle Ausgabe ist. Derzeit sind 3 Arten von Diagrammen möglich. Sie können wählen zwischen: 

  • Liniendiagramm
  • Balkendiagramm 
  • Streudiagramm

 

Lijngrafiek

Staafdiagram

Streudiagramm

Afbeelding met tekst

Automatisch gegenereerde beschrijving

 

 

Machen Sie ein Tagebuch in 3 Schritten

 

Ein Diagramm erfordert immer eine Codebearbeitung.


Um ein Diagramm für Ihr Journal zu erstellen, müssen Sie die Grundlagen der Bearbeitung von JavaScript-Code kennen. Aus diesem Grund kann Javascript-Code nur bearbeitet werden, wenn Sie die Rolle ‘Programmierer’ im CMS. Sie können diese Position erhalten, indem Sie eine CMS-Weiterbildung von Minddistrict absolvieren. Natürlich können wir auch Javascript für Sie bearbeiten, wenn Sie nicht den Ehrgeiz haben, dies zu lernen. Wenden Sie sich in beiden Fällen an Ihren Account Manager.

 

Schritt 1: Entwerfen Sie das Diagramm in Ihrem Kopf

Bevor Sie mit der Erstellung Ihrer Diagramme im CMS beginnen, sollten Sie sich überlegen, wie das Diagramm aussehen soll. Ab welchen Terminen des Tagebuchs ist es sinnvoll, visuellen Output zu sehen? Was gibt Ihrem Tagebuch einen Sinn? Gibt es ein oder mehrere Datenelemente, die Sie in einem Diagramm anzeigen möchten? Denken Sie auch daran, dass der Kunde das Tagebuch ausfüllt. Wenn dies mehr als einmal am Tag ist, können Sie beispielsweise darüber nachdenken, alle Eingaben von diesem Tag in einem Datenpunkt im Diagramm zu sammeln oder nicht. 

 

Hinweis: Ein Diagramm kann nur für Fragefelder vom Typ ‘choice’, ‘integer’ of ‘float’ definiert werden.

 

Schritt 2: Geben Sie den Standardcode von Diagrammen in den Rohcode ein.

Klicken Sie auf ‘Planen’ um das Tagebuch zu öffnen. Klicken Sie dann auf ‘Quellcode bearbeiten’.

 

Afbeelding met schermafbeelding

Automatisch gegenereerde beschrijving

 

Hier sehen Sie den Javascript-Code Ihres Tagebuchs. Es beginnt mit {"Feldern" usw. Platzieren Sie den Cursor oben im Feld. Drücken Sie ‘Eingabe’ leeren Raum zu schaffen. Kopieren Sie den Code sorgfältig – wie im Bild unten gezeigt – auf deinem Gebiet.

 

Der Code zum Erstellen eines Diagramms

So sieht es im CMS aus

{
"charts": [
{
"buckets": "day",
"series": [
{
"bucket-function": "sum",
"field": "asleep"
}
],
"title": "Hours of sleep per night",
"type": "bar"
}
  ],

Afbeelding met schermafbeelding

Automatisch gegenereerde beschrijving

 

Wenn Sie mit Codierung arbeiten, kommt es auf die Genauigkeit an. Wenn das Diagramm nicht funktioniert, überprüfen Sie immer, ob Sie ein Komma, ein Leerzeichen oder ein Zitat vergessen haben.

 

Schritt 3: Ersetze den grünen Text

Ersetzen Sie die grünen Textteile entsprechend Ihrem Tagebuch.

 

  • Titel: Auch wenn dies nicht das erste Element ist, auf das Sie stoßen, ist es das einfachste. Also ein guter Anfang. Welchen Titel Ihres Diagramms möchten Sie? Es hilft, einen Namen zu wählen, der erklärt, was Sie im Diagramm darstellen. Zum Beispiel ‘Schlafstunden pro Nacht’ oder ‘Anzahl alkoholischer Getränke pro Tag’. Der Titel wird über (oder neben) dem Diagramm angezeigt.
  • Type: Hier geben Sie den gewünschten Graphentyp ein. Sie können wählen zwischen:‘Linie’, ‘Balken’ oder ‘Streu’.
  • Field: Dies bezieht sich auf den Feldnamen der Frage im Journal, deren Daten Sie im Diagramm anzeigen möchten. Geben Sie hier den Feldnamen ein.
  • Buckets: Mit der Bucket-Funktion können Sie mehrere Einträge zu einem einzigen Wert in der Tabelle zusammenfassen. Zum Beispiel ‘Tag’ sammelt alle Werte vom selben Tag in einem Datenpunkt. Oder ‘Nacht-Morgen-Nachmittag-Abend’ zeigt vier Datenpunkte an und sammelt mehrere Tageseinträge für jeden Datenpunkt.
  • Series and bucket-function: Die Bucket-Funktion einer Reihe definiert, wie ein einzelner Datenpunkt aus mehreren Eingaben aufgebaut wird. Für ein Feld, das die in einer einzigen Sitzung konsumierte Alkoholmenge beschreibt, und mit Eimern pro Tag, lautet die Eimerfunktion beispielsweise ‘Summe’ am besten geeignet: Zeigt den gesamten Alkoholkonsum pro Tag an. Andererseits wird für ein Feld, das die Intensität einer Emotion aufnimmt, die Bucket-Funktion ‘Durchschnitt’ geeigneter sein. Bei Auswahlfeldern wird die ‘Tally’ Bucket-Funktion, wie oft jede Option ausgewählt wird, um sie in einem gestapelten Balkendiagramm anzuzeigen.

 

Afbeelding met schermafbeelding

Automatisch gegenereerde beschrijving

 

Denken Sie daran, Ihre Arbeit regelmäßig zu speichern!

 

So erstellen Sie mehr als 1 Diagramm für ein Tagebuch:

Das ist eigentlich ganz einfach. Fügen Sie am Ende des Diagrammcodes ein Komma hinzu und kopieren und fügen Sie den Diagrammcode noch einmal in dieses Feld ein. Ändern Sie den grünen Text so, dass er mit Ihrem neuen Diagramm übereinstimmt, und speichern Sie. Unten ist ein Beispiel dafür, wie der Code mit 2 Diagrammen aussehen könnte:

 

Code zum Erstellen von 2 Diagrammen

So sieht es im CMS aus

{
"charts": [
{
"buckets": "day",
"series": [
{
"bucket-function": "sum",
"field": "asleep"
}
],
"title": "Uren slaap per nacht",
"type": "bar"
},
{
"buckets": "day",
"series": [
{
"bucket-function": "sum",
"field": "float_2"
}
],
"title": "Uitgerust gevoel",
"type": "bar"
}
  ],

Afbeelding met schermafbeelding

Automatisch gegenereerde beschrijving