Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Panel
bgColorwhite
titleBGColor#f5f5f5
titleManaging Dynamic Charts from Table Data

Table Filter for Confluence add-on allows you to visualize your table data and create dynamic charts that you can configure and update on the fly while viewing Confluence pages. You can select the column containing labels and set one or multiple columns containing number values used for chart creation. Additionally, you can select the appropriate chart or graph type (pie, donut and 3D donut, column, bar, line, area, time line and time area). Optionally, you can set the decimal separator, specify the dimensions of the chart, and enable the hiding of the source table. You can modify settings of your charts and save modifications in the macro body while viewing the page.

Table of Contents
maxLevel4

Widget Connector
width432
urlhttps://www.youtube.com/watch?v=eiVywX8Hmp4
height243

Starting from version 3.0.0 Table Filter add-on allows you to generate charts based on values from your data tables. The add-on supports the following types of charts:

Chart Parameters

These parameters determine the procedure of chart generation on Confluence page. The set of parameters 

ParameterDefaultCompatible withDescription
Row LabelsNone
  • Pie
  • Donut
  • 3D Donut
  • Column
  • Bar

The column containing labels for data values.

Values columnNone
  • Pie
  • Donut
  • 3D Donut
  • Column
  • Bar
  • Time Line
  • Time Area

The column containing numerical values for chart generation.

Values column XNone
  • Line
  • Area
The column containing numerical values for chart generation.
Values column YNone
  • Line
  • Area
The column or columns containing numerical values for chart generation.
Dates columnNone
  • Time Line
  • Time Area
You can select the column with dates for chart generation.
Date Formatyy-mm-dd
  • Time Line
  • Time Area
You can specify the date format used in the column with dates.
TypePieGlobalYou can select the appropriate chart type.
Decimal SeparatorPointGlobalYou can select the decimal separator (either point or comma).
Height

None

(dependable on screen area)

GlobalYou can define the height of the generated chart.
Width

None

(dependable on screen area)

GlobalYou can define the width of the generated chart.
Hide the source tableDisabledGlobalYou can hide the table with data and enable display of the chart only.
Hide chart controlsDisbaledGlobalYou can hide the chart controls when you need just to display the chart without a necessity to update its view.

Inserting

Table chart macro

Chart from Table macro

There exist three ways to insert the Chart from Table macro on the page.

Macro InsertionInstructionsSupported Data
 Inserting the macro through the action icon on the editor pane
  1. Switch Confluence page to the edit mode.
  2. Position the mouse pointer within the table.
    Image Added
  3. On the editor pane, click the Create a chart from table Image Addedicon.
  •  Manually created and copied tables
Manual entry of the {Chart from Table} query on the page
  1. Switch
Switch the
  1. Confluence page to the edit mode.
  2. Position the mouse pointer in the appropriate place on the page.
  3. Start
entering 
  1. entering {Chart from Table
chart} and select the Table chart macro from the prompted context menu.
  1. }.
  2. From the prompted list of macro choices, select Chart from Table.
    Image Added
  • Manually created and copied tables
  • Macros outputting table data
Selection of the Chart from Table macro in the Select Macro form
  1. Switch Confluence page to the edit mode.
  2. Position the mouse pointer in the appropriate place on the page.
  3. On the editor pane, click Insert.
  4. In the Select Macro form, locate the Chart from Table macro and insert it on the page.
    Image Added
  5. Place the table within the macro.
  • Manually created and copied tables
  • Macros outputting table data
  • Click Insert.
  • The macro will be added to your page.
  • Insert your table into the Table chart macro.

    Configuring Table chart macro

    1. On the Confluence page opened in the edit mode, click the Chart from Table chart macro.
    2. Click Edit.
    3. In the Edit Table chart Macro form, define parameters of the macro.
    4. Click Save.

    Using the Table charts

    Once you have defined settings of the Table chart macro and saved the page, you get a page with the generated chart.

    To the right side of your chart, you can locate the chart management sidebar. It allows you to alternate the following parameters of Chart table macro:

    • Row Labels - change the column with labels for another one.
    • Values column - change the column with data values. The chart will be automatically re-generated. Depending on the used chart type you may select column with numerical through Values column X and Values column Y fields.
    • Dates column - change the column with dates. The chart will be automatically re-generated. This select box is shown for Time Line and Time Area charts only.
    • Chart Type - change the chart type for another one.
    • Height/Width - specify the required dimensions of the chart.

    To save new parameters in the macro body, click Save settings. To download the chart image, click .

    Chart Examples

    Pie chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsAgent
    Values columnTickets per Hour
    TypePie
    Decimal separatorPoint (.)
    HeightDefault
    WidthDefault
    AgentTickets per HourAverage Time per Ticket (min)Calls per Hour
    Remy Deomampo4.65.14.2
    Rahul Dickstein4.81.61.3
    Radu Donahue6.45.61.5
    Preston Doorey4.71.31.6
    Phill Doyle2.03.42.7

     

     

    Donut / 3D Donut chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsAgent
    Values columnTickets per Hour
    TypeDonut / 3D Donut
    Decimal separatorPoint (.)
    HeightDefault
    WidthDefault
    AgentTickets per HourAverage Time per Ticket (min)Calls per Hour
    Remy Deomampo4.65.14.2
    Rahul Dickstein4.81.61.3
    Radu Donahue6.45.61.5
    Preston Doorey4.71.31.6
    Phill Doyle2.03.42.7

     

     

    Line chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsTickets per Hour
    Values columnAverage Time per Ticket (min)
    TypeLine
    Decimal separatorPoint (.)
    Height200
    Width

    400

    AgentTickets per HourAverage Time per Ticket (min)Calls per Hour
    Remy Deomampo4.65.14.2
    Rahul Dickstein4.81.61.3
    Radu Donahue6.45.61.5
    Preston Doorey4.71.31.6
    Phill Doyle2.03.42.7

     

     

     

    Column chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsPeriod
    Values column
    • Opened Tickets
    • Pending Tickets
    • Successfully Closed Tickets
    • Tickets Closed w/o Response
    • Unsuccessfully Closed Tickets
    • Total Tickets
    TypeColumn
    Height300
    Width600
    PeriodOpened TicketsPending TicketsSuccessfully Closed TicketsTickets Closed w/o ResponseUnsuccessfully Closed TicketsTotal Tickets
    Q1 2015207423812014664
    Q2 2015278312475839653
    Q3 2015227272002331508
    Q4 2015257202375840612

    Stacked Column chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsPeriod
    Values column
    • Opened Tickets
    • Pending Tickets
    • Successfully Closed Tickets
    • Tickets Closed w/o Response
    • Unsuccessfully Closed Tickets
    • Total Tickets
    TypeStacked Column
    Height300
    Width

    600

     

     

    PeriodOpened TicketsPending TicketsSuccessfully Closed TicketsTickets Closed w/o ResponseUnsuccessfully Closed TicketsTotal Tickets
    Q1 2015207423812014664
    Q2 2015278312475839653
    Q3 2015227272002331508
    Q4 2015257202375840612

    Bar chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsPeriod
    Values column
    • Opened Tickets
    • Pending Tickets
    • Successfully Closed Tickets
    • Tickets Closed w/o Response
    • Unsuccessfully Closed Tickets
    • Total Tickets
    TypeBar
    Height300
    Width400
    PeriodOpened TicketsPending TicketsSuccessfully Closed TicketsTickets Closed w/o ResponseUnsuccessfully Closed TicketsTotal Tickets
    Q1 2015207423812014664
    Q2 2015278312475839653
    Q3 2015227272002331508
    Q4 2015257202375840612

     

     

    Stacked Bar chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsPeriod
    Values column
    • Opened Tickets
    • Pending Tickets
    • Successfully Closed Tickets
    • Tickets Closed w/o Response
    • Unsuccessfully Closed Tickets
    • Total Tickets
    TypeStacked Bar
    Height300
    Width

    600

    PeriodOpened TicketsPending TicketsSuccessfully Closed TicketsTickets Closed w/o ResponseUnsuccessfully Closed TicketsTotal Tickets
    Q1 2015207423812014664
    Q2 2015278312475839653
    Q3 2015227272002331508
    Q4 2015257202375840612

    Area chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Row LabelsTickets per Hours
    Values columnCalls per Hour
    TypeArea
    Decimal separatorPoint (.)
    Height300
    Width400
    AgentTickets per HourAverage Time per Ticket (min)Calls per Hour
    Remy Deomampo4.65.14.2
    Rahul Dickstein4.81.61.3
    Radu Donahue6.45.61.5
    Preston Doorey4.71.31.6
    Phill Doyle2.03.42.7

     

     

    Time Line / Time Area chart

    Parameters in Macro BrowserData Table in Macro PlaceholderRendered Chart
    Values ColumnAverage Time per Ticket (min)
    Dates columnDate
    TypeBar
    Decimal separatorPoint (.)
    Date formatdd.mm.yy
    Height300
    Width400
    DateTickets per HourAverage Time per Ticket (min)Calls per Hour
    25.06.20157.33.23.3
    26.06.20158.53.11.8
    27.06.20155.03.74.5
    28.06.20152.25.82.7
    29.06.20152.03.42.7