creating a usable analysis application built on an ...1106248/fulltext02.pdf · creating a usable...

82
UPTEC F 17018 Examensarbete 30 hp Juni 2017 Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Upload: others

Post on 28-Jun-2020

5 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

UPTEC F 17018

Examensarbete 30 hpJuni 2017

Creating a usable analysis application built on an existing visualization platform

Pontus Arfwedson

Page 2: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Teknisk- naturvetenskaplig fakultet UTH-enheten Besöksadress: Ångströmlaboratoriet Lägerhyddsvägen 1 Hus 4, Plan 0 Postadress: Box 536 751 21 Uppsala Telefon: 018 – 471 30 03 Telefax: 018 – 471 30 00 Hemsida: http://www.teknat.uu.se/student

Abstract

Creating a usable analysis application built on anexisting visualization platform

Pontus Arfwedson

The advances in research on wireless communications has lead up to the currentsuccess of 4G mobile broadband and is currently focusing on designing the upcomingeven more advanced fifth generation (5G) networks. The type of research behind thistypically generates large quantities of data and requires efficient analysis in order toachieve tangible results. To enable this analysis, visualization of the data is used to givethe researchers the needed insights. For this master thesis project an existingplatform will be analyzed with the goal of, by utilizing the platform, creating apowerful, useful analysis application with the necessary and desired tools. Theplatform can access data produced from research simulations and visualize themthrough different types of useful charts. However, it has up until now lacked someimportant functionality, mainly letting the user modify and alter the visualization to aidin the analysis. It furthermore requires knowledge and experience before being useful.To solve this, there existed a need of extending the platform with new tools andfunctionality to give the user more control and possibilities and to simplify the usage.The thesis resulted in a functioning analysis application that gives the user manynecessary features to effectively analyze data. The result fulfilled the set requirementswith improved and added views, extended tools and optimized performance.

ISSN: 1401-5757, UPTEC F 17018Examinator: Tomas NybergÄmnesgranskare: Mikael SternadHandledare: Pontus Arvidson

Page 3: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Popularvetenskaplig sammanfattning

I en varld dar mer och mer data skapas behovs anvandbara verktygfor att val kunna analysera den. Forskning inom mobila natverk hargivit oss GSM, 3G och sedermera 4G men ar mitt uppe i utvecklingen avframtidens natverk, 5G. For att effektivt kunna driva forskningen vidarekravs kraftfulla simulatorer som modellerar den verklighet som undersoksoch stravas efter.

I och med utvecklingen av femte generationens natverk ar det en uppsjo avforetag och institutioner som tillsammans arbetar med att standardiseraoch forska fram hur natverket ska se ut. De simulatorer som anvands ochutvecklas for detta syfte genererar stora dataset dar manga relationer finnsmellan olika typer av information. For att kunna finna dessa slutsatservisualiseras data i regel med hjalp av MATLAB dar en mangd olika scripttjanar olika syften for att skapa ratt plot. Och gillar man att scripta sjalv,och har arbetat med dem mycket, ar mojligheterna nastintill oandliga.Men vill du fokusera pa att snabbt kunna visualisera data, speciellt omdu ar ny inom anvandandet, sa blir det extremt tidskravande att ta tillsig vad alla script gor och hur de fungerar. Vidare kravs det att man haren djupare forstaelse for MATLAB for att kunna ta fram de resultat mansoker efter. Gar det att rada bot pa detta?

Ericsson har utvecklat en egen visualiseringsplatform dar simuleringsdatakan importeras direkt in i applikationen. Den har inbyggd funktionalitetfor att relatera dataset samt support for en mangd olika typer av graferoch filter. Under detta examensarbete har plattformen vidareutvecklatsfran just bara en plattform till ett anvandbart analysverktyg. Genomatt ge anvandaren mojlighet att dynamiskt och intuitivt bestamma hurapplikationen kan se ut ges denne mer frihet. Additionen av verktyg forpanorering, zoom och line tracking ger anvandarna en storre mojlighetatt vrida och vanda pa det de ser. Resultatet innefattade aven mojlighetatt automatiskt exportera grafer till Powerpoint, se log-utskrifter samten inbyggd hjalp-video. Fokus lag framst pa att gora applikationen mermodifierbar och dynamisk for att se till sa att varje anvandare, med enkel-het, kan fa den att fungera sa som han eller hon vill. Och om vi ska troanvandartesterna sa var det precis sa det blev.

1

Page 4: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Acknowledgements

I would like to first and foremost thank my supervisor at Ericsson,Pontus Arvidson, as well as my line manager, Johan Soder, for theirsupport, guidance and confidence in my work. Furthermore, my reviewerat Uppsala University, Mikael Sternad. Lastly, I would like to thank mybeloved partner Magdalena Hillered for her undivided backing throughoutthis project.

2

Page 5: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Contents

1 Introduction 61.1 Data visualization . . . . . . . . . . . . . . . . . . . . . . . . . . 61.2 Visual data analysis . . . . . . . . . . . . . . . . . . . . . . . . . 61.3 Existing platform . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

1.3.1 hSQL database . . . . . . . . . . . . . . . . . . . . . . . . 81.3.2 XML file . . . . . . . . . . . . . . . . . . . . . . . . . . . 81.3.3 FXML file . . . . . . . . . . . . . . . . . . . . . . . . . . . 91.3.4 JavaScript file . . . . . . . . . . . . . . . . . . . . . . . . . 91.3.5 CSS file . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

1.4 Other applications . . . . . . . . . . . . . . . . . . . . . . . . . . 91.4.1 OriginPro 8.5 . . . . . . . . . . . . . . . . . . . . . . . . . 91.4.2 IBM Many Eyes . . . . . . . . . . . . . . . . . . . . . . . 91.4.3 Sigmaplot . . . . . . . . . . . . . . . . . . . . . . . . . . . 101.4.4 Microsoft Excel . . . . . . . . . . . . . . . . . . . . . . . . 101.4.5 MATLAB . . . . . . . . . . . . . . . . . . . . . . . . . . . 10

1.5 Usability . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101.6 Problem definition . . . . . . . . . . . . . . . . . . . . . . . . . . 10

2 Theory 112.1 Java/JavaFX . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

2.1.1 BeanProperties and Observables . . . . . . . . . . . . . . 112.1.2 Performance . . . . . . . . . . . . . . . . . . . . . . . . . 122.1.3 Java 8 features . . . . . . . . . . . . . . . . . . . . . . . . 122.1.4 Interface . . . . . . . . . . . . . . . . . . . . . . . . . . . . 122.1.5 Singleton . . . . . . . . . . . . . . . . . . . . . . . . . . . 122.1.6 Inheritance . . . . . . . . . . . . . . . . . . . . . . . . . . 132.1.7 RTTI . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13

3 Method 143.1 Examining the existing platform . . . . . . . . . . . . . . . . . . 143.2 Studying the data model and data access . . . . . . . . . . . . . 153.3 Requirements analysis . . . . . . . . . . . . . . . . . . . . . . . . 17

3.3.1 Interviews . . . . . . . . . . . . . . . . . . . . . . . . . . . 173.4 Prototyping . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173.5 Implementation . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

3.5.1 Commenting . . . . . . . . . . . . . . . . . . . . . . . . . 173.5.2 Unit Testing . . . . . . . . . . . . . . . . . . . . . . . . . 183.5.3 Verification and validation . . . . . . . . . . . . . . . . . . 183.5.4 Code Review . . . . . . . . . . . . . . . . . . . . . . . . . 18

4 Requirements 18

5 Prototype 19

3

Page 6: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

6 Result 216.1 Architecture . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 216.2 Attribute relations . . . . . . . . . . . . . . . . . . . . . . . . . . 226.3 Plot Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27

6.3.1 Graph settings . . . . . . . . . . . . . . . . . . . . . . . . 276.3.2 Line settings . . . . . . . . . . . . . . . . . . . . . . . . . 30

6.4 Data Source View . . . . . . . . . . . . . . . . . . . . . . . . . . 346.5 Chart Chooser View . . . . . . . . . . . . . . . . . . . . . . . . . 376.6 Multiple graphs per tab . . . . . . . . . . . . . . . . . . . . . . . 41

6.6.1 Selecting the chosen graph . . . . . . . . . . . . . . . . . . 436.7 Log View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44

6.7.1 Subscribable Logger . . . . . . . . . . . . . . . . . . . . . 446.8 Application with all the views . . . . . . . . . . . . . . . . . . . . 456.9 Graph interaction - Panning and zooming . . . . . . . . . . . . . 46

6.9.1 Scroll zooming . . . . . . . . . . . . . . . . . . . . . . . . 476.9.2 Scroll panning . . . . . . . . . . . . . . . . . . . . . . . . 496.9.3 Drag panning . . . . . . . . . . . . . . . . . . . . . . . . . 49

6.10 Line tracking . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 506.11 Usable quick buttons . . . . . . . . . . . . . . . . . . . . . . . . . 52

6.11.1 Layout mode bar . . . . . . . . . . . . . . . . . . . . . . . 536.11.2 Cursor mode bar . . . . . . . . . . . . . . . . . . . . . . . 536.11.3 Reset axes button . . . . . . . . . . . . . . . . . . . . . . 546.11.4 Toggle grid button . . . . . . . . . . . . . . . . . . . . . . 546.11.5 Close graph button . . . . . . . . . . . . . . . . . . . . . . 54

6.12 Tutorial view . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 546.13 Power point exporter . . . . . . . . . . . . . . . . . . . . . . . . . 556.14 Adding filters . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57

6.14.1 Bad data removal . . . . . . . . . . . . . . . . . . . . . . . 586.15 Performance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60

6.15.1 New Java 8 functionality . . . . . . . . . . . . . . . . . . 616.16 Layout & design . . . . . . . . . . . . . . . . . . . . . . . . . . . 61

7 Conclusions 62

8 Future work 66

Appendices 69

A Interview questionnaire 69A.1 Pre-questionnaire . . . . . . . . . . . . . . . . . . . . . . . . . . . 69

A.1.1 Q: What features (different charts, tools, scripts) do youalways use in MATLAB when visualizing data? . . . . . . 71

A.1.2 Q: Are there any features (different charts, tools, scripts)that you want to use in MATLAB but are complicated toget working the way you want? . . . . . . . . . . . . . . . 71

4

Page 7: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.1.3 Q: Are there any features (different charts, tools, scripts)in, for example, MATLAB that you avoid using due totaking to much time? . . . . . . . . . . . . . . . . . . . . 72

A.1.4 Q: What is the most important aspect of visualizing datafor analyzing in your eyes? What advantages do you getfrom it? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72

A.1.5 Q: Do you generally feel pleased with the way you are ableto visualize your data in order to analyze it? . . . . . . . 73

A.1.6 Q: For finding correlation between different data - do youhave any ideas of ways to visualize data to achieve this? . 73

A.1.7 Q: Roughly how much of your time do you spend graphi-cally setting up and observing data (such as graphs, plotsetc)? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74

A.1.8 SHOW GVP FOR QUESTIONEE! . . . . . . . . . . . . . 74A.1.9 Q: What features do you immediately feel that GVP is

lacking? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74A.1.10 Q: Is the way the available data is shown in GVP clear

and easily understandable? If not, how would you prefer?(Show GVP for questionaree) . . . . . . . . . . . . . . . . 75

A.1.11 Q: Do you feel a need for something more than ability tosave graph(s) as image? Export to a different format forfurther analysis or reporting? . . . . . . . . . . . . . . . . 75

A.2 Post-questionnaire . . . . . . . . . . . . . . . . . . . . . . . . . . 76

B Continuous testing form 77B.1 Questionnaire . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77

5

Page 8: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

1 Introduction

1.1 Data visualization

Data visualization has been around for almost 2000 years, starting with Astro-nomical information in tables in Egypt, and has since grown into somethingcrucial for the way we can use the data we create [1]. It is now importantfor many applications and provides powerful tools to understand data and tocommunicate that data to others.

There are some current good reoccurring features that are trending in theway we visualize data. One prominent one comes in the form of analytics wherethe user is not only able to represent the data visually, but also interact withit and ”change its level of display” [1]. This lets us apply our eyes and brainin an effective way that can lead to insights otherwise hard to achieve. Sincestatic visualizations do not allow for modification or alteration they work wellfor presentation but they cannot be utilized to their full extent for analysis.Not much intellectual work is achieved with our eyes and ears closed, like Warementions [2]. Utilizing them to the fullest is therefore of great importance whenanalyzing intricate data.

1.2 Visual data analysis

The field of data visualization has lead to the development of many differentways of analyzing data. It might however, when not applied properly, produceconfusion rather than understanding. It is therefore important to account formany factors when trying to create a visual analysis application [1].

To make an analysis of something is defined as ”a systematic examinationand evaluation of data or information, by breaking it into its component parts touncover their interrelationships” or ”an examination of data and facts to uncoverand understand cause-effect relationships, thus providing basis for problem solvingand decision making” [3]. An application used for analysis must thus give theuser the right tools to perform these very actions. When creating a modernanalysis application there or many parts to take in account but it could be brokendown into data model, data access, data transformation and user flexibility [4].

The data model should be designed to best represent the data that theapplication aims to aid in analyzing. For this choice the relational model is themost common one due to the fact that different sets of data tends to be relatedto other sets. For this model, relational databases are generally the way thego. And, in contrast to standard designed databases, de-normalized tables withsome redundancy can be preferable to limit the work needed to access data.

Data access describes the way the analysis application retrieves the differentdata. This should create a coherence in the data so that the application canhandle all the data in a similar fashion.

Data transformations are important features in any analysis tool and allowsthe user to modify the way the current data is used. For this case the sky is thelimit but it is in many cases important to not do too much. The most commonly

6

Page 9: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

used ones involve aggregation, counting and filtering, which generally coversmost of the use cases.

Lastly, user flexibility is of utmost importance when designing an analysisapplication. If an application is too flexible, it generally tends to be cumbersometo use, while too limited flexibility does not allow the user to achieve what theuser needs.

A user tends to explore data in a cycle of hypothesis, experiment and anal-ysis where the analysis might produce results or suggest the new hypothesis [4].The user does also not generally care about how the data is stored or accessed.In some cases one might however need to consider expert users who could beusing the application extensively, and more intricate features could thereforepotentially be added to also satisfy this user. The designer could then addmore flexibility which is hidden for a normal user, but could be accessed whenneeded or wanted. This way, an application can appear easy unless you use theadvanced functionality. To make the application very flexible the user can learn,for instance, Standard Query Language (SQL) to query the data sources directly.This requires a high level of expertise. Another option is to use an abstractionlayer, such as a Graphical User Interface (GUI), that gives the user access totransformations that the user can compose together to achieve the wanted result[5].

1.3 Existing platform

Ericsson Research is researching different new radio technologies, largely 3rdGeneration Partnership Project Long Term Evolution (3GPP LTE) but alsoBluetooth Low Energy (BLE) as well as the new upcoming radio technologyfor 5G, NR [6]. To enable this research they are using different simulationenvironments to apply models and techniques and study its performance. Whenperforming such a simulation large amounts of data are generally produced fromwhich the researcher is expected to make conclusions. In lack of an effectiveway of streamlining the analysis process MATLAB has been used to a largeextent, where an abundance of scripts has been used to cover as much of thefunctionality as possible. This has however shown to be tedious and also difficultfor a new user to learn. To tackle this issue Ericsson has chosen to develop itsown Generic Visualization Platform (GVP).

The GVP enables data visualization and is specifically designed to supportdata generated using simulators, however can work for many other sorts ofdata. The built platform has a set of components that a user can apply tograph different charts and aims to enable easy extension by developing morecomponents. It also provides the abstraction layer to the underlying data sourcesfrom the simulators which are stored in SQL-databases. A tool to identifyrelations between data sources has also been implemented which allows fordetection of what data can be plotted together with what other data. This wayhelping the researchers to find relations. It creates all the necessary queries toachieve this by combining the needed tables and retrieve the wanted result.

7

Page 10: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

It is developed in Java using their graphic library JavaFX with functionalitycompatible with Java 2 and later. It has functionality for multiple tabs with onegraph per tab, see Figure 1, where a user can modify certain configuration filesbefore starting the application to alter the type and number of tabs.

Figure 1: Example of the look of the original platform

It furthermore supports a context menu in which a user can, among others,save snapshots, edit relations and open a Settings dialog in which modificationsto the graph can be made.

The existing platform is created around a model which utilizes five different typesof resources apart from the actual source code, a hSQL database, a javascriptfile, an XML file, a CSS file and one or more FXML files.

1.3.1 hSQL database

The application needs data with a specific structure from a hSQL database inorder to function and it uses this data as the sources for finding relations and forthe actual visualization. The database could in theory be formatted in any waydesired but to aid the relation finder the data has a defined supported structurethat is easily generated from used simulators.

1.3.2 XML file

For every runnable application an XML file is needed. This XML file is the rootthat the application opens when being initialized and works as a metamodel ofthe data contained in the database. Furthermore, filters and different scenarios in-

8

Page 11: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

cluding different datasets can be defined. This file is also generated automaticallywhen running simulations according to the settings of the simulator.

1.3.3 FXML file

Through the application FXML file the static GUI layout can be defined beforeapplication launch. This way, the look and functionality of the application canbe altered without modifying the actual source which enables a user to, forexample, decide what graphs to be shown in the application. The format .FXMLis defined by the JavaFX library.

1.3.4 JavaScript file

An application JavaScript file can be executed at runtime and works as acompliment to the FXML file. By creating instances of actual Java objects fromthe source code it can aid in performing actions at startup, such as generating anumber of initialized tabs.

1.3.5 CSS file

The CSS file is used in the same way as when creating web applications, howeverwith some differences in notations, as defined by JavaFX. In this file the generallayout of all custom graphical objects is defined and it contains color schemesused to create a consistent look and feel of the application.

1.4 Other applications

Ericsson did review multiple other applications before deciding to develop theirown visualization platform concluding that none of the existing applicationfulfilled all their needs or would maybe be to intricate and advanced for the usethat was intended. However, these other applications can still serve as referenceand inspiration for implementations of certain features.

1.4.1 OriginPro 8.5

OriginPro 8.5 is a Windows-based data and graphical analysis software [7]. Itallows for a large amount of different 2D -and 3D-plots and supports dataformats from, e.g., MATLAB and LabView through interfaces. It contains signalprocessing features such as FFT and others. It does however come with a heftypricetag.

1.4.2 IBM Many Eyes

IBM Many Eyes was closed down in 2015 after being on the market for nearly 8years [8]. It was mainly a visualization tool rather than focusing on analyzingdata but could serve a great purpose for creating graphical interpretations ofmetadata and such. Therefore not the best suit for analysis of simulation datadespite its creative features.

9

Page 12: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

1.4.3 Sigmaplot

SigmaPlot is a graphing tool developed by Systat Software Inc that contains morethan 100 different technical graph types and offers a wide array of modificationpossibilities [9]. It can be integrated with Microsoft Excel and can import datathrough ASCII plain text, comma delimited, SQL queries and more.

1.4.4 Microsoft Excel

Microsoft Excel is one of the most widely used softwares for graphical visualizationand is popular due to being easy to program and operate, its graphs as well ascalculations [10]. However, it tends to be cumbersome when working with largerdatasets and cannot handle databases such as relational ones.

1.4.5 MATLAB

In scientific calculations, data analysis and visualization MATLAB is widelyused and popular for its large amount of modules that focus on different areasof physics and mathematics. It is furthermore distributed to universities andcompanies through licenses that allows for many users. It allows for scripting,as well as object oriented programming, and can perform many tasks. However,to create an environment for a specific task might require many scripts whichmakes it difficult to keep general. Furthermore, to introduce new users to aset of scripts used for performing tasks can be hard if not using GUI and such.MATLAB does also store all the data in memory which can create issues forlarger datasets with MATLAB causing out of memory. It is the most commonlyused tool by Ericsson Radio Research for analyzing simulation data.

1.5 Usability

Creating a usable application is vital to maintain people using the application.”Usability is a measure of the interactive user experience associated with a userinterface, such as a website or software application. A user-friendly interfacedesign is easy-to-learn, supports users’ tasks and goals efficiently and effectively,and is satisfying and engaging to use” [11]. Usability describes how well acollection of features work, and how they together make the application asatisfiable one. It is generally best determined by the actual user base and thereis therefore importance in finding out what the user of the application desire themost.

1.6 Problem definition

Ericsson has to a large extent chosen to use MATLAB for their visual analysisof simulation data. MATLAB offers great possibilities but also requires athorough knowledge and is hard to make into a general and easy-to-use tool.This is why they decided to develop their own visualization platform, to enabledemonstrations and analysis. This platform has interfaces for the data model,

10

Page 13: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

the data access and transformations and has all that functionality accompaniedby a number of components to represent certain types of graphs and tools. Itdoes however not yet give the user the possibility of playing with the data andmodifying it to aid in the analysis, and lacks many of the standard tools thata user would expect and possibly need. Can this visual platform be developedinto a powerful and usable analysis application, and if so, how?

In this thesis I will study the limitations and possibilities in the platformand perform implementations to demonstrate the possibilities, but also in orderto showcase potential limitations that could be crucial for the platforms furtherdevelopment. The preferable goal is to create a fully usable analysis applicationthat researchers could use for their daily work. This needs to provide thenecessary tools, but also be responsive and properly designed to be usable. Newfunctionality in the Java 8 platform will also be studied and, if found to giveimprovements, be implemented.

2 Theory

2.1 Java/JavaFX

Java is one of the most popular object oriented programming languages thatexists and is widely used for desktop and mobile applications - as well as for backend servers. It, as all the other object oriented languages, is built on the conceptof object orientation with programmable objects representing entities or usedto perform certain cohesive tasks. JavaFX is built on Java, by Oracle, and is alibrary that allows for development using existing graphical objects to representlayout - along with functionality tied to those objects [12]. In JavaFX there is aroot node onto which everything else is placed. Every node, apart from the root,therefor has a parent node and none or a number of sibling nodes and childrennodes. This way interaction between different nodes can be achieved and layoutscan be altered and modified dynamically. It also implements FXML-files forstatic layout design and CSS-files for styling components in accordance to staticdefinitions.

2.1.1 BeanProperties and Observables

Using BeanProperties and Observables enables a flow of information throughoutthe application that is extremely useful for having things trigger on events indifferent parts of the application. A Bean in java is defined as a Plain OldJava Object (POJO) that is serializable, has a zero argument constructor andpublic setters and getters [13]. This concept as been adapted by JavaFX with aBeanProperty class that has subclasses to encapsulate many types of objects byhaving subclasses such as StringProperty, BooleanProperty or SimpleObjectProp-erty for other types. Theses properties, furthermore, enables event handling thatcan trigger on change to the object. By defining a list as an ObservableList or astring as a StringProperty anyone can attach listeners to trigger on when those

11

Page 14: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

objects are altered. It is a part of a concept called Reactive Programming whichhandles the function of different parts of the program reacting to other parts[14]. It enables laziness, in the sense that nothing is performed unless it needsto be performed. For example, an invisible view will only start getting updatedfrom the flow of information once it turns visible. This way, good performancecan be maintained.

2.1.2 Performance

Creating a JavaFX application with quick responsiveness and good performancecan be cumbersome, but there are certain aspect of the structure of programmingthat make the application better [15]. Some of these include using as few nodesas possible, execute as little code as possible, do minimal work on the main FXthread and minimize text measurements. Together, all these form a mindsetthat, if applied by the developer, can make a vast difference on the way anapplication is performing.

2.1.3 Java 8 features

Java 8, that was released in 2014, contained several new features on top of pre-existing functionality, such as Streams. Streams allow the developer to transformany type of collection, such as a list, to a Stream, and apply operations onto thatstream. It can fuse functions together making them into one single operationwhich only is applied whenever the Stream is collected back into a collection.By having functions for filtering, mapping and sorting, complex operations caneasily be attached to a list in order to transform them. These streams canalso become multi-threaded by a simple operation after which the Java VirtualMachine (JVM) that is running the application will try to perform the task inparallel [16]. This is highly advertised by Oracle but may have limited or noeffect in many cases.

2.1.4 Interface

A Java interface is a group of related methods with empty bodies [17]. Themethods can be implemented either by creating an instance of the interface,or by having a class implementing the interface. That way the compiler willforce the class to contain implementations of the methods from the interface.Interfaces can be used to efficiently hide an objects functionality from anotherbut also to allow for interaction with different types of objects that may havedifferent implementations of the same interface.

2.1.5 Singleton

A singleton is a class that has no public constructors but only a method to get astatic instance of the object, see Listing 1. The only way to retrieve an objectof such a type is by using the provided public method that will instantiate theobject the first time it is called, and henceforth return that same object. The

12

Page 15: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

reason behind using a singleton is to allow the entire application to only use oneand the same instance of that object. This way, its properties will be alike forall calling objects.

Listing 1: Example of a singleton

public class Singleton{

private static Singleton singleton;

/**

* Get the static instance of the singleton

*

* @return singleton

*/

public static Singleton getInstance (){

if(singleton == null){

singleton = new Singleton ();

}

return singleton;

}

private Singleton (){

super();

}

2.1.6 Inheritance

Java, along with many other object oriented languages, implements inheritancemeaning that an object can be a subclass, or a child, of a parent class, allow itto inherit certain attributes from the parent class [18]. To easily exemplify, whendesigning an application that models vehicles, the developer could implementa parent Vehicle class with two subclasses, Car and Truck. This due to thefact that both the vehicles share certain attributes, such as speed, directionand numberOfWheels. Along with this, some car -and truck specific methodsthat only apply to them can be implemented in the subclasses. This way, thedeveloper to not have to care about the subclass type when setting its speed ordirection, but only if attempting to access the methods from the subclasses.

2.1.7 RTTI

Run-Time Type Identification (RTTI) is the functionality that allows the devel-oper to identify the type of an object during runtime. This is used when tryingto determine which subclass of a parent class a certain object belongs to. Whenapplied in Java, the instanceof operator is used, see Listing 2. By using thisoperator and cast it to the identified object, methods from that child object notpresent in the parent can be executed.

13

Page 16: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Listing 2: Example of RTTI which would give output ”v1 is truck - v2 is car”if the Vehicle toString()-method would return the objects name. It would alsoexecute the methods specific to those two subclasses

public void rtti(){

Vehicle v1 = new Truck();

v1.setName("v1");

Vehicle v2 = new Car();

v2.setName("v2");

if(v1 instanceof Car){

Car car = (Car) v1;

System.out.print(car + " is car");

car.carMethod ();

}else{

Truck truck = (Truck) v1;

System.out.print(truck + " is truck");

truck.truckMethod ();

}

System.out.print(" - ");

if(v2 instanceof Car){

Car car = (Car) v2;

System.out.println(car + " is car");

car.carMethod ();

}else{

Truck truck = (Truck) v2;

System.out.println(truck + " is truck");

truck.truckMethod ();

}

3 Method

The conduction of this thesis can largely be divided into four different parts.The first part is the study of the existing platform and its architecture. Secondly,there will be a requirement analysis to decide what features to ultimatelyimplement followed by prototyping these features. Finally, there will be a phaseof implementation when the suggested features will be created and integratedinto the existing platform. Throughout the implementation phase continuoustesting will be performed to assure desired functionality and quality.

3.1 Examining the existing platform

The existing platform and implementation was in part studied through thoroughusage of the application alongside reading all the specifications and writtenmaterial. But it was mainly done by examining the existing code base to get

14

Page 17: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

an understanding of the architectural design and code patterns to identify thebest way to extend the current implementations, as well as add completely newfeatures. Furthermore, a course was conducted at Ericsson Research, for newemployees, where their main Radio Access Technology (RAT) simulator thatuse the platform was the subject. This helped create a better understanding ofwhere the data used in the platform originates from and why it is structured theway it is.

3.2 Studying the data model and data access

The data model is a relational one and is defined as a set of tables that containsone or more primary keys. These primary keys are intended to relate differentsets of data in order to enable graphing of different but related entities, seeFigure 2.

15

Page 18: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 2: Example of data model structure

These different tables all relate to one quantity in the output from a simulatorand as can be seen, share one or more primary keys.This data model was studied by examining multiple examples of output databases

16

Page 19: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

from simulations run with their RAT simulator.The platform had an existing implementation of a data access abstraction layerthat enabled choosing different quantities in the graphs based on the content ofthe database. The platform could enable logging of components which enabledoutput of every query that is being sent to the database, from which conclusionscould be had about how the data access is constructed.

3.3 Requirements analysis

The requirements analysis was based on studying other existing platforms as wellas getting an idea of what the researchers wanted. It focused both on concretefeatures to be implemented, but also on more soft values such as responsivenessand design.

3.3.1 Interviews

Interviews was conducted with multiple researchers at Ericsson Radio Research.A questionnaire with more in-depth questions as well as quicker yes and noquestions was produced with the intent to get a better understanding of theneeds of the researchers, how their work is today and what it could become(see Appendix A for the full questionnaire). The response from the conductedinterviews created a basis for the requirements of the final application and whatlimited the researchers today.

3.4 Prototyping

Prototyping was done using the web application proto.io where different viewsand the core of the layout was conceptually created. This prototype served asa main concept for the the oncoming implementation but did not necessarilyrestrict the way features could be implemented.

3.5 Implementation

Implementation of the suggested features was done in an agile fashion wherethey were continuously evaluated, tested and documented. Some extreme pro-gramming concepts were applied with the objective to write the tests for certainparts before making the actual implementation. The concrete features werecreated in accordance with the existing architecture and thus implemented inthe code were evaluated to be best suited.

3.5.1 Commenting

The code needed to succumb to commenting standards that is set by the develop-ment team at Ericsson Radio Research. This to keep the code self-documentedand to facilitate easier understanding of what the implementations actuallyperform, and how.

17

Page 20: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

3.5.2 Unit Testing

Unit testing was conducted for all the produced code in accordance with existingstandards. Unit testing is done through the codes public methods which areexecuted and evaluated. However, when developing graphical applications, someparts of the code might be programmatically unreachable due to only beingtriggered by user interactions on the GUI. To aid in this a helper was created toalso directly test certain private methods. The helper used a Java methodologycalled Reflection through which private methods can be acquired, executed andevaluated.

3.5.3 Verification and validation

Apart from the continuous testing done during the development, both manuallyand using unit testing, more thorough conceptual testing was also done forverification purposes. When implementations had achieved a reasonable resultthe application was continuously tested by a panel of researchers. The goal ofthis continuous testing was to make sure that the application stayed on track andsatisfied the needs of its future and current users, this way making the result lessbiased on my own clouded judgment. The researchers where given a thoroughguide on how to set up and get started with the application and where thenasked to fill out a form, ranking different features and experiences on a scalefrom one to ten (see Appendix B). This was then conducted on a weekly basis toget a idea of the progress of the application and to make sure that things thatworked well kept on working well, as well as identifying issues in order to solvethose.

3.5.4 Code Review

The code was scrutinized via code review performed by senior researchers. Thiswas done by other developers within the application community in order to ensurequality and code standards and to potentially bring the projects implementationsinto the main official branch of the code after completion.

4 Requirements

As a result of the conducted requirements analysis several requirements for theapplication were decided upon. They were set as guidelines for the furtherdevelopment and used when evaluating the initial goal.

• It shall enable the user to modify and alter any graph to their liking

• It shall allow the user to dynamically modify the layout and functionality

• It shall correctly relate different datasets to aid in selecting the attributeson a graph

• It should clearly show the user the current datasets

18

Page 21: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• It should provide tools to aid in and simplify the analysis of the grapheddata

• It must be responsive to use without too much lag

• It should have an easy to use design with quick access to functionality

• It may enable the user to export graphs to a PowerPoint presentation

5 Prototype

The prototype, created in proto.io, was the graphical result of the decidedrequirements. They indicated that certain features should be available and thatthose should be easily accessible by the user when analyzing using the application.This resulted in certain main decisions regarding the design.

• For the sake of getting a clear view of the underlying set of data a viewshowing that data should continuously be visible for the user. This viewcould also implement further functionality to allow the user to interactwith that data, but with a main focus of simplifying the way the user viewsthe data that the user is conducting an analysis of.

• In order to be able to modify the look of any graph on the fly the usershould always have a view visible with tools for altering the graph. Thisview should be implemented so that settings changed in the view directlyaffects the correct graph, in other words, no need for changing a settingand then clicking Apply to get the change to have an effect.

• To enable the user to quickly change between different graphs a drag-and-drop view should be visible containing different types of graphs that theuser can choose from. These graphs will be based on the ones alreadyimplemented in the platform and by dragging and dropping one onto acurrent graph (or empty view), a graph of that type will appear and beready for plotting data.

• To allow the user to choose what views to see there should be possibilitiesto change the sizes of the windows in order to let the user prioritize whatview the user feel is the most important. For example, if wanting a largergraph, the user can resize the other views to take up little space in orderto enlarge the graph.

These four main decisions regarding the design resulted in the initial proto-types. The prototype of the application with a default look can be seen in Figure3 and it shows a central view where a graph would be, a left view showing thedata sets, a top view with different types of graphs as well as a right view thatwould contain tools for the graph.

19

Page 22: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 3: Prototype of the main view of the analyzer application

As the application also strives to allow the user to alter its look, dependingon the users preferences, hide buttons were placed at the secondary views inorder to minimize them so that more room is dedicated for the main view ofthe graph. This can be seen in Figure 4 where the two side views have beenminimized.

20

Page 23: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 4: Prototype of the analyzer application with the visibility of the sideviews removed

Further on, a Log View was thought of in order to enable log outputs fora user that has no access to a debug environment, for example a user runningthe application as an executable. The platform contained built in functionalityfor toggling logging on and off for graphs, and if set to on, logs were printed inthe System output of the application. This output is however only available ifthe user runs the application with a command window or through an IntegratedDevelopment Environment (IDE). For ease of use and distribution, runningexecutables might be preferable, and in such a case enabling log output in theactual application could be desired. This view was not laid out in the prototypelayout.

These prototypes were created before the actual features were implementedand served, when applicable, as strong guidelines for how the implementationswere to be made. They did not however restrict the implementations in anyway, and if other solutions were deemed better they could be implemented eventhough they were not on par with the prototypes.

6 Result

6.1 Architecture

The main architecture and conceptual design of the application was createdbefore implementations began and served as an aid in keeping up the structureof the created functionality. However, due to certain things being implemented

21

Page 24: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

within existing code, and other in new modules, it was not used to limit thepossibilities but could be reviewed and altered as insights and new knowledgewas acquired throughout the process. The main feature of the design wasto encapsulate the existing platform within the extended functionality ratherthan adding all the new features to the existing ones, which can be seen inFigure 5 where the Visualization Platform represents the original encapsulatedimplementation. An extensive amount of changes where however also made toparts of the original code in order to achieve desired functionality.

Figure 5: View of the high level architecture of the implemented application

6.2 Attribute relations

In order to achieve correct relations between different attributes there was aneed to implement a way to restrict which attributes the user could plot relatedto one another. The already existing relation finder used the primary keys (seeFigure 2) to create relations between different attributes. This did however onlydiffer between different data sources as a whole, and not between the individual

22

Page 25: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

attributes that those data sources are constructed of. This resulted in thepossibility to plot an attribute as a function of a primary key associated with adifferent data source than the original attribute. This may sound like somethingreasonable but due to the nature of the stored data, these primary keys aresubsets of the same set, but not necessarily equal.

For example, suppose that we have two related data sources, see Figure 6,containing two main attributes, bitrate and coordinate, as well as a numberof primary keys. We could then relate the bitrate to the cellId by using thefour primary keys in the Bitrate table, matching them to the same keys in theCellCoordinate table and get the cellId :s.

Figure 6: Example of two related data sources with the primary keys in boldtext

In this case it would give us that we have bitrate = 1000 for cellId = 2 if weaggregate the result as far as possible.

If we however want to find the bitrate for every user, then it is importantto get the bitrate for every user in the Bitrate table, and not try to make it

23

Page 26: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

as a function of the userId in the CellCoordinate table. This due to the factthat these are both a subset of all the users, but not necessarily, and not in thiscase, the same subset. The implemented feature does therefore enable so that auser may only be able to select appropriate attributes with one another. Whenselecting the Y attribute, the user can choose in all the data sources between allthe attributes. For example, a user can select objectBitrate, see Figure 7.

Figure 7: Selecting the Y attribute, here able to select between every attribute.

When the user thereafter selects an X attribute the user is not allowed tochose between the same attributes as before, see Figure 8. Will here denote thealready chosen Y attribute attrY , its data source Y, and other possible attributesas attrN for its corresponding data source N. I will further denote an attributethat is a primary key pki, and define its presence in a data source N as pki ∈ N .The set of all primary keys is denoted PK and two related attributes can beexpressed as Rel(attrK , attrN ). At this stage when have selected attrY as theY attribute, the user can select the X attribute as one of these three differenttypes.

• Can select an attribute attrN if attrN = pki ∈ Y

• Can select an attribute attrN if attrN = pki /∈ Y ∈ N and Rel(attrY , attrN )

• Can select any attribute attrN if attrN /∈ PK and Rel(attrY , attrN )

So in the case of Figure 8, the user first selected objectBitrate. To conform to thepreviously stated rules, the user should afterwards only be able to select primarykeys from the data source of objectBitrate, other related primary keys of otherdata sources or related non-key-attributes of other data sources. In the figure wecan see that the user can select between five keys in the actual objectBitrate datasource, two other keys from the cellZCoordinate data source as well as all the

24

Page 27: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

non-key-attributes of the other data sources, such as mobileStartPositionX/Y/Z,cellX/Y/XCoordinate etc.

Figure 8: After selecting the Y attribute, selecting the X attribute. Now filteredso that only reasonable attributes show up. Only primary keys of the selectedY-attribute, as well as those that only exist in other data sources, and the mainattribute of those sources

With this implementation and improvement ambiguous plots could be pre-vented by only allowing proper creation of relations between different attributes.This can be exemplified and visualized in Figure 9 where the same attributeas previously is marked green and is the chosen Y attribute, the blue ones arekeys from the same data source, purple one are other keys in other data sourcesand yellow ones are regular attributes of the other data sources. Furthermore,attributes with a red line are not selectable. In this case there can be observedthat same keys in other data sources can in theory be selected from either ofthose data sources. However, in the actual implementation this simply dependson where the search algorithm looks first and is able to establish the relationship.This could potentially result in more or less data points in the result but should,with proper output from a simulator, not make a difference. And important tonote is that it will never affect the correctness of the result, only the magnitudeof it.

25

Page 28: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 9: Overview of example of primary keys and data sources showing aselection of the green objectBitrate and the three different related and selectableattributes

26

Page 29: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

6.3 Plot Tools

The view containing tools for altering the graphs and their components wasprototyped to be located to the right hand side of the application, be able tobe expanded and minimized, and continuously react to changes in the graph aswell as immediately apply changes to the selected graph. The visual platformthat the analysis application is based on did have a settings functionality as adialog window, see Figure 10. This was reached by right-clicking the graph andselecting Settings. This view was then populated and rendered when enabledand had no need to be synchronized to the properties of the graph unless it wasshown. The changes then effected the actual graph whenever the button Applywas clicked. This was however deemed insufficient since it does not give the usera continuous overview of the graph the user is currently analyzing. Furthermore,by implementing ability to modify components within the actual graphs thesettings were extended with settings to modify lines and legends.

Figure 10: View of the old settings view for a graph LineChartComponent

6.3.1 Graph settings

In order to achieve Plot Tools that possibly are visible all the time the func-tionality needed to initially be mimicked in order to achieve the wanted result

27

Page 30: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

without affecting the architecture. The same set of settings was taken fromthe dialog window and moved to a view incorporated in the application, seeFigure 11. What is shown for a particular component was already defined forthe platform and has not been altered.

Figure 11: View of the application with the Plot Tools for a graph LineChart-Component

The previous functionality allowed for right-clicking on a specific graph andthen showing the settings for that graph. For these updated Plot Tools therewas a need for the view to be able to identify which graph was in focus. Theanalyzer therefore needed to always keep track of one component which currentlyis the selected one. This took several iterations and always added complexitywhen more functionality was added. Certain actions needed to trigger theswitching between selected graphs and many scenarios had to be handled. Thisfunctionality evolved throughout the process and will be described more furtheron.

One further aspect was to have the settings continuously apply made changesto the graph, as well as changing whenever the graph changes. The initialimplementation of the platform had a well defined architecture of configurationsfor graphical components and was used and altered for this purpose. Ratherthan loading the attributes of the graph into the settings view when shown

28

Page 31: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

and setting the attributes on Apply, the attributes were simply bound to one-another to create a one -or bidirectional relationship. This was achieved byusing an abstraction in JavaFX called BeanProperties. These act as placeholdersfor an attribute of a defined data type but also allow for invalidation -andchangelisteners as well as bindings to other properties of the same kind. Anexample would be to change the name of a component through the name textfield in the Plot Tools. This property can only be changed in the tools, not inany way by interacting with the graph. They therefore do not need to effect eachother bidirectionally but only in one way. This can be achieved as in Listing3 by having the text field setting its text to the property and then attachinga listener that makes sure that the property always has the same value as thealtered text field.

Listing 3: Example of connecting a text field to a string property

nameTextField = new TextField(component.getName ());

nameTextField.textProperty ().addListener(new

ChangeListener <String >() {

@Override

public void changed(ObservableValue <? extends

String > observable ,

String oldValue , String

newValue) {

component.setName(newValue);

}

});

Sometimes, however, a property can be altered both from interactions with thegraph, as well as through the Plot Tools. An example of this is the bounds ofthe axes that can be set in the Plot Tools, but that also changes when a userzooms or pans in a graph. To make so that the bounds in the tools changewhen the user pans, but also make the actual axes change when a user altersthe value in the tools, a bidirectional bind can be applied, see Listing 4. It usesthe JavaFX library Bindings to create the binding and when applied makes surethat a change on either side will bubble up to the other property. This can eitherbe done by having the same type of properties on each side, but can also beachieved using a converter when the properties are of different types. When, forexample, converting a String into a number the used Locale is important, whichdefines in which format the String displayed the number, something that differsbetween different countries. The key in this case, if controllable, is simply to beconsistent.

Listing 4: Example of bidirectionally binding a textfield to a number property

StringConverter <Number > converter = new

NumberStringConverter(locale);

Bindings.bindBidirectional(textProperty1a (),

numberProperty1b (), converter);

29

Page 32: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

By applying both of these techniques a fully functional tool window could beimplemented that is in continuous synchronization with the selected graph.

6.3.2 Line settings

To further extend the functionality of the Plot Tools an ability to alter elementswithin a graph was added. These settings are reached by clicking on an item inthe legend, see Figure 12. Within this view there is the ability to modify thetext of the legend item and set the width of a graph element, such as a line ordot. The color of the element can also be altered, see Figure 13 as well as thevisibility, see Figure 14.

The graphs and its graphical elements have been implemented in a certainway in the pre-existing architecture and they were not designed with the optionof modification in mind and are therefore hard to persistently modify. To achievethis functionality a top level ”pipe” was therefore implemented through whichevery selected graph is sent before being shown. This pipe must keep track ofall the existing, possibly modified, graphs and is therefore updated as soon asgraphs are added or removed. It acts as a layer that is put on top of the graphsand alters properties of the them before they are shown. This way the desiredfunctionality for the application could be achieved without making any largerchanges to the core architecture of the platform. And since these changes aremainly visual, there is no need to alter the actual objects but only to modifythem before showing.

30

Page 33: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 12: View of the application with the Plot Tools for a line in a LineChart-Component. Note the highlighted legend item that has been clicked to show thisview.

31

Page 34: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 13: View of the application with the Plot Tools for a line in a LineChart-Component with the Color Picker expanded and a new color selected

32

Page 35: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 14: View of the application with the Plot Tools for a line in a LineChart-Component with the line set to invisible

The Plot Tools always shows settings for a graph, as long as there is a graphopen. However, if the application is initialized without any graphs or if they areall removed the Plot Tools will get empty and enter a loading state, see Figure15. This state will be maintained for as long as there is no graph opened.

33

Page 36: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 15: View of the application with the Plot Tools when no graph is open

6.4 Data Source View

The Data Source View was constructed with the main purpose of giving theuser an overview of existing data but to also have functionality for adding thatdata to a desired graph. The resulting view consisted of an expandable list ofthe different data sources, see Figure 16. These data sources then contained itsown attributes which can be clicked in order to add as an attribute to a graph,see Figure 17.

34

Page 37: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 16: View of the application with the Data Source View showing.

The Data Source View gets the data sources from the first graphical compo-nent that is opened in the application and is thus empty, and loading, wheneverthere is no graph open in the application, see Figure 18. By design of the existingplatform, every graph always has access to the same set of data sources andthe view will therefore not have to re-populate the list when a user is switchingbetween different graphs.

35

Page 38: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 17: View of the application with the Data Source View showing and theuser selecting to add an attribute to a graph

36

Page 39: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 18: View of the application with the Data Source View showing but nograph open

6.5 Chart Chooser View

The Chart Chooser view was prototyped to be located at the top of the applicationwith a visual list of charts to choose from. This to make it easy for a user toon the fly select new types of graphs to use. The list was implemented for anumber of graphs, see Figure 19, and given drag-and-drop functionality to add achart in order to then create plots in a graph of that sort. Given an applicationthat initializes with no existing tabs, a chart can be dragged onto the Tab Barwhich creates a new tab containing a graph with the chart that was dropped.When this is done, the application contains one tab. Another chart can now bedragged, either onto an existing graph to replace it within the context of the tab,or onto the Tab Bar to add yet another tab, resulting in two tabs, see Figure 20.Every tab will be named the same as the original graph that it contained butevery tab has functionality to move its position and rename it, see Figure 21.

37

Page 40: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 19: View of the application with the Chart Chooser View showing withno graph added

38

Page 41: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 20: View of the application with the Chart Chooser View showing with 2tabs added

39

Page 42: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 21: View of the application with the Chart Chooser View showing with 2tabs added

The Chart Chooser view does not contain enough types of charts to fill upthe width of the application, unless its width is considerable reduced, but theview contains a list and is scalable in the sense that more charts easily can beadded. Had there been enough charts to fill the width and more, the user couldbe able to navigate between them by side-scrolling the list of charts.

The drag and drop functionality was implemented by adding an EventHandlerto all the items of the list of graphical objects in the view that can trigger ondetection of a drag. Once a drag is commenced, a DataFormat object is addedto a DragBoard, which is a built in functionality in JavaFX. When the user hasthe mouse pressed down and is performing a drag, elements in the applicationcan have implementations of a DragOverEventHandler that triggers as soonas a drag is dragged over that object. This way, the cursor of the applicationcan be altered when the drag is over certain objects, indicating to the userwhere the dragged object can be dropped. If dropped on an object that has animplemented DropEventHandler, that object will check that the dropped formatis of a correct type and then perform actions. This way, for example, a LineChart can be dragged onto a graph and there will then be a line chart on thatgraph when dropped.

40

Page 43: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

6.6 Multiple graphs per tab

The Chart Chooser will, as previously shown, create tabs that initializes as onesingle chart. In many cases a user might however want to have multiple graphsvisible at the same time to more easily be able to compare them. This canbe achieved by the user by using the buttons above the graph content. Thesebuttons are Radio Buttons, meaning that one and only one of them can beenabled at a time, giving the user the ability to change how many graphs toshow, and with which layout. The six current supported layouts are

• Single Graph - One single graph

• Two graph horizontal - Two graphs, next to each other, horizontally

• Three graph horizontal - Three graphs, next to each other, horizontally

• Two graph vertical - Two graphs, next to each other, vertically

• Three graph vertical - Three graphs, next to each other, vertically

• 2x2 matrix - Four graphs in a two-by-two grid

where the last one, the two-by-two grid, can be seen in Figure 22. Thedifferent layouts are always composed of SplitPanes, which are graphical viewswith separators that can be dragged to alter the size of the different components.Therefore, the user can always resize the graphs to his or hers preference, seeFigure 23.

41

Page 44: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 22: View of the application with the Chart Chooser View showing and a2x2 grid view of graphs

42

Page 45: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 23: View of the application with the Chart Chooser View showing and a2x2 grid view of graphs where the sizes of the charts have been modified, and asecond chart has been added. Also note that the topmost chart is the selectedone, with a remove-button in its top-right corner.

An empty part of the layout will always contain the text Drag and drop acomponent until a graph has been added to that part, see Figure 23. When agraph is selected it can be removed by clicking the remove button, and that partwill become empty.

6.6.1 Selecting the chosen graph

Keeping one chart as the selected chart has been mentioned previously and ismainly important in order to maintain the correct information and layout forthe Plot Tools view. This is handled by a property in the analyzer and can beset in multiple ways.

• Whenever a new tab is selected, the first graph in that tab will be theselected one

• If a selected graph is removed, the first graph in the same tab will beselected

• If a user interacts with a graph, then that graph will become selected

• If the selected tab has no graphs, there will be no selected graph

43

Page 46: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• If there are no tabs, there will be no selected graph

How a user can interact with a graph will be presented in section 6.9 andthe effect of having no selected graph sets the Plot Tools and Data Source viewin empty loading mode as described in section 6.3 and section 6.4.

6.7 Log View

To allow a user to easily get more insight about what is happening to certainobjects in the application a Log View was implemented. It was not laid outin the prototype design but was chosen to be placed in the bottom center ofthe design. It initializes as an empty window, with the message No logs yet..,and can be resized like all other windows and contains a Clear button to clearthe log and start from scratch, see Figure 24. The Log View uses a createdLogger as well as a LogSubscriber interface to receive all the wanted logs fromthe application.

6.7.1 Subscribable Logger

The logger used by the Log View is implemented as a static singleton-class, inother words, one instance of the object for the entire application. The objectcontains one StringObject field that is set by the application as soon as a logmessage is being logged. On this field, an InvalidationListener was attachedto perform an action whenever the string is being altered (invalidated). Byallowing other classes to subscribe to the logger via an interface, LogSubscriber,and mapping each subscriber to a unique listener, the Logger can maintain a setof listeners connected to each subscriber and also support unsubscribing. Eachclass using the LogSubscriber will implement the interface and receive everylog message in the defined method and can then choose what to do with it.Logging can be enabled and disabled for each graphical component and can alsobe implemented wherever desired within the application.

44

Page 47: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 24: View of the application with a filled Log View in the bottom

6.8 Application with all the views

All the new and added views described throughout the result together form themajor additions to the new and improved GUI. They all combined allow the userto overview the current data, to alter settings for graphs, add further graphs aswell as inspect log outputs. And these views all surround the only original view,the actual graph, see Figure 25.

45

Page 48: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 25: View of the application with all the major views

A user can, as described, resize all the views by dragging the separatorsbetween all the views. This way, the user can enlarge parts of the application heor she finds more important for the time being. Certain views have a definedmaximal size, depending on its content, which in cases can prohibit furtherenlarging. There is always also a possibility to click the View button in thetopmost part of the application and use the menu to select and deselect eachof the views to completely remove them or add them back to the GUI. This tofurther allow the user to modify the look and feel of the application.

6.9 Graph interaction - Panning and zooming

One important aspect of the application was to enable the user to play aroundwith the visualization of the data and to have access to basic functionality suchas panning the graph as well as zooming. These are enabled to the user by thehotkeys

• CTRL+Scroll - Zoom

• CTRL+Drag - Pan

• Scroll - Pan up&down

• ALT+Scroll - Pan left&right

46

Page 49: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

6.9.1 Scroll zooming

Zooming using the scroll is enabled by holding down CTRL while scrolling.When scrolling up, the view is zooming in, and when scrolling down it is zoomingout. The graph will zoom with a certain factor for every scroll and will do so byscaling the axes of the graph. This is done by making the place where the userhas the cursor maintain the same ratio within the graph, enabling for the userto aim the zoom at a certain object, see Figure 26.

47

Page 50: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 26: Example of use of scroll zoom, showing that a zoomed object in focuskeeps the aspect ratio - in other words, remains on the same place despite beingenlarged.

This is achieved by calculating new xstart, xend, ystart and yend and thenscale the axes to those. To exemplify, if xcursor is the cursors x-coordinate andthe scalefactor is a floating number that indicates the scroll speed, calculatingthe new length of the x axis

48

Page 51: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

xlength = xupper − xlower

where the ratio of where the cursor is on the axis is

ratiox = xcursor−xlower

xlength

and the new length of the axis is

xlength,new = xlength ∗ scalefactor

After this, the starting x value is calculated by

xstart = xcursor − ratiox ∗ xlength,new = xcursor − xcursor−xlower

xlength∗ xlength ∗

scalefactor = xcursor − (xcursor − xlower) ∗ scalefactor

and the ending x value of the axis by

xend = xcursor + (1 − ratiox) ∗ xlength,new = xcursor − (1 − xcursor−xlower

xlength) ∗

xlength ∗ scalefactor = xcursor − (xlength − xcursor + xlower) ∗ scalefactor =xcursor − (xupper − xcursor) ∗ scalefactor

With these new values the range of the axis can be set, and if done for both theY and X axes, will create a more zoomed in (or zoomed out) view where thefocused object, i.e. the position of the cursor, remains in the same position asbefore.

6.9.2 Scroll panning

Panning using the scroll is enabled by either simply scrolling or by holdingdown ALT while doing so which results in a sidewards pan. This was simplyimplemented by calculating a scrollspeed, depending on a defined value and theaxis range, and then adding or subtracting that to the end-values for every scrolland setting the new range. The reason to use the scrollspeed is to maintain areasonable speed for scrolling both upwards, downwards and sidewards. Sincethe axes may have vastly different ranges a static speed for all cases cannot beused since it may scroll too fast or slow in either direction and not make for apleasant experience.

6.9.3 Drag panning

Panning using the mouse is enabled by holding down CTRL and pressing themouse on the graph and holding it down while moving it which results in theaxes continuously changing in accordance to how the mouse moves. For thisfeature the functionality needed to take into account that it deals with twodifferent metrics - both the actual cursor coordinates, within the context of theapplication, as well as what that corresponds to in terms of actual axis locations.

49

Page 52: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A factor between the axes range and the actual height and width of the graphwas calculated by

xfact =xlength

widthgraph

yfact =ylength

heightgraph

and by keeping track of every cursor location and using that for the nextcalculation, a delta could by calculated by

dx = (xcurrent − xlast) ∗ xfact

dy = (ycurrent − ylast) ∗ yfact

which then creates the new xstart, xend, ystart and yend by

xstart,new = xstart,old − dxxend,new = xend,old − dxystart,new = ystart,old + dyyend,new = yend,old + dy

which then constitutes the axes new ranges. The reason for subtraction inx direction and addition in y direction is that this coordinate system, as mostother graphical layouts, has the origin in top left corner rather than the bottomleft that typically is used in graphs and such. The y axis therefore increasesvisually downwards, contrary to the usual upwards increase. The x axis on theother hand grows rightwards in both the cases.

6.10 Line tracking

A line tracker was implemented to improve a users possibility to quickly find thevalues of data points within the analyzed data. It works for multiple number ofdatasets within a graph simultaneously and will automatically select the datapoint closest to the cursor, as long as the cursor is within the boundary of thegraph, and show the name of the dataset along with its X -and Y value for thechosen data point, see Figure 27. It can be enabled either by the selecting thecross-hair shaped cursor or by, with any cursor, pressing down ALT+Mouse1and moving the mouse across the data points.

50

Page 53: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 27: View of the application with the line tracker in use, showing thename of the series as well as the X and Y value of the selected data point.

The line tracker was implemented by keeping track of the current cursorposition, and for every time the cursor is moved, iterate over all the data andselect the data point that is closest to the cursor. And when done so, show aPopup window with information about the data point. Every time the popup isshown, its width is measured and the anchor point, meaning the coordinate towhich the popup is attached to, is calculated. To avoid bad visualization theseare used to, when needed, flip the popup horizontally, see Figure 28. This hasto be done if the application is positioned close to the edge of the actual displayand the popup will be extended outside the displays bounds. By inverting thepopup whenever needed it always accurately anchors the correct data point andshows the correct information, no matter where on the screen the application orthe data point is.

51

Page 54: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 28: View of the application with the line tracker in use, where the popupwindow has been flipped due to too close to the displays edge.

6.11 Usable quick buttons

To simplify the usage for users and give them easy access to certain functionalitya number of quick buttons were implemented. Most of them have been mentionedin previous sections when applicable but all together make up an important partof the interface the user has towards interacting with one or multiple graphs inorder to efficiently analyze a given dataset. They are all located in the vicinityof the graph to simplify use, see Figure 29, and some are designated to the entiretab whereas some are unique for every graph.

52

Page 55: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 29: View of the application with all the different types of quick buttonshighlighted. BLUE - layout mode, RED - cursor mode, GREEN - reset axes,ORANGE - close graph and PURPLE - enable and disable grid.

6.11.1 Layout mode bar

The Layout mode bar is a tab property and therefore every tab contains one andonly one. Its purpose is to enable the user to select the layout of the tab withthe possibilities of several horizontal, vertical and grid layouts. Its state can bedifferent between different tabs, depending on what the user has chosen, but aselected state for a tab will stay selected until a different state has been selectedon that same tab. The reasoning for this should be obvious but is simply togive the user the possibility to have different layouts for different tabs, all at thechoice of the user.

6.11.2 Cursor mode bar

The Cursor mode bar is more of an application property, however requires atleast one tab in order to be present. Its purpose is to enable the user to selectthe functionality and look of the cursor, ranging from a normal arrow, a handto enable drag panning or a cross-hair to enable line tracking. Its state is thesame across all tabs and is thus independent of which tab is chosen. The reasonbehind this is to have consistency even when the user is switching between tabssince the user might want to perform the same action, but only on a differentgraph.

53

Page 56: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

6.11.3 Reset axes button

The reset axes button is located in the top left corner and provides a conveniencefor the user by resetting the axes to fit the content in all directions, in otherwords, making all the content visible and filling up the entirety of the graph.This is to quickly allow the user to go back to the way the graph initially lookedif the user has been working with the graph by zooming and such.

6.11.4 Toggle grid button

The toggle grid button is located in the bottom right corner and allows the userto quickly enable or disable the grid of the graph. This to enable the user toquickly enable it for analysis or disable it before visually exporting it.

6.11.5 Close graph button

The close graph button is located in the top right corner and simply closes thegraph and removes it from the containing view in which it was in. This resultsin the view instead having the text Drag and drop a component and can alsoresult in the Plot tools and Data Source view being set as loading if the closedgraph was the last visible one in that tab.

6.12 Tutorial view

To make the use of the application more easily digested for a new user a desire foran intuitive tutorial was desired. This can allow the user to get a quick insightin the applications functionality and how all the different tasks are performed.To achieve this, a Tutorial View was implemented. It can be accessed throughthe Help menu in the top of the application. It will open up a new windowcontaining a media player set to play a video. Furthermore, it has control buttonsfor playing, stopping and pausing as well as a progress bar on which a user cansee how far the video has gone as well as for selecting a certain time to changethe video to, see Figure 30. It is currently implemented to play one single videothat can be updated or altered and which is stored within the source code. Thisway, if creating a sophisticated video tutorial to aid new users, the only thingneeded to embed it into the application is to insert it into the designated locationwithin the source and it will automatically be enabled for playback within thisview.

54

Page 57: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 30: View of the Tutorial View currenty playing a video of the applicationwith playback buttons highlighted in blue, time slider in green and volume inpurple.

6.13 Power point exporter

For many organizations presenting results and findings using Powerpoint is widelyused. In order to simplify showing a graph in a presentation a Power pointexporter was implemented. It utilizes a library called Apache POI to enablereading, creating and editing presentations. It has been graphically implementedas two buttons and a text field in the top of the application, see Figure 31, wherethe user can select an existing .pptx-file or create a new one and then use theexport button to export the currently selected graph.

55

Page 58: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 31: View of the application with the bar for exporting to Powerpointhighlighted

The exporter uses the commenting functionality in a slideshow to identifygraphs and in order to make the right decisions. Whenever a graph is exported toa slideshow that it has not previously been exported to it is added on a new slideat the end of the presentation with a corresponding comment on the slide whichindicated what graph the slide contains. However, if exported to a presentationwhere a previous version of the graph already exists, the exporter will identifythis and instead update the image in the presentation. This is communicated tothe user via popups that are shown for a short time after exporting, see Figure32.

Figure 32: View of two different shown popups when exported a graph to aPowerpoint

The exporter does also have a function through which a user can export allthe current graphs in the tabs. This does however pose a risk when being used.

56

Page 59: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

The reason is due to the fact that not all the graphs are loaded at the pointwhen the exporting is initialized and may potentially not load in time which willresult in exported empty graphs. It is thus recommended to export each graphby its own despite it being more time consuming.

The exporter did work poorly for a long time during the project, this dueto a recognized bug within the used library. However, towards the end of theproject Apache released a new version in which the issue was fixed. Usingthis newer version, the previous problems could be avoided which resulted in afunctioning Powerpoint exporter.

6.14 Adding filters

To be able to easily filter the analyzed data on certain attributes has shownto be an important feature for the researchers. This enables to easily alter thelook of a graph to study different characteristics and can also allow the userto compare results from different iterations. To enable the addition of differentfilters a Filter View was implemented in the application. The filters reside onthe same place as the graphs, in the Chart Choser Pane. From there, a user candrag and drop a filter onto any graph which will add that filter to the FilterView, located below the graph or graphs, see Figure 33. This view can containas many filters as the user wants and every dragged filter will be added to theview. The user can remove any filter by clicking its Close Button, and also hidethe entire view through the View menu in the top of the application.

Figure 33: View of the application with two added Time Filters, dragged downonto the graph from the Chart Choser Pane where two types of filters are visiblein green.

57

Page 60: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

The supported filters correspond to attributes that are commonly filteredwhen analyzing simulations, but more general filters can be created beforeapplication launch through the XML file. Every added filter is registered withinthe entire application and automatically applies to all the existing graphs. Auser can however, also, enable and disable every filter, individually for everygraph, by right clicking the graph and utilizing the menu.

6.14.1 Bad data removal

Whenever a simulation is being run with users being generated with a certaindistribution the simulated system experiences an initial ramping of user numberwhich then gets saturated when the system gets stable, i.e. when users spawnand die at an equal rate. The time before this saturation happens depends on theaverage lifetime of a user. In many cases, when conducting a study, a researcherdoes not want to study the time containing users that where alive before thesystem became stable since the conditions before stability differs from the overalldesired and studied model. To enable this type of processing a button was addedto the the Time Filters, see Figure 34, which will automatically generate a graphplotting active users as a function of time.

Figure 34: View of the application with a graph of active users over time. Greencircles indicate when user numbers get saturated in this simulation, around 10seconds, and red indicates to which time a researcher might filter away the users,around 20 seconds. The orange box shows the button used to automaticallygenerate an appropriate plot, the one showed in the figure. In the top, the iconfor the Time Filter can be seen in green colors.

From this plot a user can easily, quickly and clearly get an understanding ofhow far the time should be filtered to get rid of the ”bad users” in the beginning

58

Page 61: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

(and potentially the end). After doing so, the user can drag the filter slider toalter it, see Figure 35. This will result in the X axis of the showing graph to alterits bounds due to all the excess data being filtered away and will furthermoredo the same to all the other graphs. They will therefore all visualize the dataaccording to the users desire.

Figure 35: View of the graph of active users over time after filtered away thefirst 20 seconds

Applied filters can furthermore be selected and deselected individually forevery graph which can be used when comparing different scenarios. Therefore tosimilar graphs can be initiated, with one applying a filter, see Figure 36. Here onecan observe that the Time Filter filters out the first half of the simulation timebut how the left graph looks similar to how this graph has looked throughoutthis report. The right one, however, lacks some of the initial users and hasdifferent characteristics for the certain parts of the graph. This due to the rightone applying the filter while the left one does not.

59

Page 62: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 36: View of the two graphs with the same attribute where the right onehas the applied filter located below the graphs

This functionality of automatically generating the ActiveUsers graph isspecifically designed for the used RAT simulator that researchers at EricssonRadio Research uses but can easily be modified and extended to achieve similareffect with something different.

6.15 Performance

To make the application usable it needs to deliver a reasonable performance interms of responsiveness. The performance of the application as a whole wassufficiently fast at the start of the project and maintained this throughout theprocess with one exception. After implementing multiple graphs per tab andother functionality the applications swiftness drastically worsened. This dueto already deeply implemented code that keeps all the views updated. It doesso by updating its content whenever certain actions happen. An example ofsuch an action is when the bounds of a graph is being changed. This happenswhen changing the size of the entire application or, in the Analyzers case, whenthe user resizes any of the views around the graph by dragging the separators.When doing so, the application previously resized and updated all the contentcontinuously as the size changed. This worked sufficiently when only one graphcould be effected at a time but would, with the possibility of different layouts,have an impact on multiple graphs simultaneously. Since the updating of thecontent is performed on the main thread, updating multiple graphs continuouslycaused severe lag when resizing views.

To tackle this issue a less optimal updating scheme was implemented where the

60

Page 63: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

graphs only update its content when the resizing is finished. It was achievedby using a timer task that continuously measures the time since the last resizeaction (which will be very small if the user is currently resizing). Whenever thistime is smaller than a defined number, in this case 200ms, it creates a new taskthat once again measures the time, and this keeps happening until the user hasstopped resizing and the time gets bigger than 200ms. The content of this graphis then updated. This allows a user to freely resize, without lag, but results inthe graphs not always being synchronized with the size of its container duringthe actual resize.

6.15.1 New Java 8 functionality

With the launch of Java’s 8th version, some new functionality was released.Some of this functionality can be used to replace iterative functions and helpwith filtering, sorting and mapping. By profiling the entire application usingJProfiler 10, implementation of the new functionality was evaluated. Mainly theuse of Streams would allow for certain potential syntactic improvements, andhave a built in call for parallelizing operations. The parallel()-action that can beapplied to a stream supposedly multi-threads the following performed operationswhich in theory should improve the speed. One does however need to take intoaccount the potential time it takes to actually parallelize, the overhead thatcomes in when doing so and also how well it is able to achieve the parallelization.It is therefore more optimal for larger amounts of data, which is not the casefor this application. When running the streams operations without parallel,they are performed in a sequential fashion, just like an iterative solution would.They therefore cannot beat the execution time of the already used methods.Conclusively, this did not improve the overall performance of the applicationand was thus decided against.

6.16 Layout & design

The layout of the application used the existing color scheme that has beenestablished. This was achieved by utilizing the existing CSS file as well as addingmore definitions using the pre-defined colors. This way, the application resultedin consistently looking tool, see Figure 37.

61

Page 64: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Figure 37: View of the complete application showing the design used for thebars and buttons, as well as on highlighted items in a menu.

7 Conclusions

The goal of this thesis project was to analyze the existing visualization platformto study its possibilities and limitations and use that in order to extend theplatform with new tools and functionality. These implementations aimed tocreate a useful and powerful analysis application that researchers at Ericssoncan use in their daily work.

Initially, the previously developed platform was studied through usage andby analyzing the existing code. With the insights gotten from the pre-study, arequirements analysis took place to outline the needed and desired features. Thisanalysis was done by studying other applications and conducting interviews withactive researchers. This analysis lead up to the prototyping of the application tographically showcase the expected result which acted as the foundation for theactual implementation. Throughout the entire project many decision were madein an ad-hoc fashion due to it being a learning process were some discoverieswere done as the work progressed. Furthermore, utilizing the researchers forcontinuous testing and evaluation resulted in valuable suggestions that impactedthe outcome.

The final result of the conducted work is an analysis application that primarilyenables on-the-fly modification of the visualization, but also allows the user tooverview the data and a graphs settings, export to PowerPoint, view output logsand more effectively investigate the shown data.

62

Page 65: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

As shown previously, the original platform consisted of one view where theuser simply could select what data to plot, see Figure 38. The user couldhowever not modify the graph in any way and the layout needed to be configuredmanually through configuration files that defined the used graphs and filtersbefore launching the application.

Figure 38: View of the original platform

By adding several new views and tools, encapsulating the original platform,a much more usable analysis application could be created, see Figure 39. Thesefeatures satisfy a number of needs discovered through the requirements analysisthat were decided as the applications requirements found in Section 4.

• It shall enable the user to modify and alter any graph to theirlikingBy implementing functionality to pan the graph, as well as zooming, theuser was enabled to modify the graph in order to observe the desired partof the data. Furthermore, the Plot Tools lets the user change the colors,widths and visibilities of elements in graphs as well as the name of them bychanging the text in the legend. Lastly, the button to enable and disablethe grid lines gives the user more control of the graphs look. These featurestogether form a great improvement in the way the user can interact withand modify a graph.

• It shall allow the user to dynamically modify the layout andfunctionalityThe original application needed the user to alter a configuration file inorder to decide what graphs and filters the application contains. With

63

Page 66: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

the new implementation the user can dynamically add and remove anydesired graphs and filters by dragging and dropping them from the ChartChooser. Also, the layout buttons allows the user to select the layout forevery individual tab with choices from several horizontal, vertical andgrid layouts. Finally, by implementing the View menu with enabling anddisabling of all the applications views the user is able to freely select whichto be shown at any time. This works as a complement to the fact thatall the existing views can be modified in size by dragging the separatorsbetween them.

• It shall correctly relate different datasets to aid in selecting theattributes on a graphThrough the new implementations on the relation finder each attributeis only associated to other attributes that it logically should be. Thisprevented previous erroneous behavior where an attribute could be plottedas a function of a key attribute of a completely different dataset while stillmaintaining the finding of proper relations.

• It should clearly show the user the current datasetsThe Data Source View is visible at all times (unless hidden) and allowsthe user to always have an overview of the existing datasets.

• It should provide tools to aid in and simplify the analysis of thegraphed dataThe implemented line tracker allows the user to more closely investigatea graph and find the values at the desired points which seemed to be avaluable feature. The tools used to zoom and pan a graph also help fulfillthis requirement. Further on, the application enables some post-processing,such as easily filtering out bad simulation users when applicable.

• It should have an easy to use design with quick access to func-tionalityThis is not as easy to assess but has through usage been indicated to befulfilled. Much functionality has been added to easily accessible buttonswhich allows the user to quickly make the desired changes or enable thepreferred tools. The design of most of these buttons have been inspired byother prominent softwares and testing has shown that a user quickly canlearn and remember their functions.

• It must be responsive to use without too much lagThe application currently is as responsive as it was when the projectstarted, despite the fact that much functionality has been added. This wasmainly achieved by the timer used when scaling the graphs as views gotresized. The application still could have improvements within this area, asmost applications could. It has, however, shown to be sufficient enough tonot at all discourage use.

64

Page 67: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• It may enable the user to export graphs to a PowerPoint presen-tationA PowerPoint exporter was implemented that allows a user to export agraph to a selected presentation. It successfully enables synchronizationbetween the analyzed graphs and a slideshow if the user continuouslyexports the graphs to the .pptx file.

Figure 39: View of the created analysis application showcasing many of theimplemented features.

Further implementations not covered by the initial requirements are the Logwindow and the video tutorial. The log window enables users to quickly getfeedback from the application on the activities of certain objects and can beseen as a tool for more expert users. It can be used to analyze the queried dataif it seems incorrect or to get insights into why a component is acting a certainway, and all this without needing an IDE or terminal. The video tutorial can actas a great starting point for new users to quickly familiarize themselves with allthe tools and functionality. It is however strongly desired that it is up to datewith the current implementation and it can therefore be somewhat maintenanceheavy as long as the application continues to be updated and developed.

Conclusively, the original platform has been extended with several new views,tools and functionalities that help the user in the analysis of data. It satisfiesthe initial requirements and has been developed according to the desires of itsfuture users. Many added features are also strongly inspired by other existingand very successful applications which indicates their usefulness.

The master thesis project as a whole was conducted more iteratively than

65

Page 68: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

planned where many features and insights where discovered along the way. Theinitial requirements analysis proved, however, for the most part, to be alignedwith the end result. As expected, a big portion of the time was spent learningthe features of JavaFX. It is a library under development and does have somedebatable functionality which can make a seemingly easy task troublesome.

Also getting an understanding of the existing platform took up much timewhere discoveries where made continuously. Due to the large existing codebase, and its already implemented architecture, some functionalities where moredifficult to implement than expected, while others quite easily could be createdwithin or around the existing code. The platform seemed to, understandably,have been developed with static layouts in mind. This was not only obvious bythe fact that it utilizes FXML -and XML files where a user define the look of theapplication before launching it. It also resulted in objects not allowing for easydynamical alteration or modification during runtime, which was one of the goalsof this project. It also frequently used inheritance but did not always supportcertain features at an optimal level which demanded more use of RTTI thenwould have been desired. Would the application initially have been developedto be as dynamic as possible maybe certain architectural decisions would havebeen different.

8 Future work

The current application lacks one obvious feature which is to save the currentlayout in order to be able to load the application with a previously saved one.This to save time for the user when launching the application to conduct ananalysis that is similar to a previous one. JavaFX contains functionality toserialize the layout of an application and this was the goal of a previous thesisproject carried out at Ericsson Radio Research but has proven to not be fullyfunctioning as of yet.

The current Chart Chooser has an implemented list of supported graphs andfilters but it does not cover all the currently developed ones. To add anothergraph to the list, a graphical icon has to be created and the graph or filtermust be added in the code to that list. Optimally, this list would contain allexisting graphs and filters and automatically add further ones if developed. Thisway, minimizing the effort it takes to develop a new component to add it to theapplication. The reason why this has not been implemented is that some graphsrequire more than others and also the fact the certain filters might be representedby the same type of object but only configured differently. This makes it hardto automatically, and dynamically, add all the available components to a list.However, as said before, any component not present in the list can be addedstatically to the application using the old configuration files.

Although not being a big issue, optimizing the application in terms of per-

66

Page 69: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

formance could be desirable if more functionality is added. The more graphicalcomponents that are added and visible, the heavier the application is for theJVM to run. Almost all objects are currently being initialized on the main GUIthread but some could most likely be moved to another thread or be performedwhen the thread is available with less priority.

The application currently supports exporting graphs as images or picturesin a Powerpoint presentation. It could however be desirable to create a demon-strator so that the results easily can be demonstrated directly in the application.This could contain functionality to create annotations in the graphs, add textnext to them and a presentation mode through which all the findings can bepresented. This could be done with existing Ericsson styles so all demonstrationsare consistent, this way allowing presentations without using Powerpoint.

67

Page 70: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Abbreviations

3GPP LTE 3rd Generation Partnership Project Long Term Evolution

BLE Bluetooth Low Energy

GUI Graphical User Interface

GVP Generic Visualization Platform

IDE Integrated Development Environment

JVM Java Virtual Machine

POJO Plain Old Java Object

RAT Radio Access Technology

RTTI Run-Time Type Identification

SQL Standard Query Language

68

Page 71: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

Appendices

A Interview questionnaire

Name of interviewee:

A.1 Pre-questionnaire

Start by describing the goal of the thesis and what we are trying toachieve: Making it easier for researchers to go from simulation data to visualanalysis and demonstration by expanding the toolbox in the current visualizationplatform.

Describe the goal with this interview: To get information on how youexperience visualizing simulation data, what tools you prefer and use often, andwhat you think could be improved. Looking for opinions and impressions. Alsosome information on how important this is for your daily work.

Describe the interview: Will start of by showing you the current platformwith the currently available set of tools, continue with some questions and thenend with suggestions and thoughts about features that could be implemented.

Notes about terms:By visualizing I mean plotting in different ways and making adjustments

(using tools) to the plots in different ways, for example coloring of different dataetc. to differentiate.

By features I mean plots, tools, scripts etc. used in order to create the desiredvisualization.

BEFORE QUESTION 9, DO THIS: Show the questionee how thevisualization platform currently looks by using existing application

Certain focal points are:

• The different available components

• The way the user can see what data is present in the application. Ta-ble+column is shown in legend and on axis. Keys will therefore be presenton multiple places (due to exist in multiple tables)

• The settings menu

• Ability to scale graphs

• Ability to filter data

• Visualize relations and explain how they are achieved

• The different types of graph components

69

Page 72: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• Can save plot to image file

70

Page 73: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.1.1 Q: What features (different charts, tools, scripts) do you al-ways use in MATLAB when visualizing data?

Answer:

A.1.2 Q: Are there any features (different charts, tools, scripts) thatyou want to use in MATLAB but are complicated to get work-ing the way you want?

Answer:

71

Page 74: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.1.3 Q: Are there any features (different charts, tools, scripts) in,for example, MATLAB that you avoid using due to taking tomuch time?

Answer:

A.1.4 Q: What is the most important aspect of visualizing data foranalyzing in your eyes? What advantages do you get from it?

Answer:

72

Page 75: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.1.5 Q: Do you generally feel pleased with the way you are able tovisualize your data in order to analyze it?

Answer:

A.1.6 Q: For finding correlation between different data - do you haveany ideas of ways to visualize data to achieve this?

Answer:

73

Page 76: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.1.7 Q: Roughly how much of your time do you spend graphicallysetting up and observing data (such as graphs, plots etc)?

Answer:

A.1.8 SHOW GVP FOR QUESTIONEE!

A.1.9 Q: What features do you immediately feel that GVP is lack-ing?

Answer:

74

Page 77: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.1.10 Q: Is the way the available data is shown in GVP clear andeasily understandable? If not, how would you prefer? (ShowGVP for questionaree)

Answer:

A.1.11 Q: Do you feel a need for something more than ability to savegraph(s) as image? Export to a different format for furtheranalysis or reporting?

Answer:

75

Page 78: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

A.2 Post-questionnaire

Ideas about features that could be valuable to implement. What does questioneethink?

• Plotting in three dimensions (scatter, planes etc).Yes/No

• Constantly visual toolbox for modifying graph, updates graph continuously.If multiple graphs visible, switches between them when they are tapped.Yes/No

• Horizontal graphical icon list on top with possible graphs (”componentlibrary”)Yes/No

• When application loaded, data loaded into its variables, similar to datashown in MATLAB. Gives user an overview of the data.Yes/No

• Tools for editing a created graph (in terms of legends, labels etc). Whatwould be desired?Yes/No

• Plotting multiple sets of data, enabling/disabling visibility of each set.Yes/No

• Adding error bars to plots to compare multiple sets of dataYes/No

• Creating subplots on the fly? Select data in graph which renders a differentplot.Yes/No

• Similar func as MATLAB. Choosing data source, then choosing a plot froma graphical view - then creates plot from that data.Yes/No

• Enable smoothing of dataYes/No

• Do numerical analysis on the data.Yes/No

• Regression analysis such as fitting data. And get equation of that data(similar to matlab).Yes/No

• Track the line plot (cursor that follows the line when you move it in x or y)Yes/No

76

Page 79: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• Find and label peaks in a graphYes/No

• Choose symbol size and color in regard to variable - with a color barYes/No

• Adding water fall graphsYes/No

• Selecting 2D-region of graph to change the axes (zoom)Yes/No

• Have two plots - zoom on one of them and get result live on the other.Yes/No

• Add/remove gridYes/No

• Turn On/Off visibility of plots and layersYes/No

• Drag drop data onto axes. Adding 1 to y will plot it over a ”standardarray: 1,2,3,4...N”. When adding to x then will only be able to add datathat are related to the y data.Yes/No

• Possibility to have tabs but also possibility to add multiple components toone tab. Makes it more customizeable and easier to compare plots.Yes/No

• Add new or modify existing data.Yes/No

B Continuous testing form

Name of interviewee:

B.1 Questionnaire

To start the GVP application and load the desired data into the application is notpart of the scope for the thesis and that part will therefor not be included in thequestionnaire. Here the user is expected to have started GVP with successfullyloaded data.

Rate the features on a scale from 1 to 10 (and add additional comments ifneeded. Where 1 is I strongly disagree, 5 is I somewhat agree and 10 is I stronglyagree. Also rate how important that feature is where 1 is not important at all, 5is somewhat important and 10 is extremely important. Use the left field for thefeature rating and the right field for the importance rating.

77

Page 80: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• GVP Analyzer starts correctly. (CTRL+Shift+A)1-10 1-10

• GVP Analyzer starts quickly.1-10 1-10

• It shows the correct data sources in the Data Source Pane1-10 1-10

• To add a data source from the Data Source Pane to the plot is workingsatisfyingly1-10 1-10

• To browse the data sources in the Data Source Pane is working satisfyingly1-10 1-10

• I get a good overview of the data sources1-10 1-10

• It gives you the needed settings for a chart in the Plot Tools Pane.1-10 1-10

• It gives you the needed settings for a line/element in the Plot Tools Pane1-10 1-10

• Modifying a charts settings in the Plot Tools Pane works satisfyingly1-10 1-10

• Modifying a lines/elements settings in the Plot Tools Pane works satisfy-ingly1-10 1-10

• The Plot Tools Pane is always showing the correct information1-10 1-10

• To brows the charts in the Chart Choser Pane is working satisfyingly1-10 1-10

• The Chart Choser Pane includes all the needed and wanted charts1-10 1-10

• The application feels responsive (fast) and ”snappy”, not laggy 1-101-10

• Zooming using CTRL+Scroll is working satisfyingly1-10 1-10

• Paning using ALT+Scroll is working satisfyingly1-10 1-10

• Paning using CTRL+Mouse1 is working satisfyingly1-10 1-10

78

Page 81: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

• Plotting data feels reliable - I trust that the graph shows what I intendedit to show1-10 1-10

• The GVP Analyzer provides me with the tools I find necessary to visuallyanalyze my data1-10 1-10

• Using the GVP Analyzer makes me feel satisfied1-10 1-10

• Using the GVP Analyzer does not make me frustrated1-10 1-10

References

[1] Few S. Data visualization; 2007. Available from: https://www.

perceptualedge.com/articles/Whitepapers/Data_Visualization.

pdf.

[2] Ware C. Information Visualization: Perception for Design. Morgan Kauf-mann; 2013.

[3] dictionary B. Analysis; 2017. Available from: http://www.

businessdictionary.com/definition/analysis.html.

[4] Tang D, Stolte C, Bosch R. Design Choices when Architecting Visualization.Information Visualization. 2004;3:41–48.

[5] Aiken A, Chen J, Lin M, Spalding M, Stonebraker M, Woodruuf A. LectureNotes in Computer Science: Database Issues for Data Visualization 1183.The Tioga-2 database visualization environment.; 1996.

[6] Parkwall S. Release 14 - the start of 5G standardization; 2013.Available from: https://www.ericsson.com/research-blog/lte/

release-14-the-start-of-5g-standardization/.

[7] Stevenson KJ. Review of OriginPro 8.5;. Available from: http://www.

originlab.com/pdfs/JACS_(Keith_Stevenson)_ja202216h.pdf.

[8] Machlis S. IBM to shutter dataviz pioneer Many Eyes; 2015.Available from: http://www.computerworld.com/article/2930326/

data-analytics/ibm-to-shutter-dataviz-pioneer-many-eyes.html.

[9] Inc SS. SigmaPlot overview; 2017. Available from: http://www.sigmaplot.co.uk/products/sigmaplot/sigmaplot-details.php.

[10] Dietz DM. What are the pros and cons of using MicrosoftExcel?; 2016. Available from: https://www.quora.com/

What-are-the-pros-and-cons-of-using-Microsoft-Excel.

79

Page 82: Creating a usable analysis application built on an ...1106248/FULLTEXT02.pdf · Creating a usable analysis application built on an existing visualization platform Pontus Arfwedson

[11] Labs F. Introduction to User-Centered Design; 2015. Avail-able from: http://www.usabilityfirst.com/about-usability/

introduction-to-user-centered-design/.

[12] Oracle. JavaFX; 2017.

[13] Javatpoint. Java Bean; 2017. Available from: https://www.javatpoint.

com/java-bean.

[14] Urma RG. The Only Introduction to Reactive Programming YouNeed; 2014. Available from: https://dzone.com/articles/

only-introduction-reactive.

[15] Bair R. Performance Tips and Tricks; 2013. Available from: https://wiki.openjdk.java.net/display/OpenJFX/Performance+Tips+and+Tricks.

[16] Ball B. Processing Data with Java SE 8 Streams, Part 1; 2014.Available from: http://www.oracle.com/technetwork/articles/java/

ma14-java-se-8-streams-2177646.html.

[17] Oracle. Java Interface; 2017.

[18] Oracle. Java Inheritance; 2017.

80