Another face of the web: Interactive data visualization
We live in an era where huge amounts of information are being processed every day and usually this type of overload becomes inordinate. Fortunately here is where data visualization comes in, extracting meaning from data and presenting it in a comprehensive manner that can be subjected to interpretation.
As in the past decades the information technology took a major leap, mapping data by hand has not only become slow and tedious but downright obsolete. Now computers facilitate data visualization while we are in charge of conceptualizing and crafting the rules of the system that in the end is executed by software and tools.
This has opened new doors in working with much larger datasets encompassing anywhere from thousands to millions of values, as well as rapid experimentation with alternate mappings since the output of “tweaked” mapping rules can be re-rendered immediately. Therefore, the essential loop of the rule-writing, rendering and evaluation process makes refining a visualization design much easier.
Data visualization has come a long way since the era of pie charts and bars; nowadays, we have new means of interpreting data, which help us reveal unexpected patterns and trends in otherwise hidden pieces of information and enable us to see the world in a new, different way.
While basic data visualization can be useful when offering multiple perspectives on the same piece of information, it has its limits when we talk about the sheer number of dimensions it can portray, due to the fact that all the visual elements must be on the same surface at the same time. This type of fixed representation is ideal if we wish to publish it in a static format (e.g. print), but what should be done if alternate views are needed or desired?
This is where coding comes in handy and there are many tools and coding languages that can be used to create interactive data visualization – D3, HTML, CSS, DOM and JavaScript, to name a few. Embedded within a HTML webpage, the JavaScript D3.js library uses pre-built JavaScript functions to select elements, create SVG objects, style them or even add transitions, dynamic effects and tooltips.
But before starting we should ask ourselves: what is data and what kind of data can we use to create an interactive visualization? As Scott Murray mentions in his book Interactive Data Visualization for the Web: An Introduction to Designing With D3 – “Broadly speaking, data is structured information with potential for meaning.”
In the context of programming for visualization, data is stored in a digital file, in text or binary form, but within the scope of browser-based visualizations, it is good to limit to text-based data since .csv or .json documents can be used with D3. This is necessary since the D3 binds our data input values to elements within the page, values that will be later referenced in order to apply data mapping rules.
Furthermore, drawing with data, implementing scales and drawing axes, setting updates, transitions and motion are also essential steps toward constructing a cohesive and useful interactive visualization. Choosing layouts can be daunting when there are so many options available out there, but keep in mind that the D3 layouts have no direct visual output; it simply takes the provided data and transforms it into new data that is more convenient for a specific visual task.
Beyond all the coding and technical processes, we must remember that design, consistency, context and accuracy are also key factors to ensuring that your interactive visualization will not only be an experience worth remembering, but also a testament to the proficiency of the data visualization practice overall.
The certified Data Visualization Professional training course developed by The KPI Institute provides insights on the importance of data visualization, fundamental principles, as well as means to increase non-verbal communication skills through effective visualizations.
Experience the excitement of seeing what has never been seen before!
Image source:
Tags: Data design, Data Visualization
