Boxes are used by central or overview pages and can be included within a tab block or an elements block. A box element is defined by using a box tag with required tags between an open { and close } braces.
|
Tag |
Examples |
Status |
Notes |
|---|---|---|---|
| box |
box percent = 50 { title "Left Side" title-justification "left" element id = "mynos" }
box id = "bgd" style = "simple" { element id = "gdcount" percent = 30 } |
Required |
Creates a box around a single element with a blue title bar along the top. The boxed element can include any element. For example, table, grid, image, row or chart. A percent is used when the box tag is within a vsplit or hsplit. |
|
background-color |
background-color "bdfbaf" | Optional | Sets the background color for the box. Uses a hexadecimal code to identify colors. |
|
bar-chart |
bar-chart id = "bar_chart_year" { dimension "Year" title "Vehicles Sold by Year" bar column = "Vehicles Sold" { link { page id = "year" } } sort-column = "Year" }
bar-chart id = "lc-sales" { cplan "/cplans/southern.cplan" dimension "Posting Month" title "Cases Sold by Month" bar column = "Cases Y Y-1" title = "2018" bar column = "Cases Y" title = "2019" sort-column "Posting Month" } |
Optional |
Defines a bar chart with the specified dimension and summary. Multiple columns can be specified. By default, the legend displays on the right side of the chart. TIP: Use the sort-column and first tags together to display a limited number of the highest or lowest values. |
|
element |
element { ... }
element id = "br-yearmo" percent = 90 |
Optional |
Defines elements for a tab block. When defined in a definitions block, the elements can be reused by pages within the script. Boxes are contained within an elements block, include an element from an elements block, or both. |
|
grid |
grid id = "gdcar" { cplan "/cplans/carLK.cplan" row "Group" row "Make" } |
Optional |
Defines a grid by specifying rows from a cPlan and the strings in those rows. |
|
hbar-chart |
hbar-chart id = "bar_chart_year" { dimension "Year" bar column = "Vehicles Sold" { link { page id = "year" } } sort-column "Year" } |
Optional |
Defines an hbar-chart with the specified dimension and data column. Multiple columns can be specified. By default, the legend displays on the right side of the chart. An hbar-chart does not support a title tag. TIP: Use the sort-column and first tags together to display a limited number of the highest or lowest values. |
| hsplit |
vsplit { hsplit percent = 50 { element id = "ln-yearmo" percent = 0 element id = "br-yearmo" percent =50 } hsplit percent = 50 { element id = "gddimcount" percent = 90 spacer percent = 10 } } |
Optional |
Displays contained items horizontally, or left to right. IMPORTANT: An hsplit tag must first be contained within a vsplit tag. Multiple hsplit tags within a vsplit are aligned top to bottom according to the vsplit tag. |
|
id |
id = "br-yearmo" | Optional | Gives a block or element an identifying name so it can be referenced elsewhere in the script. |
|
image |
image id = "preview" percent = 27 { repository "brands" path "/divetab/images/group.jpg" } |
Optional |
Specifies a graphic to include and gives it an id. |
|
line-chart |
line-chart id = "lc_month" { title "Vehicles Sold by Month" dimension "Month" line column = "Vehicles Sold" sort-column = "Month" } |
Optional |
Defines a line chart with the specified dimension and data column. Multiple columns can be specified. By default, the legend displays on the right side of the chart. TIP: Use the sort-column and first tags together to display a limited number of the highest or lowest values. |
| percent |
percent = 50 percent = 85 |
Optional |
Identifies the percentage of the display layout allocated for the element. NOTE: The total percentage must equal 100. |
|
pie-chart |
pie-chart id = "Pie-gp" { title "Units by Salesperson" title-justification "left" dimension "Salesperson" column column = "Cases Y Y-1" { link { page id = "rp-Product Category" } } } |
Optional |
Defines a pie chart for the specified data dimension and data column. Only one column can be specified. By default, the legend displays on the right side of the chart. |
|
table |
table id = "tb-customer" { dimension "Customer" text column = "Net Sales" { width 150 } text column = "Cases" { background-color "dda0dd" text-color "5f9ea0" } sort-column "Cases" reverse = true first 10 } |
Optional |
Defines a table on the page. The columns expand and contract to fit the area available in the parent element in the page. Columns can use the width tag to specify the width of the column. TIP: Use the sort-column and first tags together to display a limited number of the highest or lowest values. |
|
title |
title "Bar Chart" | Optional | Indicates a title for the box. |
| title-justification |
title-justification "left" title-justification "right" title-justification "center" |
Optional | Aligns the title of the box to the left, right, or center. By default, the box title is aligned to the center of the title bar. |
| vsplit |
hsplit { vsplit percent = 50 { element id = "br-year" percent = 49 line percent = 2 element id = "ln-mo" percent = 49 } vsplit percent = 50 { element id = "table-yr" percent = 90 } } |
Optional |
Displays contained items vertically, or top to bottom. IMPORTANT: A vsplit tag must first be contained within an hsplit tag. Multiple vsplit tags within an hsplit are aligned left to right according to the hsplit tag. |
See also: