How to display 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

Example

• Create a file solution.yaml file with the results table example solution file content.
• Place the example Grasshopper definition in your solutions folder.
• Deploy using the cli: ph deploy solution -o <org-slug> <solution-name>

The solution should look like the image below.

Schema

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