Tag Cloud Widget


Apps - Widget - Tag Cloud icon.png This widget belongs to the Dashboards category in the widget library. For a given measure, it provides a graphic display of the text values of dimension elements in a tag cloud. The importance of a keyword in the tag cloud is determined by its frequency, i.e. the number of occurrences in the data source. This is highlighted accordingly by its font size and color.

You can define the visual aspect of the tag cloud using different properties, e.g. text color, rotation, font, etc.

Examples

Data in the CSV file

  • Dimension = Location
  • Measure = Number of equipment
  • Elements displayed: Words corresponding to locations, graphically formatted based on the importance of the number of equipment
             Download Zip icon.png  Download Example (CSV file)
     

Different graphic displays for the Number of incidents by location tag cloud

Spiral display, text rotated and tooltip Rectangular display, letters in the uppercase, selected value = 230
Tag cloud - Example 1.png Tag cloud - Example 2.png

Notes

  • The Tag Cloud widget requires a data source that will retrieve a report, view or CSV file with two columns (grouping levels), i.e. Label and Value.
    Note: If the data source contains several columns, you should use the Data Transformer to select the two columns you want.
    • Column 1: Dimension
    • Column 2: Values of the measure elements to be displayed
  • The font size of each keyword is proportionate to the value of the dimension element in the data source.
  • Each keyword is displayed in the color associated with its value in the legend axis.
  • In execute mode:
    • Tooltips appear when you move the cursor over each keyword.
    • When you click a value in the legend axis, all keywords corresponding to this value will appear in black.

Caution

  • The tag cloud displays text data. If the keywords to be displayed contain numbers, they will be interpreted as text data and not as Integer or Float data.

List of properties

Content

DataSource

Data Source: External data source associated with the widget. 

  • The drop-down list displays all of the data sources available in the app. 
  • To modify the data source or to view its contents, you should click Apps - Edit icon.png. The Apps - datasources Properties - Preview button.png button below the Preview property shows the number of rows (max. 15) and columns extracted.
  • To define a new data source, click Apps - Add datasource icon.png Add Data Source in the Objects pane.
DataTransformer

Data Transformer: Used to define the structure and scope of the data source, apply statistical aggregate functions and modify the order of the measures displayed.

  • Click Setup / Preview Data below the Data Transformer property to open the dedicated window. Open url.png See the description.
EnableDrilldown

Enable Drilldown (Note: Only for an EasyVista data source data source using a view with grouping levels): Used to indicate if data is aggregated (box is checked - the drill-down functionality is enabled) or not (box is not checked).
         Example documentation icon EN.png  Breadcrumbs widget: Breakdown of equipment by location.

Best Practice icon.png

  • If you want the widget to display the breakdown in a grouping level, you should not check this box.
  • Add a Breadcrumb widget to facilitate navigation within grouping levels.

Data

SortByValueDescending

Sort By Value Descending: Used to sort dimension elements in descending order (if the box is checked, from highest to lowest value) or in the order in which they are read in the data source (box is not checked). Note: The order applied is determined by the dimension elements of the first measure in the data source.

Example documentation icon EN.png    You want to display the chart for incidents and requests per employee

The data source contains the Department dimension with three elements. Sort By Value Descending - Example - Datasource.png

Box is checked Box is not checked

Sort By Value Descending - Example - Sort value - On.png

The dimension elements of each measure are sorted in descending order.

Sort By Value Descending - Example - Sort value - Off.png

The dimension elements of each measure are displayed according to the sort order of the data source.

FirstRowContainsDimensionElements

First Row Contains Dimension Elements: Used to specify the structure of the data source by indicating if dimension elements are found in the first column (box is not checked: standard data source structure) or in the first row (box is checked). Note: This property does not affect the behavior of the Data Transformer.

MaximumNumberOfData

Maximum Number Of Data: Used to indicate the maximum number of dimension elements to be loaded from the data source for each measure selected in the data source.

