IA Report Builder 2.1.0 – 19 July 2021 Release Notes

Overview

Report Builder version 2.1.0 introduces a new widget, the Toggle Content widget. This has been added in order to enable content sections in a report to be expanded/collapsed by the end user. Prior to the addition of this widget, the same “accordion” effect had to be achieved using styling in the website that the report was embedded into.

Toggle Content Widget

In the example below, the end user can click the button next to the Safeguarding heading to collapse the content below it (this is just an image, the toggle won’t do anything here!).

InstantAtlas Report Builder Toggle Content Widget

The different settings available for this widget are described on the widget help page.

Number Formatting

It is now possible to specify a percentage number format (P) for your widget to show data as percentages. For example, for a Data Table widget, locate the Number Format setting under Numbers & Values and replace this with P. For a Bar Chart widget, locate the Axis Label Format setting under Axes and type in P. Visit this page for more on the number formats supported in Report Builder.

If you have any questions relating to this release please contact support@instantatlas.com.

IA Report Builder 2.0.2 – 14 June 2021 Release Notes

Overview

Report Builder version 2.0.2 addresses a number of bugs, several of which will  ensure a smoother migration from version 1 to version 2 reports. We have also added some of the functionality of Report Builder 1 that had not yet been implemented in version 2, as well as performance, accessibility and error handling improvements.

Bug fixes

  • Bar Charts set to horizontal orientation now also work when the selected data contains upper and lower confidence limits.
  • The Scatter/Bubble Chart widget has gained the setting X Axis Range which allows the x-axis to be constrained between two defined values.
  • The Scatter/Bubble Chart widget can now be configured to show all points in the same colour without having to define a separate colour for each feature. This is done by switching Constrain Palette Colors on:
  • The Filled Icon widget now shows the icon filled in the selected Highlight Color if Highlight Selected Feature is enabled.
  • Copying widgets from one report to another now works more reliably. In version 2.0.1 and when copying multiple widgets in succession, a browser refresh was required between pasting different widgets.
  • In the Edit Chart Colors… dialog (main menu – StylingChart Colors) the Toggle direct edit buttons now work by providing a text field to insert colour values in hexadecimal or RBG format.
  • Exiting a report now takes the user back to the same folder view with the same sorting retained.
  • Fix for an issue with hash/anchor links that occurred when using the # symbol in the browser address bar . This allows users e.g. to jump to a particular section of a report by providing the URL to the anchor tag.
  • Fix for certain font families (those containing spaces in the name) not being applied in view mode of a report.

Improved migration

  • Pie Charts in migrated reports no longer group small segments together into one category.
  • Titles of Table widgets are now migrated correctly.
  • The content of the Table Footer settings from Report Builder 1 is now migrated to the setting Caption in Report Builder 2.
    Please note: Any tables in reports that have been migrated and saved before the release of Report Builder version 2.0.2 will have lost the Table Footer text. You can re-add the text by entering it into the Caption setting manually. Alternatively, if the equivalent version 1 report still exists, you can migrate it again.

Additional functionality

  • It is now possible to change the font colour of text in a Text widget through the editor toolbar. You have the option to choose one of the predefined colours or use the palette icon to open the Color Picker dialog
  • The Advanced Settings dialog in the Pages menu has gained options to customise the index page of the report.
  • Any changes to the Pages|Advanced Settings dialog now turns the Save button of the report editor orange, indicating that there are unsaved changes.
  • Line and scatterplot widget point styles have been extended and some of the less obvious options have been subtly renamed.
  • Web accessibility has been improved by adding the option to show unique point markers in chart series lines and index options to chart labels – please see this blog post to find out more about accessibility for reports created using Report Builder. 
  • The Data Catalog data model is cached in the browser whilst the editor page is open, which means the widget settings dialog opens faster.
  • Improved error messaging when/if connections fail.
  • Widgets have become more robust to temporary data connection errors. If a connection fails, the widget will attempt to reconnect to the data after a few seconds, up to 3 times before giving up.

If you have any questions relating to this release or migration of reports from version 1 to version 2 please contact support@instantatlas.com.

Tips for using Report Builder 2.0

A major new version of InstantAtlas Report Builder (version 2.0) is now available. Report Builder 2.0 is a complete redesign and rebuild of the application, keeping all that was good from version 1 whilst making the reports faster to load, easier to create, more responsive to different devices and more accessible to a range of users.

The process of building a report and editing widgets is essentially the same as in Report Builder 1. It was important to us that that existing users did not have to learn how to create reports all over again! However, there are a few notable differences within the Editor user interface that we thought we would point out  to make switching to using Report Builder 2 a little easier.

Saved report location

