How to display results in a table

A how-to guide for displaying results in a table.

Introduction

Would you like to display certain outputs from your Grasshopper model as a table of results? Then add tables to your solution by following these steps.

Prerequisites

  • You configured the frames and routes for your solution.
  • You configured the relevant contents such as the model(s), control panel(s), viewer(s) and datastore.

1. Output results as json in Rhino Grasshopper

  • Use the Packhunt json components in Rhino Grasshopper to format the outputs.
  • Connect the resulting json array to the Packhunt Data Output component.

The example below contains 3 columns for id, length and volume and 2 rows for Product 0 and Product 1:

[
  {
    "id": "Product 0",
    "length": "4.00 m",
    "volume": "8.00"
  },
  {
    "id": "Product 1",
    "length": "4.75 m",
    "volume": "9.50"
  }
]

2. Retrieve the outputs from the model

  • Subscribe the control panel to the model.
  • Add text outputs with the setOutputs entity.
  • Define type as setTable for outputting results in a table.

3. Add table control to the control panel

  • Define a control with a name matching the Data output in the Rhino Grasshopper definition and kind:Table.
  • Define the columns according to the Rhino Grasshopper output.
  • For numerical results set the type to Number and for strings set it to Text.
  • Optionally, you can add column headers by defining labels.

The configuration should look similar to the example below:

params:
  kind: ControlPanel
  controls:
    output: # must match GH model output
      kind: Table
      columns:
        id: # must match the contents of the GH model output
          type: Text
        length: # must match the contents of the GH model output
          type: Text
          label: Length
        volume: # must match the contents of the GH model output
          type: Number
          label: Volume
  subscribe:
    - kind: Model
      frame: home-frame
      source: model
      setOutputs:
        output: # must match GH model output
          type: setTable

See the image below as an example.

Configuration

See the controlPanelModelSubscribe configuration docs and tableControlConfig configuration docs for more information.