Best Practice icon.png  You should use this property to prevent loss of performance when data volume is large.

  • The count is always performed from the first dimension element.
  • When the number of dimension elements to be loaded is greater than the number of dimension elements in the data source, all of the data is loaded.
  • To view the data source, click Apps - Edit icon.png next to the Data source property, then click Apps - datasources Properties - Preview button.png button below the Preview property which shows the number of measures and the number of dimension elements for each measure.

Example documentation icon EN.png    You want to display the chart for incidents and requests per employee

The data source contains the Department dimension with three elements. Sort By Value Descending - Example - Datasource.png

  • Maximum Number Of Data = 20 (default value)
  • Maximum Number Of Displayed Data = 20 (default value)
  • Maximum Number Of Data = 2
  • Maximum Number Of Displayed Data = 20 (default value)
  • Maximum Number Of Data = 20 (default value)
  • Maximum Number Of Displayed Data = 1

Sort By Value Descending - Example - Number Data - All.png

All dimension elements are loaded and displayed for each measure, i.e. the three departments.

Sort By Value Descending - Example - Number Data - Part.png

Only the first two dimension elements are loaded and displayed for each measure, i.e. the first two departments.

Sort By Value Descending - Example - Displayed Data - Part.png

All dimension elements are loaded but only the first element is displayed. This corresponds to the Sales department. The Others dimension element groups values from the Marketing and Administration departments.

MaximumNumberOfDisplayedData

Maximum Number Of Displayed Data: Used to indicate the maximum number of dimension elements to be displayed for each measure selected in the data source. This improves chart readability.

Example documentation icon EN.png You want to display the chart for incidents and requests per employee. Open url.png See the Maximum Number Of Data field.

  • The count is always performed from the first dimension element.
  • When the number of dimension elements to be displayed is less than the number of dimension elements to be loaded, the Others dimension element will automatically be added to the chart. It will aggregate all of the values from non-displayed dimension elements.

Charts

Position: Keyword display type.

  • Spiral: Keywords are displayed in a spiral.
  • Rectangle: Keywords are displayed in a rectangle.
Spiral Rectangle
Chart - Position spiral.png Chart - Position rectangle.png

Color Range: Used to indicate if the legend axis should be displayed below the chart (box is checked) or not (box is not checked).

  • The color of each segment in the axis is determined by the theme.
             Chart - Color range.png

Series Angle: Series of values indicating the rotation angle of keywords.

  • You can specify a value between -180 to 180.
  • If you enter 0, this means that keywords will be displayed horizontally with no rotation.
  • If you enter -180 or 180, this means that keywords will be displayed horizontally upside down, i.e. with a rotation of 180°.
             Chart - Series angle 1.png
  • You can enter several values. They will be assigned randomly to the keywords.
             Chart - Series angle 2.png

Text Spacing: Space, in pixels, between keywords.

Space: 0 Space: 10
Chart - Text spacing 0.png Chart - Text spacing 10.png

Text Appearance: Upper or lowercase for keywords.

  • Normal: Display in standard case.
  • Uppercase: Display in the uppercase.
Normal Uppercase
Chart - Appearence normal.png Chart - Appearence uppercase.png
Font Family (Inherit) (1) Text font selected using Select Font Chart - Format.png
Size (2) Font size
Style (Inherit) (3) Font style, i.e. bold, italic, underlined
Text Color (Inherit) (4) Text color.

Common

Measure Data Type: Used to define the display format of values in the tag cloud.

  • Integer: Used to display whole numbers rounded up or down to the nearest unit.
             Example documentation icon FR.png  152200.10 ==> 152200
  • Float: Used to display values with two decimal places by default.
    • To modify the default number of decimal places, uncheck the Default Float Precision box and select the value you want in the Float Precision property.
               Example documentation icon FR.png  152200 ==> 152200.00
AdvancedDashboards_Common_DisplayPrintExportButton

