> ## Documentation Index
> Fetch the complete documentation index at: https://domoinc-openapi-sync-dataflows.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Dynamic Textbox

export const InlineImage = ({src, alt = '', height = '1.6em'}) => {
  return <img noZoom src={src} alt={alt} style={{
    display: 'inline',
    verticalAlign: 'start',
    height: height,
    margin: '0'
  }} />;
};

## Intro

Like a standard [Textbox](https://domo-support.domo.com/s/article/360043429593), a Dynamic Textbox is used to build cards with text. The difference between the two is that with a standard Textbox, the text in the box comes directly from the DataSet, and only one macro is available; this macro lets you dynamically reference the first value in your selected value column.

In a Dynamic Textbox, you enter the text yourself, but more than a dozen macros are available, allowing you to reference information from your selected category and value columns such as change percentage, column names, first/last/penultimate value, minimum/maximum/average value, first or last category, and so on.

This allows you to build text cards with dynamic fields that update anytime your data updates. In the following example card, all of the called-out fields are set to update dynamically based on the content in the DataSet:

<Frame>
  <img alt="dynamic_textbox_example.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005vPAP.png?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=4bfa605a915e8e3c5fb17c59729e6e1e" width="800" height="435" data-path="images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005vPAP.png" />
</Frame>

The text can be as long as you want and can contain any character. You can format the text to be centered, left-aligned, or right-aligned, and can adjust margin size. You can also change the font size, color, and style. These and other options are discussed below.

This article details how to use Dynamic Textboxes in the following topics:

* [Powering Dynamic Textboxes](#powering)
* [Customizing Dynamic Textboxes](#customize)

## Powering Dynamic Textboxes

Dynamic Textboxes require two columns or rows of data from your DataSet. One column references the *category* column you are deriving macros from, and the other column references the *values* column. For example, if you wanted your text to say something like "Sales for \[region] was \[value]," you would drag the column with your region names into the **Category** field and the column with your values into the **Value** field.

At this point, the preview simply pulls in the first category or value from your DataSet, which is probably not what you want. Before the card shows meaningful data, go to **Chart Properties > General > Text** and enter the text you want, along with macros referencing data in your selected columns. Chart Properties are discussed below under [customizing Dynamic Textboxes](#customize).

For information about value, category, and series data, see [Understanding Chart Data](/s/article/360043428693 "Understanding Chart Data").

In Analyzer, choose the columns containing the data for your Textbox. For more information about choosing data columns, see [Applying DataSet Columns to Your Chart](/s/article/360043428713 "Applying DataSet Columns to Your Chart").

For more information about formatting charts in the Analyzer, see [Visualization Card Building Part 2: The Analyzer](/s/topic/0TO5w000000ZaoUGAS "KPI Card Building Part 2: The Card Builder").

## Customizing Dynamic Textboxes

You can customize the appearance of a Dynamic Textbox in a number of ways. You can specify the text that displays in your Textbox, using macros. You can also change formatting, margin spacing, font size, color, and style.

### Defining Text and Macros

In Analyzer with the Dynamic Textbox chart selected, go to **Chart Properties** > **General** > **Text** and specify the text that appears in your Textbox.

To view the available macros, select <InlineImage src="/images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwDT.jpg" />.

<Frame>
  <img alt="dynamic text plus.jpg" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwC1.jpg?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=b293feef8f9be12c831b333e3cf80dd7" style={{width: 490.994, height: 197.997}} width="1406" height="566" data-path="images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwC1.jpg" />
</Frame>

<Frame>
  <img alt="dynamic text macros.jpg" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwC6.jpg?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=f81540047b0f9ff00a08c387c1aa914f" style={{width: 710.98, height: 668.999}} width="1634" height="1536" data-path="images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwC6.jpg" />
</Frame>

For example, if you want the text in your Textbox to read "Initial sales of \[date], Last sales of \[date]," enter " Initial sales of \[First Value], Last sales of \[Last Value]."

Then, every time the data updates, the \[First Value] and \[Last Value] macros update to reflect the most current data.

<Frame>
  <img alt="dynamic text example.jpg" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/STh97d86twEaUU5_/images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwCk.jpg?fit=max&auto=format&n=STh97d86twEaUU5_&q=85&s=92a4002136a9df1396ffb56cef351cf8" style={{width: 704.986, height: 546.996}} width="1400" height="1086" data-path="images/kb/ka05w00000125oI-00N5w00000Ri7BU-0EM5w000005wwCk.jpg" />
</Frame>

All of the following macros are available:

<table border="1" cellpadding="1" cellspacing="1" data-aura-rendered-by="33:209;a"><thead><tr><th colspan="1" rowspan="1"><p> Macro </p></th><th colspan="1" rowspan="1"><p> Description </p></th></tr></thead><tbody><tr><td colspan="1" rowspan="1"><p> Average Value </p></td><td colspan="1" rowspan="1"><p> Returns the average value of all values in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"> Category Col Name </td><td colspan="1" rowspan="1"> Returns the name of your selected category column. </td></tr><tr><td colspan="1" rowspan="1"><p> Change Percent </p></td><td colspan="1" rowspan="1"><p> Returns the percent of change for all values in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value </p></td><td colspan="1" rowspan="1"><p> Returns the specific amount of change for all values in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> First Category </p></td><td colspan="1" rowspan="1"><p> Returns the value for the first category (i.e. topmost category) in your selected category column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> First Value </p></td><td colspan="1" rowspan="1"><p> Returns the first value (i.e. topmost value) in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Item Count </p></td><td colspan="1" rowspan="1"><p> Returns a count of the rows in your data. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Last Category </p></td><td colspan="1" rowspan="1"><p> Returns the value for the last category (i.e. bottommost category) in your selected category column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Last Value </p></td><td colspan="1" rowspan="1"><p> Returns the last value (i.e. bottommost value) in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Maximum Category </p></td><td colspan="1" rowspan="1"><p> Returns the value for the maximum category in your selected category column. This generally applies to date columns, in which the most recent date will be returned. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Maximum Value </p></td><td colspan="1" rowspan="1"><p> Returns the highest value in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Median Value </p></td><td colspan="1" rowspan="1"><p> Returns the median value in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Minimum Category </p></td><td colspan="1" rowspan="1"><p> Returns the value for the minimum category in your selected category column. This generally applies to date columns, in which the least recent date will be returned. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Minimum Value </p></td><td colspan="1" rowspan="1"><p> Returns the lowest value in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Penultimate Category </p></td><td colspan="1" rowspan="1"><p> Returns the value for the second category in your selected category column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Penultimate Value </p></td><td colspan="1" rowspan="1"><p> Returns the second value in your selected value column. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Value Col Name </p></td><td colspan="1" rowspan="1"><p> Returns the name of your selected value column. </p></td></tr></tbody></table>

### Customizing Other Properties

For information about all chart properties, see [Chart Properties](/s/topic/0TO5w000000ZaodGAC "Chart Properties"). The unique properties of Dynamic Textboxes are described in the table below. Adjust them by going to **Chart Properties** > **General**.

<table border="1" cellpadding="1" cellspacing="1" data-aura-rendered-by="33:209;a"><thead><tr><th colspan="1" rowspan="1"><p> Property </p></th><th colspan="1" rowspan="1"><p> Description </p></th></tr></thead><tbody><tr><td colspan="1" rowspan="1"><p> General > Abbreviate Values </p></td><td colspan="1" rowspan="1"><p> When you check this box, values in your Textbox display abbreviated. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Font Size </p></td><td colspan="1" rowspan="1"><p> Lets you select the font size for the text in the Textbox. A number of sizes are available ranging from Small to XX-Large. If you select <b> Default </b>, the size is chosen that best matches the amount of available space. For example, if you have the maximum amount of space available, the XX-Large size is used. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Font Style </p></td><td colspan="1" rowspan="1"><p> Lets you choose whether the font for your text is plain, bold, italic, or bold-italic. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Font Color </p></td><td colspan="1" rowspan="1"><p> Lets you choose the color for your text. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Horizontal Text Alignment </p></td><td colspan="1" rowspan="1"><p> Lets you select the horizontal alignment for your text. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Vertical Text Alignment </p></td><td colspan="1" rowspan="1"><p> Determines whether the text in your Textbox displays at the top, in the center, or at the bottom. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Top Margin </p></td><td colspan="1" rowspan="1"><p> Determines the amount of space in pixels above the text. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Bottom Margin </p></td><td colspan="1" rowspan="1"><p> Determines the amount of space in pixels below the text. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Left Margin </p></td><td colspan="1" rowspan="1"><p> Determines the amount of space in pixels to the left of the text. </p></td></tr><tr><td colspan="1" rowspan="1"><p> General > Right Margin </p></td><td colspan="1" rowspan="1"><p> Determines the amount of space in pixels to the right of the text. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Apply to First Value </p></td><td colspan="1" rowspan="1"><p> Determines whether formatting changes are applied to the first value in the data. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Apply to Last Value </p></td><td colspan="1" rowspan="1"><p> Determines whether formatting changes are applied to the last value in the data. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Apply to Minimum Value </p></td><td colspan="1" rowspan="1"><p> Determines whether formatting changes are applied to the minimum value in the data. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Apply to Maximum Value </p></td><td colspan="1" rowspan="1"><p> Determines whether formatting changes are applied to the maximum value in the data. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Data </p></td><td colspan="1" rowspan="1"><p> Determines whether formatting changes are applied to the first and last values in the data (default) or the last two values. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Reverse Color Direction </p></td><td colspan="1" rowspan="1"><p> When this box is checked, any negative values in your data are displayed using the color you select for <b> Positive Color </b>, and vice-versa. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Positive Color </p></td><td colspan="1" rowspan="1"><p> Determines the color used to represent positive change values/percentages in the Textbox. </p></td></tr><tr><td colspan="1" rowspan="1"><p> Change Value Options > Negative Color </p></td><td colspan="1" rowspan="1"><p> Determines the color used to represent negative change values/percentages in the Textbox. </p></td></tr></tbody></table>
