Block: Image

An Image block for configuring an image to be displayed in the user interface.

Overview

An Image block is used for configuring an image, to be displayed within a frame. The image resizes itself to fit inside its parent container while maintaining the aspect ratio.

When configuring a solution, images are typically saved in an “assets” folder within the solution folder. See the assetsPath property of the Solution object for more information.

In order to minimize the sizes of the image files, it is advisable to resize the images to be as close to their target size as possible. Images in JPG format also tend to be smaller than PNG.

Example

Below is an example configuration.

  kind: Router
  routes:
    - frame: home-frame
frames:
  home-frame:
    kind: Frame
    contents:
      my-image:
        kind: Image
        path: assets/my-image.png

ImageConfig

Name Type Required Description
kind "Image" Yes Image
path string No The path to an image file, relative to the solution folder
subscribe List<ImageModelSubscription> No A list of objects for subscribing the Image block to other blocks.

ImageModelSubscription

An object for configuring a subscription from an Image block to a Model block. The subscription allows the image path to be updated based on the output from a Grasshopper model.

Name Type Required Description
kind "Model" Yes A constant, Model.
frame string Yes A string specifying the name of the frame in which the Model is located.
source string Yes A string specifying the name of the Model.
setImagePath string Yes A string specifying a name of a Packhunt Data Output component in the Grasshopper model that outputs the image path.