Visualizations → Rich Text
About a Rich Text Visualization
A Rich Text visualization can make dashboards more readable and understandable, allowing you to expand on information. The Rich Text visualization gives you access to a What-You-See-Is-What-You-Get (WYSIWYG) text editor. The text editor is embedded in and accessible through the Analyzer. Using the text editor, you can create, edit, format, and preview the rich text insight. Incorta stores the Rich Text visualization as HTML for the insight.
Referenceable Variables in a Rich Text Insight
In the Rich Text editor, you can reference specific variables when creating the insight. You reference variables with a preceding $$
syntax before the variable name. The following are the variables you can reference in a rich text insight:
- Internal Session Variable: A scalar value or an array of values from the result of an internal query expression.
- External Session Variable: A scalar value or an array of values from the result of a query to an external data source.
- System Variable: Built-in variables available to all users.
Rich Text Editor Properties
Edit Properties
The following are the Rich Text editor properties in the Edit drop down list:
Property | Description |
---|---|
Undo | Reverse the last action in the editor. |
Redo | Reapply the last removed action in the editor. |
Cut | Remove selected text or image from the editor and add it to the clipboard. |
Copy | Copy the selected text or image to the clipboard. |
Paste | Apply the copied/cut text or image stored in the clipboard. |
Select All | Select all text and images in the editor. |
View Properties
The following are the Rich Text editor properties in the View drop down list:
Property | Description |
---|---|
Source Code | Open a text window displaying the source HTML of the rich text editor content. You can make direct HTML edits to the Rich Text insight. |
Visual aids | Enable visual markers to assist in text layout. |
Preview | Open a window to preview the Rich Text insight. |
Insert Properties
The following are the Rich Text editor properties in the Insert drop down list:
Property | Description |
---|---|
Image... | Insert/Edit an image at the text cursor location or selected text. The following are the available properties for an image: Source: Enter the image source location. Valid image types are GIF, JPG, and PNG. You can embed the image as an HTTP source. Alternative description: Enter the text to display if the image does not display correctly. Width: Enter the pixel width of the image. Height: Enter the pixel height of the image. |
Link... | Insert/Edit a link at the text cursor location or selected text. The following are the available properties for a link: URL: Enter the link URLText to display: Enter the link text that is displayed in the insight Title: Enter the text that will be displayed when you hover over the link. Open link in… : Select to open the link in the current window or a new window. The default is the current window. |
You are able to directly copy and paste GIF, JPG, and PNG images directly into the Rich Text insight. You do not need to insert an HTTP URL for an image.
It is possible to create a web link to another dashboard or dashboard tab using the full HTTP URL. However, these links will not function as drill down links to other dashboards with regards to optionally applying dashboard runtime filters.
Copy and paste an Image
Rather than using the image insertion property, you are able to directly copy and paste GIF, JPG, and PNG images directly into the Rich Text insight. When you copy/paste an image, the image properties will be automatically populated and can be edited if required.
Embed an iframe
You can add an <iframe>
tag to the Rich Text insight from the Source Code editor. An iframe can only be added from the editor using HTML in the Source Code editor.
Format Properties
The following are the Rich Text editor properties in the Format drop down list:
Property | Description |
---|---|
Bold | Set the font to be darker and heavier. |
Italic | Set a slant to the text. |
Underline | Add a line underneath the text. |
Strikethrough | Add a line through the text. |
Superscript | Set text to be smaller than the preceding text and sit above the normal line of type. |
Subscript | Set text to be smaller than the preceding text and sit slightly below the normal line of type. |
Code | Set the font to monospace with specified spacing. |
Formats | Select format properties: Headings: Set the text format to a heading size from 1 to 6. Inline: Submenu containing Bold, Italic, Underline, Strikethrough, Superscript, Subscript, and Code. Blocks: Set the text block to a specific format, such as Paragraph, Blockquote, Div, or Pre. Align: Select the text alignment as Left, Center, Right, or Justify. |
Blocks | Select the text block formatting. The options are Paragraph, Heading 1 through 6, and Preformatted. |
Fonts | Select the text font from 18 common fonts. |
Font size | Select the font size. The font size ranges from 8pt to 36pt. |
Align | Select the text alignment as Left, Center, Right, or Justify. |
Text color | Select the text color from a selection of color swatches or a color picker. |
Background color | Select the line background color from a selection of color swatches or a color picker. |
Clear formatting | Remove all formatting from the selected text. The font will be set to sans-serif, a font size of 12, black font color, and white background color. |
Tools Properties
The following are the Rich Text editor properties in the Tools drop down list:
Property | Description |
---|---|
Source code | Open a text window displaying the source html of the rich text editor content. |
Toolbar Properties
The toolbar offers easy access to the most commonly used Rich Text editor properties found in the prior drop down menus. The following are the rich text editor properties only found in the toolbar:
Property | Description |
---|---|
Bullet list | Select to have the text format set to an indented list using bullets as list markers. |
Number list | Select to have the text format set to an indented list with incremental values. |
Decrease indent | Select to reduce the indentation of the selected line. |
Increase indent | Select to increase the indentation of the selected line. |
Create a Rich Text Insight Visualization
For an existing dashboard, to create a Rich Text insight for a given dashboard tab, follow these steps:
- If not already open, open a dashboard.
- To add a new insight to the dashboard, in the Action bar, select +.
- In the Analyzer, from the Insight panel, select Rich Text in the Other category.
- In the Rich Text editor, add and format your text.
- To optionally preview your changes, in the menu bar, select View → Preview, or in the Toolbar, select Preview (Eye icon).
- To save your changes, in the Action bar, select Save.
Rich Text Insight Example
You will create a Rich Text insight as a greeting banner on a dashboard. It will identify the logged in user, show the current day, and display an image.
In the Cluster Management Console (CMC), you can create a tenant that includes Sample Data. The Sample Data includes the date schema. This example uses this schema. You will also create an internal session variable to reference in the Rich Text insight.
Create an internal session variable
Create an internal session variable named ivar_current_day_name and enter the following expression for the variable:
query(date.date.Day_Name,date.date.Date = $currentDate)
Add an insight
In the Action bar, select +.
In the Insight panel, under Other, select Rich Text.
Enter a greeting to the current user utilizing the user system variable. Use the following text on the first line:
Hello $$userOn the following line, enter a line of text identifying the current day using the ivar_current_day_name variable you created. Enter the following text:
Happy $$ivar_current_day_nameOn the following line, enter the text:
The following are your current daily insightsOn the following line, select the Insert/edit image tool from the toolbar (image icon).
Enter this image as the HTTP link in the Source property.
Set the Width property to 400. The aspect ratio will be locked by default.
Select Save to add the image to the Rich Text insight.
From the Edit menu, select Select all.
Select Align center from the toolbar (centered lines icon).
Select Arial from the font type.
Select the first line of text, set the font size to 24pt from the toolbar and select Bold from the toolbar.
Select the second line of text, set the font to Bold.
Select the Source Code Icon (code bracket icon) from the toolbar.
In the
<span>
tag containing the user name, add the following text into the style attribute:text-transform: capitalize;After applying the capitalize attribute, your first couple of lines of HTML should look like the following:
<p style="text-align: center;"><span style="font-family: arial, helvetica, sans-serif; font-size: 24pt;">Hello </span><span style="font-family: arial, helvetica, sans-serif; font-size: 24pt; text-transform: capitalize;">$$user </span></p>
- Select Save.
- Select the preview tool (Eye icon) in the toolbar. The referenced variables will not display their values in preview mode.
- Select Save.
After following the example, your Rich Text insight should look similar to the following:
Available User Interactions for a Rich Text Insight on a Dashboard Tab
As a dashboard consumer, there are several actions you can take to customize the Rich Text insight to fit your specific needs.
Personalize the Rich Text Insight Layout
Use the Edit Layout panel to adjust the Rich Text insight with the following steps:
- Open the Edit Layout panel with one of these two options:
- Select Personalize (Page icon) in the upper right corner of the dashboard page, and Edit Layout in the Context bar.
- Select More Options (⋮ vertical ellipsis icon) → Personalize to the right of the tab name on the active dashboard tab, and Edit Layout in the Context bar.
- You can perform the following layout changes:
- Select the Rich Text insight to move and resize it.
- Click and drag the insight to reorder the Rich Text insight within the dashboard.
- Drag the scroll icon (up and down arrows) to adjust the height of the insight.
- Select the Save button.
Download the Rich Text Insight
- Select More Options (⋮ vertical ellipsis icon) for the Rich Text insight.
- Select Download.
- Select the download file format:
- XLSX
- CSV