Skip to content
Snippets Groups Projects
Commit cb53b1b9 authored by Damian Romano Haj-Houssin's avatar Damian Romano Haj-Houssin
Browse files

Added description for project to homepage.

parent aaa1031d
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 128 additions and 23 deletions
src/Main.elm
+ 128
− 23
View file @ cb53b1b9
......@@ -182,34 +182,139 @@ viewNav ( global, _ ) =
]
viewHome : Global -> Html Msg
viewHome global =
case global.progress of
Loading ->
Html.div [ Html.Attributes.style "margin" "auto" ]
[ Html.div [ Html.Attributes.class "loader" ] []
, Html.div
[ Html.Attributes.style "position" "relative"
, Html.Attributes.style "left" "1.5rem"
, Html.Attributes.style "bottom" "5rem"
]
[ Html.text "Loading Data..." ]
]
Failure msg ->
Html.text (msg |> (++) "Error while loading data. ")
Success ->
div []
[ Html.h2 []
[ text "Willkommen!" ]
, Html.p []
[ text "Herzlich Willkommen zu unserem Projekt im Rahmen des Moduls "
, Html.b [] [ text "Informationsvisualisierung" ]
, text " im Sommersemester 2024 an der Martin-Luther-Universität Halle-Wittenberg!"
]
, Html.p []
[ text "In unserem Projekt geht es um die Aufbereitung und Visualisierung von Statistiken zu "
, Html.b [] [ text "Schengen Visa" ]
, text " für die Jahre 2014-2023."
, Html.br [] []
, text "Im Fokus steht dabei die Analyse der "
, Html.b [] [ text "Visafreundlichkeit" ]
, text " der Länder im Schengenraum, also die "
, Html.b [] [ text "a-priori Chance auf ein Visa" ]
, text " bei Antragstellung in der jeweiligen Auslandsvertretung (Konsulat)."
]
, Html.p []
[ text "Über die Icons in der Navigationsleiste kannst du zwischen den Visualisierungen wechseln." ]
, Html.p []
[ text "Das Icon "
, MapView.icon
, text " führt dich zur "
, Html.b [] [ text "Weltkarte" ]
, text " auf welcher du die Visafreundlichkeit der Schengenländer (grün) mittels "
, Html.b [] [ text "Chernoff Gesichtern" ]
, text " vergleichen kannst."
, text " Durch "
, Html.b [] [ text "Klick auf ein Drittland"]
, text " und ggf. anschließende Auswahl eines "
, Html.b [] [ text "Konsulats" ]
, text " kannst du die zur Berechnung der Gesichter verwendeten Daten filtern."
]
, Html.p []
[ text "Mit dem Icon "
, ForceDirectedGraphView.icon
, text " kommst du zur "
, Html.b [] [ text "Force" ]
, text " Visualisierung der Beziehungen zwischen Schengen- und Drittländern."
, text " Auf der Legende kannst du ein "
, Html.b [] [ text "Schengenland selektieren" ]
, text ", sodass die zugehörigen Kanten in der Visualisierung rot markiert werden."
, text " Zusätzlich kann der Force-Graph mittels verschiedener Kräfte berechnet werden, was du durch "
, Html.b [] [ text "Klick der Version-Buttons" ]
, text " auswählen kannst."
, text " Die Größe der Schengenländer-Labels wird in der Visualisierung durch die"
, text " Beliebtheit, bzw. Anzahl erhaltener Visa-Anfragen, bestimmt."
, text " Durch "
, Html.b [] [ text "Auswahl eines Jahres" ]
, text " können die zur Berechnung zugrundegelegten Daten gefiltert werden."
, Html.br [] []
, Html.i [ Html.Attributes.style "font-size" "14px" ]
[ text "Bitte beachte, dass die Berechnung dieser Visualisierung bei unserer Datenmenge einige Zeit dauert." ]
]
, Html.p []
[ text "Mit dem Icon "
, BarPlotView.icon
, text " kommst du zum "
, Html.b [] [ text "BarPlot" ]
, text ", in welchem du die "
, Html.b [] [ text "Anzahl beantragter und bewilligter Visa pro Schengenland" ]
, text " approximativ ablesen kannst."
, text " Das Auswahlfeld ermöglicht dir einen "
, Html.b [] [ text "Wechsel zwischen bewilligt/beantragten Visa" ]
, text " im Diagramm."
, text " Außerdem kannst du eine "
, Html.b [] [ text "obere Grenze der Werte angeben" ]
, text " um ggf. kleinere Balken in den Fokus zu rücken."
]
, Html.p []
[ text "Mit dem Icon "
, LinePlotView.icon
, text " kommst du zum "
, Html.b [] [ text "LinePlot" ]
, text ", in welchem du eine "
, Html.b [] [ text "Zeitreihe der beantragten und bewilligten Visa" ]
, text " bzgl. eines Schengenlandes findest."
, text " Du kannst optional ein "
, Html.b [] [ text "Drittland auswählen" ]
, text " und die Einträge im Datensatz nach diesem filtern."
, text " Durch "
, Html.b [] [ text "Bewegung der Maus über die Grafik" ]
, text " kannst du die exakten Werte für ein konkretes Jahr ablesen."
]
, Html.p []
[ text "Letztlich wechselst du mit dem Icon "
, DataTableView.icon
, text " zur "
, Html.b [] [ text "Datentabelle" ]
, text ", in welcher du den von uns verwendeten Datensatz durchsuchen kannst."
, text " Durch "
, Html.b [] [ text "Eingabe in die Suchleiste" ]
, text " filterst du nach dem Namen des Schengenlandes, Drittlandes oder Konsulats."
, text " Außerdem kannst du den "
, Html.b [] [ text "Index eines Eintrags angeben" ]
, text " zu welchem du springen möchtest."
]
, Html.p []
[ text "Wir wünschen dir viel Spaß beim Ausprobieren und Analysieren!" ]
, Html.i [ Html.Attributes.style "font-size" "14px" ]
[ text "Hinweis: In manchen Visualisierungen tauchen Flaggen Icons auf."
, text " Abhängig vom Browser und Betriebssystem werden diese ggf. nicht als Flaggen,"
, text " sondern mit zwei Buchstaben angezeigt."
]
]
viewContent : Model -> Html Msg
viewContent ( global, local ) =
let
message =
Html.div
[ Html.Attributes.style "margin" "auto" ]
(case global.progress of
Loading ->
[ Html.div [ Html.Attributes.class "loader" ] []
, Html.div
[ Html.Attributes.style "position" "relative"
, Html.Attributes.style "left" "1.5rem"
, Html.Attributes.style "bottom" "5rem"
]
[ Html.text "Loading Data..." ]
]
Failure msg ->
[ Html.text (msg |> (++) "Error while loading data. ") ]
Success ->
[ Html.text "Data was loaded successfully!" ]
)
in
case global.view of
Home ->
div [ Html.Attributes.class "content" ]
[ message ]
[ viewHome global ]
MapView ->
div [ Html.Attributes.class "content" ]
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment