Skip to content

Item

The Item houses a single chart, table, selector, markdown, or input object.

It also informs the width that the chart, table or markdown should occupy within a row. Widths are evaluated for each item in a row relative to all of the other items in the row.

In the example below, the markdown would take up 1/4th of the row and would be positioned on the left edge. The table would also take up 1/4th of the page and would sit to the right of the markdown. The chart would take up 1/2 of the page and would touch the right edge of the row.

items:
  - width: 1
    markdown: ref(welcome-markdown)
  - width: 1
    table: ref(table-name)
  - width: 2
    chart: ref(chart-name)
  - width: 1
    selector: ref(selector-name)
  - width: 1
    input: ref(input-name)

Markdown

Reference a markdown object to add formatted text to your dashboard:

markdowns:
  - name: welcome-markdown
    content: |
      # Welcome to Visivo
      This is **formatted** text.
    align: center
    justify: start

dashboards:
  - name: my-dashboard
    rows:
      - items:
          - markdown: ref(welcome-markdown)

Markdown content supports CommonMark and GitHub Flavored Markdown. You can also render raw HTML within your markdown.

Attributes

Field Type Default Description
path string None A unique path to this object
name string None The unique name of the object across the entire project.
file_path string None The path to the file that contains the object definition.
width integer 1 The width of the Item determines is evaluated relative to the other items in a row.
markdown Any of: Markdown, string or string, string None A Markdown object defined inline, a ref() to a markdown, or a markdown string (deprecated).
align string None DEPRECATED: Use the align property on the Markdown model instead. Alignment of markdown content. Only valid when markdown is set. Options are 'left', 'center', or 'right'.
justify string None DEPRECATED: Use the justify property on the Markdown model instead. Justification of markdown content within its container. Options are 'start', 'end', 'center', 'between', 'around', or 'evenly'.
chart Any of: Chart, string or string None A chart object defined inline or a ref() to a chart.
table Any of: Table, string or string None A Table object defined inline or a ref() to a table
selector Any of: Selector, string or string None A Selector object defined inline or a ref() to a selector
input Any of: MultiSelectInput, SingleSelectInput, string or string None An Input object defined inline or a ref() to a input