hft-informatik/ubiquitous-computing-geo-timetracking
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add TODO content, fix section depth of Probleme und Lösungen

Browse Source
This commit is contained in:
Simon Kellner 2020-06-14 17:26:47 +02:00 committed by Marcel Schwarz
parent 2152fa61f7
commit 1d9740c9bc
3 changed files with 20 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
documentation/img/frontend/statistics_column.PNG Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

BIN
documentation/img/frontend/statistics_pie.PNG Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 74 KiB

25
documentation/parts/frontend.tex
View File

@ -105,6 +105,7 @@
\begin{itemize} \begin{itemize}
\item Verhältnis von Arbeitszeit zu Pausenzeit von allen Accounts des Benutzers. \item Verhältnis von Arbeitszeit zu Pausenzeit von allen Accounts des Benutzers.
\item Verhältnis der Arbeitszeit je TimeTrack Account des Benutzers mit Angabe des Gesamtverdienstes. \item Verhältnis der Arbeitszeit je TimeTrack Account des Benutzers mit Angabe des Gesamtverdienstes.
\item Verhältnis des Verdienstes je TimeTrack Account des Benutzers.
\end{itemize} \end{itemize}
\item Säulendiagramme \item Säulendiagramme
\begin{itemize} \begin{itemize}
@ -114,7 +115,6 @@
\end{itemize} \end{itemize}
Um Diagramme verwenden zu können haben wir das Framework Apexcharts eingebunden, welches es ermöglicht, konfigurierbare Diagramme einzufügen. Um Diagramme verwenden zu können haben wir das Framework Apexcharts eingebunden, welches es ermöglicht, konfigurierbare Diagramme einzufügen.
Die Konfiguration des Säulendiagramms für die Ansicht der letzten 30 Tage ist nachfolgend dargestellt. Die Konfiguration des Säulendiagramms für die Ansicht der letzten 30 Tage ist nachfolgend dargestellt.
%TODO Update listing if changes to options are made
\begin{lstlisting}[language=JavaScript, caption=Konfiguration Säulendiagramm] \begin{lstlisting}[language=JavaScript, caption=Konfiguration Säulendiagramm]
<script> <script>
... ...
@ -196,6 +196,12 @@
type: "datetime", type: "datetime",
categories: [] categories: []
}, },
yaxis: {
labels: formatter: function(value) {
...
return hours + ":" + minutes + ":" + seconds;
}
},
legend: { legend: {
show: false, show: false,
position: "left", position: "left",
@ -254,8 +260,17 @@
\end{figure} \end{figure}
\subsection{Statistics} \subsection{Statistics}
Auf der Statistics Seite sind die Daten der Time Records übersichtlich ausgewertet. Hier sind 2 verschiedene Diagrammtypen eingesetzt. Auf der Statistics Seite sind die Daten der Time Records übersichtlich ausgewertet. Hier werden 2 verschiedene Diagrammtypen eingesetzt, um dem Benutzer eine bestmögliche Auswertung seiner Zeiteinträge zu bieten.
%TODO Add picture when statistics page is reworked \begin{figure}[H]
\centering
\includegraphics[width=\linewidth]{img/frontend/statistics_pie.PNG}
\caption{Kreisdiagramme}
\end{figure}
\begin{figure}[H]
\centering
\includegraphics[width=\linewidth]{img/frontend/statistics_column.PNG}
\caption{Säulendiagramme}
\end{figure}
\subsection{Accounts} \subsection{Accounts}
Die Accouts Seite bietet einem die Möglichkeit eigene Accounts einzusehen und zu verwalten. Man kann neue Accounts hinzufügen und bestehende Accounts löschen oder anpassen. Die Accouts Seite bietet einem die Möglichkeit eigene Accounts einzusehen und zu verwalten. Man kann neue Accounts hinzufügen und bestehende Accounts löschen oder anpassen.
@ -277,8 +292,8 @@
\includegraphics[width=\linewidth/2]{img/frontend/verwaltung.PNG} \includegraphics[width=\linewidth/2]{img/frontend/verwaltung.PNG}
\caption{Nutzer Verwaltung} \caption{Nutzer Verwaltung}
\end{figure} \end{figure}
\subsection{Probleme und Lösungen} \section{Probleme und Lösungen}
\subsubsection{Diagramme} \subsection{Diagramme}
Beim erstellen der Säulendiagramme sind wir auf den Fehler gestoßen, dass der erste Eintrag von links nicht richtig angezeigt wird. Dieser Fehler ist den Entwicklern von Apexcharts bekannt aber noch nicht behoben. Wir haben das Problem behoben indem wir die die Daten an der ersten Stelle entfernen. Dies führt zu einem kleinen Abstand, jedoch wird das Diagramm so optimal ohne fehlende Beschriftungen dargestellt. Beim erstellen der Säulendiagramme sind wir auf den Fehler gestoßen, dass der erste Eintrag von links nicht richtig angezeigt wird. Dieser Fehler ist den Entwicklern von Apexcharts bekannt aber noch nicht behoben. Wir haben das Problem behoben indem wir die die Daten an der ersten Stelle entfernen. Dies führt zu einem kleinen Abstand, jedoch wird das Diagramm so optimal ohne fehlende Beschriftungen dargestellt.
\subsection{Custom Headers Chrome} \subsection{Custom Headers Chrome}
Ein weiteres unserer Probleme war, dass Chrome sich geweigert hat auf den selbst erstellten Header zuzugreifen. Dieses Problem konnten wir im Backend lösen, indem wir den Header zu den Access-Control-Expose-Headers hinzugefügt haben. Ein weiteres unserer Probleme war, dass Chrome sich geweigert hat auf den selbst erstellten Header zuzugreifen. Dieses Problem konnten wir im Backend lösen, indem wir den Header zu den Access-Control-Expose-Headers hinzugefügt haben.