Polish Cartographical Review Vol. 48, 2016, no. 3, pp. 115–127 DOI: 10.1515/pcr­2016­0009 KAROL KRÓL, BARBARA PRUS University of Agriculture in Kraków Faculty of Environmental Engineering and Land Surveying [email protected]; [email protected] The comparative analysis of selected interactive data presentation techniques on the example of the land use structure in the commune of Tomice Abstract. The authors present the results of a comparative analysis of selected techniques and programming tools for building interactive data presentation in the form of diagrams and maps generated in the browser. The results of an inventory of land use structure, which are a part of a geographic information system data­ base of the commune of Tomice in district of Wadowice, were employed as input data. The research has shown that the tested tools have a similar design capacity; which makes it difficult to determine which of them is the best. Different factors contribute to choosing a particular tool. They include technical specification, project budget, license conditions, technical support and visualization possibilities. Keywords: data visualization, Application Programming Interface API, interactive maps and diagrams, interactive maps 1. Introduction 2016). Attractiveness of interactive visualiza­ tion of data on the Internet originates mostly In the communication process strong expo­ from the functionality of the medium itself, the sition of visual elements plays a particular role: speed of access to information using it as well pictures, animations and videos (M. Woźnia­ as the diversity of forms of its communication kowski 2014). Modern civilization is based on (D. Gotlib 2008, P. Kowalski 2012). Graphically visualization, use of image and illustrative attractive data presentations call attention exemplification (H. Mamzer 2004). Visual sen­ significantly more than presentations which sations become increasingly important due to are only useful (M. Wieczerzycki 2014). While, the information overload. It results among interactivity assumes the possibility that the others from the tendency to seek new visual presentation will impact the recipient and si­ experiences by users as well as from practical multaneously the recipient will impact the scope matters such as the attractiveness and clarity of and form of the information being presented communication which may facilitate quick acqui­ (A. Macioch, G. Malmon 2010). sition of the most vital information (M. Leszko­ The objective of the authors is a comparative wicz 2011). Communication based on image analysis of selected interactive presentation appeals to the imagination and is universal – techniques in the form of diagrams and maps “the visual culture has a chance to easily reach presented in the browser window on the example the recipient as it does not require a common of land use structure in the commune of Tomice and understandable language code, it goes (southern Poland). beyond borders and nationalities (A. Siennicka 2015, p. 74). 2. Data visualization in the web browser In recent years, the dynamic development of window Internet technologies can be observed. It is ac­ companied by increasing availability and di­ With development and availability of techni­ versity of techniques and design tools (K. Król ques and computer tools allowing collection 116 Karol Król, Barbara Prus and processing of data, evolution of digital vi­ et al. 2009, M. N. Chhabra 2012) which were sualization methods has taken place which conducted during creation, implementation and allows content to be generated dynamically use of data visualization (web applications, and interactively, multidimensionally and attrac­ web components) created in accordance with tively for the recipient (M. Kukułka, D. Gotlib the approved design assumptions. 2014; R. Rossi, N. Ahmed 2015). This evolu­ In the scenario of the tests observation and tion also takes place at the level of the manner registration of remarks made during the design of visualization, often three­dimensional, more works using selected tools were provided for. frequently adjusted to presentation using mobile devices. 3.1. Main assumptions and design The modern data visualization form re­ procedures sponds to challenges brought on by an infor­ mation society with its increasing demands towards it. Visualization allows distribution The main design assumption was to create of diverse content, discover new object pro­ a model visualization of statistical data in the form perties and indicate relations between them of diagrams which would constitute an indepen­ (G. Kończak 2014, M. Kowalska-Musiał 2009). dent self­contained component of a website. It forces a constant search for new methods of The design provided for creation of a com­ collecting, processing and presenting data ponent in the form of a compact set of files or (D. Gotlib 2012; M. Gesmann, D. de Castillo a single code (a string of signs saved in a hy­ 2011; I. Pulak, M. Wieczorek­Tomaszewska pertext document), which may be moved 2011). between any websites and implemented in Creating visually attractive data presenta­ their structure which indicates their universality. tions in the web browser window is not only Moreover, within the design assumptions it reserved for specialized users. Software devel­ was approved that the graphic form and the opers put increasing emphasis on its versatility, principle of operation of the diagrams will be universality and availability – sets of generally optional (depending on the technology of their available design tools and techniques are cre­ generation), however they should be charac­ ated which allow among others data modeling terized by interactivity (e.g. in the form of the and visualization, frequently in an automated possibility to modify the scope of the presented manner. data or the form of their presentation by the user This trend can be also observed concerning directly in the browser window). In the design data presentations having a spatial reference. works also an attempt to illustrate data on maps Numerous tools allowing interactive data pre­ and compare diagrams or graphs in a mana­ sentation were prepared in such a way that gement dashboard was provided for, i.e. inter­ their use requires only completion of source active presentation of several diagrams or data and configuration of selected communi­ graphs simultaneously with the possibility to cation parameters. While, others are made e.g. sort data. available in the form of creators or generators, Input data saved in the database of the spa­ which in an automated way create data visuali­ tial information system, presenting the land zation. Others allow advanced and complex use structure in particular territories of villages web applications to be created (K. Król 2015). in the commune of Tomice, was transposed manually into a data array in accordance with 3. Materials and methods the requirements of each of the design tech­ niques being tested. Arrays prepared in such Selected techniques and programming tools a way, constituting the integral part of the hy­ allowing generation of interactive data visuali­ pertext document, were used as a basis for zations in the form of maps, diagrams and visualization. Their development in the browser graphs in the browser window were subject to window was programmed using selected tech­ a comparative analysis of functionality and niques which were chosen in such a way that usability (tab. 1). the basis of each of them was another techno­ The analysis was performed based on the logy which created a certain review of design results of ad­hoc exploratory testing (W. Afzal alternatives. However, all tested tools are The comparative analysis of selected interactive data presentation techniques... 117 Table 1. Programming techniques and design tools subjected to comparative analysis Design tool Programming Selected data source License (original spelling) techniques amCharts DataTable*, CSV, JSON, JavaScript Charts JavaScript, PHP, SVG, Free with a link MySQL data base JavaScript Stock Chart VML, HTML, CSS or commercial (Data Loader) JavaScript Maps JavaScript, jQuery, Flot SVG, VML, DataTable*, JSON MIT Licence HTML5 Canvas, CSS Adobe Flash, JavaScript, Google Chart libraries Google Charts Google Visualization Google Visualization API, (jsapi and loader) Visualization API: Geomap API Terms of Service HTML, CSS DataTable* Google Chart libraries JavaScript , SVG, VML, (loader) Google Charts Google Visualization Visualization API, HTML, DataTable*, Google Visualization API API Terms of Service CSS Spreadsheets, Google Fusion Tables The language CSS, Cascading Style for describing HTML, CSS No data table Sheets the presentation of Web pages * data array written directly in the hypertext document; source: own study based on JavaScript, a popular scripting pro­ 3.2. Characteristics of selected design gramming language. N. Bryant and J. Wildfire techniques acted analogically in their studies (2016) within which they tested design possibilities of the AmCharts is a JavaScript library allowing “Webcharts” tool based on the D3 JavaScript generation of diagrams, graphs and maps in library (Data­Driven Documents). the browser window (using shared maps of the Data visualizations prepared based on globe, countries or the user’s own materials im­ JavaScript libraries were also described by ported from the SVG file) (I. Logre et al. 2014). M. Bostock and co­authors (2011) and L.R. Nair The library was chosen due to the precisely and co­authors (2016). They compared pos­