Display Print and Export Button: Used to indicate if users can save and print the chart (box is checked) or not (box is not checked). If users can save and print it, the Save icon.png and Print icon.png icons will appear. Note: The icons are always displayed to the right of the chart.

  • Save icon.png : Used to save the chart in a JPG file.
  • Print icon.png : Used to print or save the chart in a PDF file.
             Apps - widgets Advanced Dashboards - Common display print export buttons.png

 

AdvancedDashboards_Common_DisplayAreaColor

Display Area Color: Used to indicate if a specific color should be applied to the background (box is checked) or not (box is not checked). If you want a background color, you should select it in Chart Area Color.

  • The area of the background is delimited by the dimension axis and the measure axis.
  • To apply a background color to the entire chart, use the Theme > Background Color property. The background color defined in the Display Area Color property will have priority.
     
Background color defined (box is checked) White background (box is not checked) Background color for the entire chart (Theme property)
Apps - widgets Advanced Dashboards - Common display area color on.png Apps - widgets Advanced Dashboards - Common display area color off.png Apps - widgets Advanced Dashboards - Common display area color on - Background theme.png

Title

AdvancedDashboards_Common_DisplayChartTitle

Display Chart Title: Used to indicate if a title should be added to the chart (box is checked) or not (box is not checked). If you want to add a title, you should enter it in Chart Title and define its format.
         Apps - widgets Advanced Dashboards - Common - Chart title.png

Display format of the chart title, e.g. font, background color, text color, etc.

PageGeneralFormat
Font Family (Inherit) Font of the text, selected via Select Font Graphic properties - General format.png
Size Font size, selected via the slide or specified directly in the field
Alignment (Inherit) Alignment of the text (Left/Center/Right/Justified)
Style (Inherit) Font style of the text Bold/Italic/Underline)
Background Color (Inherit) Background color of the widget
Text Color (Inherit) Color of the text displayed by the widget

Note: Priority is given to the font and color defined using the text editor

Color Palette

AdvancedDashboards_Common_ColorPalette

Chart Color: Color palette applied to the chart. This is used to define the color of chart data and the color of legend buttons.

  • The list is provided by Logo - EasyVista.png
  • The number of colors in the palette is indicated next to its name, e.g. Brown (6), Default (12), EasyVista (7).
  • The color of other chart elements, e.g. axis title and labels, chart title and tickmarks, are defined using specific properties.

         Apps - widgets Advanced Dashboards - Common - Chart color palette.png

Tooltip

AdvancedDashboards_CommonTooltip

Display Tooltip: Used to indicate if data labels should be displayed in a tooltip when the cursor hovers over the chart (box is checked) or not (box is not checked). If you want to display tooltips, select the information to be displayed from the Label list.

  • Information displayed by default when the cursor hovers over each data point: Value of the dimension axis / Value of the measure axis
  • Define the display format using the properties below.

         Apps - widgets Advanced Dashboards - Common display tooltip on.png

Tooltip Display Mode (Note: Only if the Display Tooltip box is checked): Used to define the information displayed when the cursor hovers each data point.

  • Single: Value of the dimension axis / Value of the measure axis
  • Union:  Value of the dimension axis / All values of the measure axis
Current value of the measure axis (Single option) All values of the measure axis (Union option)
Apps - widgets Advanced Dashboards - Common display tooltip on - Single.png Apps - widgets Advanced Dashboards - Common display tooltip on - Union.png

Position (Note: Only if the Display Tooltip box is checked): Position of the data point's tooltip based on the movement of the cursor.

  • Float: The tooltip will move along with the cursor.
  • Point: The tooltip always appears above the data point regardless of the position of the cursor.

Theme

    Open url.png See the description of properties.

Tags:
Last modified by Unknown User on 2019/09/10 18:32
Created by Administrator XWiki on 2019/09/10 17:11

Shortcuts

Powered by XWiki ©, EasyVista 2020