Optimizing Your Data Visualization Presentation

Good data visualization is all about choosing the right presentation techniques. While any plotting layout would do the basic job of visualizing the data, there are many rules, which can help us present a powerful layout, which is easy to understand and goes well beyond just presenting a set of data. Below we will present some of them using the Shield UI's Chart widget for HTML5 and JavaScript.

Choosing the right chart series type

The beginning of each great presentation is choosing the best type of series for the specific purpose of the presentation - comparison, showing trends or displaying composite data.


When comparing data values, the best option is to pick bar chart series. This allows easy visual comparison between individual data entries, as well as whole series. An example of such a layout is demonstrated in the following location. The image below demonstrates a two-series bar chart.
Bar Chart

Bar series are also an excellent choice when looking to visualize “highest of” and “lowest of” presentations. This can be achieved in one of two ways. First, a standard bar layout allows easy visual perception of highs and lows. In addition to this, one can choose to highlight such extremes, either to underline a custom logic, or to facilitate a better understanding of key performance indicators. This may also be required for audiences, which may have different data visualization experience and backgrounds. Another indication aid, which is especially useful with bars, allows the setting of a threshold, which indicates a border-value. Enabling it allows the immediate visual distinction of values, which fall above and below a given threshold. The three images below show each type of scenario.

Bar chart with highs and lowsBar chart with extremesBar chart with a threshold

Showing trends

When have the task of showing trends to our target audience, the best choice would be to use the line series type. Such a layout makes it easy to visualize trends, which span over periods of time. This series type also stresses the correlation between each data point.

Another variation, which is also suitable for demonstrating trends, is the area series type. It presents a more visually solid layout, by colorizing the area between the x-axis and each point. Both the area and line chart series types handle the trend-visualization task equally well.

There are cases, when all additional elements, rendered on the plot, such as x-Axis, y-Axis, legend and header/title are not required. This is where the Sparkline visualization layout comes handy. It enabled high-density visualization boards, which present many series of data, which only outline trends. This saves a lot of screen real estate, and yet preserves the key information metric – change over time.

Below you can see an example of a line, an area and a sparkline chart.

Line chartArea chartSparkline chart

Composition of data

Another common data visualization scenario is the rendering of graphics, which in addition to their numeric values, present visual hints for composition. This is the case when we are dealing with data series in which each data entry is of a different type. The best choice for this scenario is a pie series type, which successfully conveys not only numeric magnitudes, but also the sub-type of each entry.

The best optimization of rendering a pie chart, however, is when displaying no more than two entries. The reason behind this is that another important characteristic of a pie chart is for rendering data in a “part-of-a-whole” relationship. The images below show a pie chart with multiple values and one with two values only.

Pie chartPie chart with two values only

Having such a limitation, however, poses a problem. A standard data set only rarely contains only two points. What if we wanted to visualize composition of a set, which contained for example four data points, as the sample with our first pie chart? This can be done in one of two ways. Either by displaying a series of pie charts in a dashboard-like layout, or by enabling a drill-down via selection for the single pie. Either case requires sub-division of the data into subsets.

This summarizes some of the important aspects of choosing the right visualization means. Investing time to make a careful selection ensures easier user interaction and more powerful charting presentations.