When you create a new report in 2.0, this will automatically be saved either in the root of your ArcGIS Online account, or if you selected a folder on the Report Builder homepage before creating your report, in that folder. You can always move this to a different folder if you need to using the ‘Move’ option in ArcGIS Online.

Context menu

We no longer override the browser’s context menu when right-click with your mouse on a report page in the Report Builder workspace. You can access the same functionality in other ways, either from the top menus, or in the case of pasting a widget, using the ‘jigsaw bar’ at the foot of the page or by selecting an existing widget on the page and clicking the page button that appears in the widget toolbar.

Setting Comparison Areas for a widget

This is now done from the Settings tab of the widget Data & Settings window – in Report Builder 1 it was done under the Data tab.

Setting a widget to show data for all areas

This is now done from the Settings tab of the widget Data & Settings window (usually in the Behaviour settings group which becomes visible when the advanced settings are toggled on) – in Report Builder 1 it was done under the Data tab.

Publishing reports as a bundle of static files

This was an option in Report Builder 1 option but has been dropped. It is unnecessary due to the way the reports load in Report Builder 2. It is entirely possible to use reports ‘live’ so that they always show the latest data in the report data source(s), and so that you do not have to publish them as static files each time the source data is updated.

Report navigation toolbar

By default, reports now show a toolbar at the top. This allows the user to switch page, print and return to the report index page with the list of features to select from. This toolbar can be hidden if necessary by clicking the Pages menu > Advanced.

How to embed InstantAtlas apps into your website

The purpose of this post is to provide the necessary information for embedding InstantAtlas apps into a website. Colour is used to explain the code below – if you have difficulty distinguishing the colours used please contact support@instantatlas.com and we will find an alternative. The actual creation of the apps in the first place is not covered in this post.

Reports

InstantAtlas Report Builder is a tool for for designing and publishing any type of report on ArcGIS Online from simple factsheets to complex, multi-page area profiles.

Report Builder version 2

Report Builder 2 was released in April 2021. To embed a report, add this code to your web page:


<div id="iaReportHolder" class="ia-app ia-embedded-report"><script src="https://reports.instantatlas.com/static/js/ia-reports.js?report=5db1ef44afe64e499b390b57c0f012ae&container=iaReportHolder"></script></div>

Simply change app ID (shown above in red) to embed a different report. If you wish to embed a report for a particular feature rather than the index page, add this code to your web page:


<div id="iaReportHolder" class="ia-app ia-embedded-report"><script src="https://reports.instantatlas.com/static/js/ia-reports.js?report=5db1ef44afe64e499b390b57c0f012ae&feature=E05007163&container=iaReportHolder"></script></div>

Simply change the feature code (shown above in blue) to embed the report for a different feature. If the report contains a Navigator widget, this can then be used to switch the area being shown (you may need to edit the widget’s Item Hyperlink setting).

To embed multiple reports in the same page (along with drop-down controls to select the report) you need to use a configuration attribute as shown below.

<div> <div class="ia-report-viewer ia-app ia-embedded-report no-controls" data-config='{"reports": [{"id": "677880328fb94104b91b758bd498d881", "name": "County"}, {"id": "ce13e3808baa4e56aad1b5583a9244bd", "name": "Local Authority"}, {"id": "2a41ba53aebc43198723a4705f706223", "name": "Active Partnership"}, {"id": "692664a5ea1c469a8a263cff0d3868fc", "name": "Local Delivery Pilot Area"}], "default_geography": "677880328fb94104b91b758bd498d881"}'> <script type="text/javascript" defer src="https://reports.instantatlas.com/static/js/ia-reports.js?container=.ia-report-viewer&auto=true"></script> </div> </div>

The red text shows the script tag that does the work of embedding the report(s). Note the ?container=.ia-report-viewer part of the URL – this is what tells the script where to fetch the configuration from. You will need to make sure that the “class” of your enclosing <div> matches this ?container= instruction.

The blue text shows the reports configuration. This is encoded as JSON and can look a bit complicated – but is essentially a list of the reports that you want to use as { "id": "<report-id>", "name": "<label-to-show-in-drop-down>" }.

Report Builder version 1

Reports created using Report Builder 1 can be embedded using two methods: static or dynamic. In the first case, the report must first be published as a bundle of static HTML files – this can be done within Report Builder 1 by the author of the report. We recommend using the static embedding method to ensure the report pages load as quickly as possible.

Static method

Add this code to a web page to embed a report that has been published as static HTML files:


<div>
        <div id="iaoReportContainer" class="iao-content report-container" data-config='{"reports": [{"id": "5db1ef44afe64e499b390b57c0f012ae", "name": "Ward"}], "default_geography":"5db1ef44afe64e499b390b57c0f012ae", "urlMode": "query", "controls": { "type": "drop-down", "container": ".iao-report-controls", "reportLabel": "Select a report", "featureLabel": "Select an area"}}'>
            <script type="text/javascript" defer src="https://reports.instantatlas.com/scripts/lib/IAO.embed.min.js?container=iaoReportContainer&auto=true"></script>
        </div>
    </div>

You can change the following elements:

  • 5db1ef44afe64e499b390b57c0f012ae – this is the app ID (from ArcGIS Online) of the report you wish to embed.
  • Ward – this is the label for the report that will be displayed in the “Select a Report” drop down menu.
  • Select a report and Select an area – these are the labels for the drop down menus that will be shown above the report.

You can embed multiple reports in the following way:


<div>
        <div id="iaoReportContainer" class="iao-content report-container" data-config='{"reports": [{"id": "5db1ef44afe64e499b390b57c0f012ae", "name": "Ward"},{"id": "0647c83c53f24789b8d637c0ad6578c0", "name": "LSOA"}], "default_geography":"5db1ef44afe64e499b390b57c0f012ae", "urlMode": "query", "controls": { "type": "drop-down", "container": ".iao-report-controls", "reportLabel": "Select a report", "featureLabel": "Select an area"}}'>
            <script type="text/javascript" defer src="https://reports.instantatlas.com/scripts/lib/IAO.embed.min.js?container=iaoReportContainer&auto=true"></script>
        </div>
    </div>

The app ID and name of each additional report should simply be added as shown above in red. The report that shows by default is defined by the app ID shown above in green.

Note: for the report embedding to work, jQuery must be loaded before the report. A defer setting has been used in the embed code to make sure the report loads last.

An example of embedding reports using this method can be seen in this page of the Suffolk Observatory.

Dynamic method

Add this code to a web page to embed a report using the dynamic method.


<div id="iaoReportContainer" class="iao-content" style="width: 1000px;height: 2751px;"><script type="text/javascript" src="https://reports.instantatlas.com/embed/5db1ef44afe64e499b390b57c0f012ae/E05007163?container=iaoReportContainer"></script></div>

Simply change app ID (shown above in red) to embed a different report and optionally the feature code (shown above in blue) to load the report for a different feature.

Data Explorer

InstantAtlas Data explorer connects directly to an InstantAtlas Data Catalog in ArcGIS Online and allow your web site users to browse and download data and create graphics for documents and presentations.

Add this code to a web page to embed a data explorer app.


<link href="https://hub.instantatlas.com/data-catalog-explorer/static/css/main.css" rel="stylesheet">
<div id="root"></div>
<script src="https://hub.instantatlas.com/data-catalog-explorer/static/js/main.js"></script>
<script>window.dataCatalogExplorer.launch({ "appid": "e3d83edc76bd45548ddd0e2ee4fe4bdf", "container": "root" })</script>‎

e3d83edc76bd45548ddd0e2ee4fe4bdf – this is the app ID (from ArcGIS Online) of the data explorer app you wish to embed.

An example of embedding a data explorer app can be seen on this page of the Suffolk Observatory.

Map Explorer

The Map Explorer app is a simple-to-use app that that allows a user to select from a pre-defined set of indicators from an InstantAtlas Data Catalog and visualize them as thematic maps.


<div id="ia-map-panel" style="width: 100%; min-height: 500px; height: calc(100vh - 300px);">
<script src="https://hub.instantatlas.com/map-explorer/embed?c=ia-map-panel&appid=917b1891e5934d6baeeff23cdb0e9f38"></script>
</div>

917b1891e5934d6baeeff23cdb0e9f38 – this is the app ID (from ArcGIS Online) of the map explorer app you wish to embed.

Custom Area Reporter

The InstantAtlas Custom Area Reporter allows users to define their own areas and generate reports for them. Users select areas from a map using a range of selection tools. Once an area is defined users can produce one or more reports for the area. The report presents aggregated figures for the chosen area based on the underlying geography.

Add this code to a web page to embed a custom area reporter app.


<div>
        <div id="report-content-panel" style="width: 100%; height: 100%; border: 1px solid #ccc; position: relative;">
            <script type="text/javascript" defer src="https://reports.instantatlas.com/embed-selector?appid=1a451d1bbe3544849585ab2745c25f5d&container=report-content-panel&flush=true"></script>
        </div>‎
    </div>
    <script src="https://js.arcgis.com/3.24/"></script>‎

1a451d1bbe3544849585ab2745c25f5d – this is the app ID (from ArcGIS Online) of the custom area reporter app you wish to embed.

An example of embedding a custom area reporter app can be seen on this page of the Suffolk Observatory.

Support

If you have any difficulties embedding InstantAtlas apps in a website please contact support@instantatlas.com.