Part 1: Text

Add and adjust simple text

Select the text widget (not text box widget) from the toolbox and drag it into the report. By default the text editor opens and a ‘lorem ipsum’ demo text is added to the widget.

Replace this dummy text with your own text.

Click on the floppy disk icon to save your edits and on the ‘X’ icon to close the editor. To re-open the editor you can either right click on the widget and select ‘Edit Text’ or simply do a double click on the text.

Close the text editor for now.

Click on the text once and use the anchors in the corners to resize the widget to half of the page width.

Right click on the widget and select ‘Anchor’ > ‘Left’. This will make the text widget snap to the left side of your report.

Right click on the widget once more and select ‘Properties’ to bring up the widget settings. The widget properties contain two tabs, ‘Settings’ and ‘Spacing’. Switch to the latter to view the margin settings. Margins can be defined by a value (in e.g. pixel) and are used to create a blank space around the border of a widget.

To see the effect, click on ‘Cancel’ and add a ‘Break/Line’ widget from the toolbox. Drag it beneath your text so it looks like this:

The blank space between the dashed border of the text widget and that of the line is due to the current ‘Spacing’ setting of the text widget. Go back to the text widget properties, ‘Spacing’ tab and reduce the value for ‘Bottom’ from 10 to 0.

Click ‘Apply’; if the settings popup is blocking the widget simply drag it away from over the widget.

Notice how the line is now much closer to the text widget. You can adjust it further by resizing the top border of the line.

To keep the changes and close the popup click ‘OK’ or if not ‘Cancel’.

Add a heading and make it responsive to the selected area

Add a second text widget to your report  – this shall become the title. Drag it above the first widget and resize it so that is stretches across the whole width of the page.

Go into edit mode and change the text to ‘Population Profile:’.

Click on the ‘Align Centre’ button in the editor’s menu bar to centre the text.

After that click on ‘Paragraph’ and choose ‘Heading1’ to scale the text.

Save your settings.

For now the report has a static heading which will stay the same if you cycle through different areas of your report. To make the heading area specific, you can use a substitution variable that queries the name of the currently selected area and updates automatically on a change.

Open the editor once again and have a look at the bottom of the menu bar:

‘Feature Name’, ‘Indicator Name’ and (Indicator) ‘Value’ can be used to insert a placeholder for dynamic values.

Replace the colon of  ‘Population Profile:’ with the word ‘for’ and click on ‘Feature Name’ to insert the substitution variable. The text should now look like this:

After saving the changes and closing the editor, #FNAMES{,} is replaced by the  name of the active area from your base geography.

Style a text box with ‘Quick picks’ and ‘Settings’

Text boxes are similar to text widgets but have additional styling options. They are perfect for ‘quick facts’ boxes that display the value of a single indicator from the data store.

Drag a Text Box (not Text Widget) into the report and put it underneath the Break/Line you had added earlier.

Close the text editor that opens by default, right click on the text and bring up the Properties. Compared to the simple text widget, the Text Box has an additional ‘Quick Picks’ tab with instant layouts.

Click on the ‘Blue Box’ layout and then on the ‘Apply’ button that displays on the same tile.

The box now looks like in the preview. There are still some settings that need to be changed in order to make it look like in the example above.

Further adjustments to the appearance and styling can be done in the ‘Settings’ tab.

Find the ‘Box Border Color’ setting under ‘Borders, Colour, Styles’ and click on the white tile to bring up a colour picker. Choose a black colour or type #ffffff into the text field below.

Reduce ‘Box Border Width’ to 1 to make the border a bit thinner.  After that, pick a light grey tone for the ‘Message Background’ property.

Apply the properties and close the dialogue.

Reduce the size of the box; click on the widget and simply drag a side or right click and select ‘Size’ and enter specific px dimensions.

The last thing to do is anchor it left; right click on the text and choosing Anchor > Left.

Use substitution variables to display data from the data store

Bring up the text editor by double clicking on the text and delete the default text. The first line of the example text box above contains the indicator value. As this is specific to the selected area the value needs to be queried by a substitution variable.

In the text editor click on ‘Value’ to bring up the data store; the themes and indicators are displayed in a tree like structure:

Click on the folder icons to display subthemes and indicators. You can also use the search box in the top right corner to search for indicator names or key words.

To add the ‘total number of persons all ages’, click on Population > Estimates > Persons all ages. This will add a substitution variable that looks like this:


After saving the changes and closing the editor, #ILVALUE{datastore:I351} is replaced with the indicator value for the currently selected area.

Now put in two blank lines and add ‘Person all ages (2015)’ as the indicator name to the text. As this will stay the same for all areas, static text is good enough. However, there are situations where you require the indicator name to be dynamic as well. Delete the static text and click on indicator name. Browse to ‘Population > Estimates > Persons all age’ once more and click on the indicator to add the variable. The text should look like this:


You can also replace the date. Instead of ‘(2015)’ add


to the text field. Note that substitution variables will always query the latest date, so if the data store is updated, all variables will re-adjust and show the latest information.

Replicating and scaling widgets

Instead of building each of the text boxes from scratch, it is much easier to copy widgets across and then to re-adjust the data. You can copy widgets within a report or even across reports.

Right click on the text box and click ‘Copy’. Click on a blank space in your report and click ‘Paste’ to insert the widget. This will insert an identical copy of your first text box with the same style and data information. Repeat the process once more to add a third box.

To bring all widgets in line, you may have to resize them, change their anchoring or adjust the padding from the ‘Spacing’ tab. To make resizing easier, there are a couple of options in the right click menu:

‘Width’ scales the widget on percent of the report width, while ‘Auto-Size’ scales in accordance to the text content. ‘Size’ allows you to specify the Width and Height value by pixel. The current values are displayed in the lower left corner when you select a widget.

For the second box use these indicators:

  • Population > Estimates > Males all ages
  • Population > Estimates > Males all ages %

and for the third box use these indicators:

  • Population > Estimates > Females all ages
  • Population > Estimates > Females all ages %

Add the indicator name below as a static text or use substitution variables. You can also add a source definition.

Next, define a font size and color for the first indicator value.

To do this, highlight the substitution variable in the first line and pick your choices from the menu bar in the text editor, then repeat for the other two boxes. Your boxes should now look like this:


Continue reading: Part 2: Tables