Zoom Charts

Analytics involves data–lots and lots of data. The data under observation can range from having a few tens of data points to a few thousands of data points. While visualizing for a few tens of data points is also difficult enough, visualizing data presented by thousands of data points has its own set of challenges. The amount of data to be plotted on the chart is a crucial factor in determining the type of chart that will be used. More the data, more is the effort from your users to view and interpret it.

Through this article, we introduce you to zoom charts–charts with zooming capabilities–one of the best solutions for plotting thousands of data points.

In this article, we are going to cover the following two types of zoom charts:

  • Zoom line charts (with single y-axis and dual y-axis)
  • Zoom scatter charts

Zoom Line Charts

The biggest advantage of using zooming charts is the ability to view data at various levels of granularity, especially when the data under observation is huge and can be organized into layers for easier interpretation. The ability to zoom-in and zoom-out makes it easy to view data at various macroscopic and microscopic levels.

Zoom line charts are basically line charts with a zooming capability.

Let’s take a look at a simple example to understand what the zoom line charts are all about.

A simple example

Take a look at the zoom line chart shown below that compares the daily number of footfalls in a store and website visits to the store’s website for every day of one complete year.

On first view, the zoom line chart gives an overview of how the trend for both data sets progresses. You can keep zooming in into the chart, till the lowest level of granularity allowed, to study data for specific months, weeks, or days. Isn’t that cool?!

Data visualization is all about conveying the right information in the most effective way. While the zoom charts may seem like an interesting option when you have a huge amount of data, they may not always be the right choice. Read on to know the dos and don’ts of zoom line charts to understand what we mean.

Ideal use-cases for the zoom line chart

The best situations to use a zoom line chart would be when:

You want to find correlations between data sets at several levels of granularity.

Like said already, zoom line charts let you zoom in and out of the data plotted on the chart to let you study data at various macroscopic and microscopic levels.

One would think that a large number of data points can also be plotted on, say, a line chart with a scroll. But the obvious disadvantage would be that getting an overview of the trend will become a difficult task. There isn’t much that one can retain when one has to scroll through a chart that has 365 data points plotted on it, isn’t it?

You need to compare a specific set of values with the rest of the values on the chart.

Zoom line charts let you pin a specific set of data. This pinned data—or rather, the ghost of this pinned data—is imprinted on the chart canvas. As you move through the rest of the data points on the chart, this pinned data moves with you. This facilitates quick and easy data comparison. Take a look at the image below, to understand how pinned data can be used for data comparison.

You need to compare data that is spread over a long period of time.

This, again, refers to the first view of the chart. So, like in the sample chart above, you can figure out the general trend of how the data changed over the period of a year.

Limitations of a zoom line chart

You can avoid using the zoom line chart in cases where:

  • Your data sets have different measurement units. You cannot be plotting the monthly revenue and profit percent for, let’s say, five years on a zoom line chart—revenue will be plotted in dollars while profit percent will be in percentage values.
  • Data sets are vastly different from each other in terms of the intervals between their data values.

More examples of a zoom line chart

The chart below compares the viewership for two popular American TV shows.


That the zoom line chart cannot be used to plot data sets with different units of measurement or data sets with varying intervals between data values is a major setback when it comes to using these charts for real-time, more practical applications. For example, let’s say that you want to compare the daily website visits with the online sales, again, for a period of one complete year. Obviously, values for both these data sets cannot be plotted on the same y-axis of a zoom line chart.

To solve this problem, the zoom line chart was enabled with support for a secondary y-axis.

A simple example

The chart below shows, for a period of one year, how the precipitation rate impacted the retail and online sales of a store:

The precipitation rate, expressed in mm, is plotted on the y-axis on the left—the primary y-axis— and the sales figures, in dollars, are plotted on the y-axis on the right—the secondary y-axis.

And just like the zoom line chart, the first view gives you an overview of how the overall sales were impacted; zooming in and out of the chart lets you view data for months, weeks, and days in specific.

More examples

Here is another example of a zoom line chart with a dual y-axis that plots the variation in the mean temperature for each day of one year w.r.t two temperature units—degree Celsius and Fahrenheit.

Zoom-Scatter Chart

A scatter chart is a mathematical diagram to display values for, typically, two variables for a set of data. Zoom-scatter chart, a special type of chart, is an extension of the scatter chart with the zooming and panning features and, therefore, the ability to display millions of data points. The scattered data points can be used to set various kinds of correlations between variables. Correlations in the chart can be determined by visual patterns in the data. Higher the number of data points, higher is the accuracy of the correlations.

A simple example

Before we move on to talk more about the zoom-scatter chart and the kind of data that can be plotted and analyzed using this chart, we'll see a simple example for this chart.

Take a look at the zoom-scatter chart shown below, used to showcase an average selectivity and returns for majors in higher education in the last 20 years:

Drag the mouse-pointer over the chart to select and zoom into a subset of data points.

Ideal use cases for zoom-scatter charts

Zoom-scatter charts are best used for visualizing data when:

You want to find correlations between data sets

Zoom-scatter charts are used to set various kinds of correlations between variables. For example, to show the products sold and the price points earned, for any household product over a particular time period.

You want find correlations between data values of a single dataset.

Like the zoom scatter chart is used to find correlations between two or more data sets, it can also be used when you want to study the correlation between the values of a single dataset.

You need pattern recognition for a large amount data

The zooming and panning features make it easy to identify trends and patterns at different levels of data.

Limitations of a zoom scatter chart

Zoom scatter charts are mainly for showcasing trends and patterns so avoid representing linear data using the zoom scatter chart. The zoom scatter chart does not use a clustering algorithm,, so if you have a chaotic pattern in the chart, it won't help you much.

Also, the zoom scatter supports only the regression line, so no curvilinear regression line or any other regression formats can be used.

Examples of ideal use cases for a zoom scatter chart

Example 1:

The zoom scatter chart below plots the comparison of three mediums of advertisements on the basis of orders received through each medium. In other words, it studies the trend of number of orders in relation to the medium of advertisement.

Example 2:

The chart below shows how the zoom scatter chart can be used to study the correlation between the data values of a single data set.

The chart studies the customer happiness index w.r.t the response time in minutes.

This was a quick guide on the dos and don'ts of using zoom charts. You can visit our developer center to read detailed documentation on how the zoom line, zoom line with dual y-axis, and zoom scatter charts can be used and customized.

Want to include Zoom Charts in your project?

Download free trial to start creating charts you want.

Business Users

Contact us using the form below and we'll be happy to assist you!

If you see this, leave this form field blank and invest in CSS support.