Number - Number in Rectangle

Visually displays a number inside an rectangle as a htmlwidget. This can be useful for highlighting values for infographics and dashboards.

Options

DATA SOURCE

Data The value to be shown. This should be a single value which can be extracted from a table using a calculation.

SHAPE

Border width The width of the border around the shape as fraction of the size of the shape. A value of zero indicates no border.

Border color The color of the border.

FILL COLOR

Default fill color The default color used to fill the shape or icon. This color will be used if no threshold(s) are supplied, or the input value is lower than any of the thresholds.

Threshold i The cut-off above which to use different fill color. These should be provided in increasing order.

Fill color i The fill color to use if the input value is above threshold i. For example if threshold 1 = 1, threshold 2 = 2, and default fill color is red, fill color 1 is yellow and fill color 2 is green. Then for an input value of 0.5, we would color the shape/icon red (default fill color), but for an input value of 5, we would use green (fill color 2) instead.

DATA LABEL

Data label prefix Optional string which will be prepended to the data label.

Data label suffix Optional string which will be appended to the data label.

Decimals shown The number of decimal places to show in the data labels.

Data label font size Font size of data labels in points.

Data label font weight One of Normal or Bold.

Data label horizontal alignment One of Left, Center, Right.

Data label vertical alignment One of Top, Middle, Bottom.

Data label horizontal padding Adjusts the horizontal position of the data label in pixels. Negative values will move the data label left while positive values will move the data label right.

Data label vertical padding Adjusts the vertical space of the data label in pixels. Negative values will move the data label down while positive values move it higher.

Data label font family Controls the font of the data label text.

Data label font color Controls color of the data label text.

TEXT ABOVE/BELOW

Text above/below Optional text to place above or below the data label. This differs from the prefix in that it can have different font settings to the prefix.

Place text inside shape Whether the text should be shown inside or outside the shape. By default the text is placed outside the shape and aligned to the outer edge of the shape. When placed inside, it is either aligned to the center of the shape or the data label if it is in the middle of the shape.

Horizontal alignment One of Left, Center, Right.

Horizontal padding Adjusts the horizontal position of the text in pixels. Negative values will move the text left while positive values will move the text right.

Vertical padding Adjusts the vertical space between the text and the shape in pixels. Increase to move the text away from the center of the shape.

Font size Font size of text above or text below.

Font weight One of Normal or Bold.

Font family Controls the font of the text above or text below.

Font color Controls color of the text above or text below.

HOVERTEXT

Hover text Optional text that can be shown when the mouse is placed over the data label.

Hover background color The fill color of box containing the hover text.

Hover font size Font size of the hover text.

Hover font family Font family of the hover text.

BACKGROUND

Background color Controls color of the background.

Margins Controls how much space between the edge of the iframe and the shape or text. When Display is Number in a rectangle, you may need to increase the margins to see the background color. In some cases if the Text above/below is truncated, you may also need to manually increase the margins.