Adding and Editing Panels

A Microreact project comprises any number of customisable panels that interact with each other.

Types of panels

A panel within Microreact contains one of several data types which can be added and edited as described in the Adding and Editing Panels section. All panels are configurable.

• Data Table: spreadsheet-style table showing metadata, which can be used to filter and slice data shown in other panels

• Tree: visualisation of a phylogenetic tree file

• Map: data as markers using latitude/longitude from data table, as well as any imported geojson information

• Timeline: chart of a timeline specific to selected date-time data

• Network: visualisation of a network data file

• Charts: predetermined or fully customised charts visualising data from the data table

• Note: text panel that can contain a story being told, instructions, links, etc.

• Data Slicer: A simple filter based on values in a single data column

Each panel is configurable using the button found in the top right of the panel.

A panel can be temporarily maximised using the icon and then minimised again to show all panels. This allows deeper investigation and interaction with a single panel, while also allowing more panels to interact on a single dashboard.

Adding, Editing, Removing panels

The same menu is used for both adding (creating) new panels and editing existing panels. To do either, click the pencil icon (add or edit views button) in the project controls toolbar (top right of view), which brings up the following menu:

Add (create) new panels

• Choose the Panel Type you want to create (e.g. Create New Tree)
• Drag the grey rectangle and drop it onto the area of the page where you want the new panel to be added.

  • TIP: To overlay on an existing panel so that only one of them is visible at a time, allow the grey box to totally overlap with the existing panel. Otherwise, the new panel will take half the space and the existing panel will take the other half (as in the image below)

  • You can click the X button in the "add" dialogue (or press the Escape key) to cancel.

  • Adjust panel sizes as needed by dragging their edges.

• Configure the panel as described in the following section.

Edit Panel: Data settings

To edit the data for an existing panel, you can either

1. click the hamburger icon on the panel you want to edit, and select "edit" from the popup menu, or:

2. Click on add or edit panels button (pencil icon ) from the project controls toolbar

   1. Choose Edit Existing Panels

   2. Choose the panel you want to alter

Note that the panel will be listed with the name it has been given in the panel's title lozenge.

• Edit the panel's data settings:

  • Map panel (map type, latitude & longitude columns, GeoJSON file)
  • Network panel
  • Metadata (data table) panel (data file, id column, Column names, Colour palette type). To change the data source, you can select either a file or enter a URL here
  • Timeline panel (data type, columns)
  • Tree panel(tree file, column in metadata table with labels)
  • Data slicer panel (columns used for slicing, grouping, display mode, sorting)

Moving & Resizing Panels

See silent video below for a demo.

Panels can be moved by clicking on the Title lozenge (i.e. where it says "Slicer", "Tree", etc by default) and dragging to the desired location. . The darkened border will show where the panel will go when the dragging is let go. If an entire other panel is framed, then the panels will overlay one another. This is a good way to save space or to hide panels that are irrelevant for a saved view.

Panels can be resized. Click & drag the edge of a panel to change the width or height of the panel. Remember that you can also maximise a panel temporarily.

Renaming Panels

Panels can easily be renamed to clarify their contents. This is especially helpful when a view contains more than one panel of the same type. The name added here will show up in the "Add or edit panels" listing.

Silent video:

Removing Panels

To delete an existing panel:

• Click on add or edit panels button (pencil icon ) from the project controls toolbar
• Choose Edit Existing Panels

• Choose the panel you want to delete (e.g. Map)

• Click the Remove button under the list of panels.