Visualizations in LocalFocus

From a dataset to a visual story in 5 steps: with LocalFocus you can quickly and easily turn every table with figures into an insightful data visualization.

Getting started with Visualisations in LocalFocus

beta

Is your question not answered in this manual?

Please contact jelle@localfocus.nl

1 Add data

Every new project starts with adding your data. You have three options for this. You can copy paste your table to the LocalFocus platform (1), you can type data yourself into the editor table of the LocalFocus platform (2) or link the visualization to a Google Drive spreadsheet (3).

1.1 How do I add my data by copy-pasting (and what are the benefits)?

Do you have a table with the data you want to visualize? Then all you have to do is copy paste it. This is an easy way to add your data quickly.

neat table

paste

Has the LocalFocus platform misjudged your data? Click on the table and easily adjust the settings.

Would you like additional information about units, periods, units and categories? See question 1.4.

check

decimals

1.2 How do I add my data by typing manually (and what are the benefits)?

Adding your data by typing it manually is useful if you only have a handful of data that you have not already stored in a table.

types

Do you want to be able to easily adjust the figures after making your data visualization? Even if it has already been published online? Then you can link your data liberalization to a Google Drive spreadsheet. This link allows you to update the data of published widgets without having to re-publish an embed code. This is very useful if you often want to add new numbers or correct a typo.

These are the steps:

drive share button

everyone can read

link drive

result

If you adjust grades in the Google Drive spreadsheet, your graphic will be updated automatically, even if your graphic has already been published. Note: it sometimes takes a few minutes before you see the changes.

1.4 What are 'dimensions' and what is the difference between periods, categories and units?

When adding data you will notice that the LocalFocus platform works with 'dimensions'. Each header row or column in your table counts as one dimension.

You can see this clearly in this sample dataset. Each dimension is marked with a different color:

dimensions

(1) Categories

(2) Periods

(3) Units

1.5 How do I select the correct time period for my data set?

The LocalFocus platform itself makes an estimate of the periods in your dataset. You can easily check this (Click on 'Edit dataset'). Click your right mouse button in the row or column with periods. A popup window will appear with several options. Make sure your correct option is selected.

Does your dataset have a period format that is not covered by the standard options? Then select 'Custom format'.

1.6 I see a warning sign after adding my data, what should I do?

When the LocalFocus platform finds cells with strange values ​​in your table, a small warning sign appears at the top left: a small red triangle with an exclamation mark. By clicking on the triangle, the table jumps to the rows with any errors in your data set. This way you can check and adjust the data in your table.

Often these are empty cells, the value of which is unknown. You can put a dash, period or question mark here to indicate that the value is unknown. The warning will disappear.

visualization warning

2 Select visualization mode

One story is clearly displayed in a line graph and the other is more suited to a bar chart. How do you choose the right visualization form? And how do you subsequently build the visualization?

2.1 When do I choose a landscape bar chart?

The horizontal bar chart is ideally suited for showing a ranking. The values ​​can be easily compared with each other on the basis of the length of the bars.

Landscape bar chart

Note: With the landscape bar chart, the LocalFocus platform sorts the values ​​by default in descending order, from top to bottom. The bar chart therefore represents a ranking. This changes the order of your data set. For example, periods are no longer in chronological order.

Do you want to keep the order of your data set with a horizontal bar chart? You do that like this:

2.2 When do I choose a column chart?

The column chart can be used to show the development over time and works best with a limited number of data points.

Column Graph

2.3 When do I choose a line graph?

The line chart, like the column chart, is suitable for showing trends. Usually you want to start axis distribution at zero so as not to distort the data, but there are exceptions.

Shut up about the y-axis. It shouldn't always start at zero.

Line graph

2.4 When do I choose a pie chart or stacked chart?

Pie charts and stacked charts show proportions. Consider, for example, the distribution of the educational level of students in higher education. Or the distribution of answer results for a multiple choice question in a survey. Keep in mind that your values ​​add up to a meaningful total, for example 100 percent.

Pie Chart

2.5 How do I create a drop-down menu for my visualization?

Sometimes it can be nice to add a drop-down menu. This way you can quickly switch between regions or years with your visualization.

drop-down menu

2.6 I want my scale (y-axis) not to start at zero, how do I adjust this?

The LocalFocus platform automatically ensures that the scaling starts at zero. But sometimes you want to adjust the minimum (or maximum) axis value.

Consider, for example, a graph in which the fluctuation of body temperature is measured throughout the day. It is very difficult to see the subtle variations when the y-axis starts at zero:

Line graph

Line graph

Line graph

3 Design and context

By adjusting the colors of the visualization, you can emphasize certain information. You add annotations to explain striking things and with an explanatory title you explain to your audience why these numbers are relevant.

3.1 How do I adjust the colors of my visualization?

Colors can be used to highlight specific data points. For example, by giving the national average a different color in a bar chart, you can better assess which areas score above and below average.

Colors

Good Color Coding Tool

3.2 How do I add an annotation?

With annotations you provide your visualization with extra context and you can explain striking trends, patterns or outliers.

Annotations

3.3 How do I add a tooltip?

The tooltip is the compact text that appears when you move the mouse over the graph, as in the example below.

example tooltip.

insert example tooltip.

3.4 I would like to export a visualization as an image. How do I ensure that the numbers can be read immediately?

You can use direct labels for this, as in the example below.

direct labels.

3.5 How do I change the date format?

Sometimes you want your years or months to be displayed in the table in a different way. For example'10instead of2010.

In the Appearance tab, click on horizontal or vertical axis. Select the axis containing the periods.

You can change the date format in the popup screen at the top right:

date format.

3.6 How do I format the x and y axis?

Does your dataset contain special units such as percentages, currencies, or degrees Celsius? Your visualization will be more informative if you have formatted the x and y axis with the corresponding signs (%, € or ° C)

format axes.

The result:

axes result.

3.7 How do I create a visualization with a double y axis?

With the LocalFocus visualization module you can create a line chart or combined bar and line chart with double y-axis.

Such a visualization is useful if you want to get a picture of the correlation between two trends.

Consider, for example, the number of visitors to your website, and the number of new registrations for your product.

double y-axis 1

double y-axis 1

4 Publish

Once your story is finished, you can publish the graphic as an interactive widget on your website. It is also possible to download the visualization as a png or vector image.

4.1 How do I publish a visualization on my website?

With the widget button you generate an iFrame code with which you can embed the interactive graph on your website. Tip: by clicking on the smartphone icon at the top right of your visualization, you can see what your creation will look like on a smartphone.

4.2 How do I post my visualization on social media?

PNG images can be used on social media such as Twitter and Facebook. This article helps you select the correct format.

All social media dimensions at a glance

4.3 How do I make a visualization for print?

Use the pdf and svg buttons to download your visualization in vector format. The elements of your visualization are separate objects and can therefore be perfectly edited in programs such as Illustrator or Inkscape.

Inkscape (free) for post-editing