Skip to main content
LinkedIn
Copied!

Table of Contents

Summary View form – Configuring interactive charts

Configuring an interactive chart on a summary view report involves first selecting the type of chart to include and then selecting a chart subtype.

The available charts are:

  • Pie – normal, exploded, or doughnut
  • Bar – clustered, overlaid, stacked, 100%
  • Column – clustered, overlaid, stacked, 100%
  • Area – overlaid, stacked, 100%
  • Line – segment, step, horizontal, vertical, curved, reverse step
  • Gauge – normal, pie, speedometer, progress, semi pie
  • Bubble – normal

Complete the fields on each form to configure the chart. Click Submit to save the configuration. Click Cancel to abandon your edits and close the form.

Data

Specify the data and some format options for this chart.

Pie charts

Field Description
Name Field Select one field that is used as the name for the wedge in ToolTips and legends. Select from the properties in the Group By array on the Content tab.
Limit to top Optional. To reduce the count of graph elements to a number that users can more easily interpret, choose a quantity. The default is no limit.

After the system sorts elements by Name Field, the system combines elements that rank lower than the limit into a single chart element. For example, if you limit to the top 5 values, the chart contains the top 5 values plus a 6th value representing the sum of all values not in the top 5.

Bar, Column, Area, and Line charts

Field Description
Category Axis Select one or two category axes. Available categories are determined by the elements in the Group By array on the Content tab. If you select two category axes, select the major one first.

Optionally, enter a text label. If you don't enter a label, the Group By caption appears at runtime.

Data Axis Select at least one data axis. Available data values are determined by the properties in the Fields array on the Content tab.

Optionally, enter a text label for each data axis. If you don't enter a label, the Field caption appears at runtime.

Swap Series/Groups Select to cause the data axis to appear as the vertical axis (the Y axis) and the category axis to appear as the horizontal axis (the X axis.)

Leave unselected for the more familiar presentation, so that categories appear on the Y axis and data values on the X axis.

Uniform Minor Group This check box appears when you select two Category Axis values and one Data Axis series.

Select to indicate that the values for the minor group are uniform and common among values of the major group.

Limit to top Optional. To reduce the count of graph elements to a number that users can more easily interpret, choose a quantity. The default is no limit.

After sorting by largest category first, the system combines elements that rank lower than the limit into a single chart element. For example, if you limit to the top 5 values, the chart contains the top 5 values plus a 6th value representing the sum of all values not in the top 5.

This value is ignored if you select the Swap Series/Groups box.
of If you chose a numeric limit in the Limit to top field, identify which data axis when sorted determines the top elements.

Bubble charts

Field Description
Group By Select the Group By row on the Content tab.
X Axis Select a property in a row from the Fields array on the Content tab to determine the horizontal axis location of each bubble.

Optionally, enter a text label. If you don't enter a label, the Fields caption appears at runtime.

Y Axis Select another property in a row from the Fields array to determine the vertical axis location of each bubble.

Optionally, enter a text label. If you don't enter a label, the Fields caption appears at runtime.

Radius Axis Select a third value from the Fields array to determine the radius of each bubble.
Limit to top Optional. To reduce the count of graph elements to a number that users can more easily interpret, choose a quantity. The default is no limit.

After sorting by largest category first, the system combines elements that rank lower than the limit into a single chart element. For example, if you limit to the top 5 values, the chart contains the top 5 values plus a 6th value representing the sum of all values not in the top 5.

of If you chose a numeric limit in the Limit to top field, identify which data axis when sorted determines the top elements.
Group By Format Optional. Select a control to format the values. (Choose a control that returns a string value, such as Date. You can't use a control that returns HTML markup here.)

Gauge charts

Field Description
Minimum Value Optional. Enter a constant to define the lowest value (leftmost value) to be shown in the gauge chart.
Maximum Value Optional. Enter a constant to define the highest value (rightmost value) to be shown in the gauge chart. If the Minimum Value and Maximum Value fields are blank, the minimum and maximum values specified in the threshold apply.
Format Options Optional. Select Number, Date/Time or Custom to format the gauge labels.
  • If you select Number, complete the Category, Precision, Thousands Separator and Negative Sign parameters.
  • If you select Date/Time, choose a pattern.
  • If you select Custom, select a control that requires no parameters.
Axes

This tab is not used for pie or gauge charts. For other types, complete these fields to control the location and appearance of axes.

Field Description
Group Axis (X Axis)
Show Grid Lines Select to include grid lines for groups. If not selected, only tick marks appear.
Show labels Select to label points on the group axis with values.
Placement For a bar chart, select Left or Right as the location of the group axis. For column, line, and area charts, select Bottom or Top as the location of the group axis.
Scale For a line chart, select Category or DateTime to identify the element of the group axis. (For other chart types, only Category is used)
Format (group) Select a control ( Rule-HTML-Property ) to be used to format the axis values. Click the Open icon
button to create, review or update the control.
Data Axis (Y Axis)
Show Grid Lines Select to include grid lines for the data axis. If not selected, only tick marks appear.
Show labels Select to label points on the data axis.
Placement For column, line, and area charts, select Left or Right as the location of the data axis. For bar charts, select Bottom or Top as the location of the data axis.
Format Select Number, Date/Time, or Custom. The form changes to reflect your choice.
  • For the Number selection, complete the Category, Precision, Thousands Separator and Negative Sign parameters.
  • For the Date/Time selection, choose a pattern such as hh:mm:ss.
  • For the Custom selection, select a control that requires no parameters.
Radius Axis For bubble charts only.
Show labels Select to label points on the data axis.
Format Select Number, Date/Time, or Custom. The form changes to reflect your choice.
  • For the Number selection, complete the Category, Precision, Thousands Separator and Negative Sign parameters.
  • For the Date/Time selection, choose a pattern such as hh:mm:ss.
  • For the Custom selection, select a control that requires no parameters.

Text

Configure the chart title.

Chart

Field Description
Title Provide a descriptive title for the chart
Font style Select a style: regular, bold, italic, or bold italic
Font size Select the font size.

For bar, column, line, area, and bubble charts, configure the titles for the X and Y axes:

Field Description
Group axis title Provide a descriptive title for the X-axis.
Data axis title Provide a descriptive title for the Y-axis.
Font style Select a style: regular, bold, italic, or bold italic
Font size Select the font size.

Options

Configure the chart options.

Field Description
Customize Settings
Chart Size Select Small (300x200px), Medium (500x300px, or 350x300px for pie charts), Large (700x400px, or 400x300px for pie charts), or Custom. If you choose Custom, enter a width and height in pixels.
Show Data Tips Select to display data points in ToolTip text.
Show Maximize Button Select to include a maximize button that allows users of this interactive chart to open the chart in a new window at full screen size.
Show Data Button Select to include a Show Data button that allows users to view the summary view data in tabular, non-chart format. This button is functional only when the chart is produced by the chart JSP tag.
Open in New Window If the Show Data Button box is selected, select to cause the summary view data to open in a new window rather than in the current window.
Maximum Column/bar Width For column and bar charts only. Choose a value between 0.1 and 1 to restrict the size of the largest column (or bar) as a fraction of the overall chart height (or width). For example, if a chart size is 300 pixels high and you select .5, columns in the chart can't be taller than 150 pixels. Accept the default setting of 0 to enforce no restriction.
Exploded /Inner Radius For pie charts only. For Exploded pie charts, set to control the gap between pie slices. For Doughnut pie charts, set to control the size of the hole. Values between 0.1 to 0.5 are typical.
Series Effect Use an effect to allow users to interact with the chart. This is most useful for line charts with a DateTime axis and for other charts with many category values. Select an effect:
  • Slide – To redraw the chart interactively by moving along values of the data axis.
  • Zoom – To grow or shrink a segment of the chart to make detail more visible or less visible.
  • Interpolate – For line and area graphs, to convert the image gradually.
Effects are not available for the Stacked and 100% chart subtypes.
Line Weight in Pixels For line charts, select to control the width of lines in pixels.
Drop Shadow Filter For line charts, select to apply a drop shadow to lines.
Legend
Show Legend Select to present a legend identifying chart categories and colors for each category. If not selected, other fields in this area of the tab are ignored.
Direction Select Horizontal or Vertical for the legend presentation.
Placement Select Top, Left, Bottom or Right for the legend location relative to the chart.
Slider
Show Slider Select to present a slider control. If not selected, other fields in this area of the tab are ignored. Not used with pie charts.
Title Optional. Enter title text to appear to the left of the slider, identifying the function or units of the slider.
Size Optional. Enter a width in pixels for the slider.
Group Count Optional. Enter a maximum number of group elements to present initially. The user can move the slider to see more or fewer elements.
Label
Show Label (Pie charts only) Select to show labels that display information about each data point. If not selected, other fields in this area of the tab are ignored.
Include Field (Pie charts only) Select to include the value of the wedge in the label.
Include NameField (Pie charts only) Select to include the name of the wedge in the label.
Include Percent (Pie charts only) Select to include the size of the wedge relative to the pie in the label.
Label Position (Pie charts only) Optional. Indicate how to render labels for each wedge.
  • Inside – Draw labels inside the chart.
  • Callout – Draw labels in two vertical stacks on each side of the chart.
  • Inside with Callout – Draw labels inside the chart, but if the labels are too small, convert them to callout labels.
  • Outside – Draw labels outside the boundary of the pie chart.
Gauge Settings
Major Ticks Enter an integer to set the number of major tick marks on the chart.
Minor Ticks Enter an integer to set the number of major tick marks on the chart.
Major Tick Length Set the length of major tick marks.
Minor Tick Length Set the length of minor tick marks.
Major Tick Thickness Set the width of major tick marks.
Minor Tick Thickness Set the width of minor tick marks.
Border Thickness Set the width of the border.
Border Alpha Select a value between 0.0 and 1.0 to control the color of the background of the border.
Cover Radius Set the radius of the gauge cover.
Cover Alpha Select a value between 0.0 and 1.0 to set the color of the background of the cover.
Needle Thickness Set the width of the needle.
Needle Alpha Select a value between 0.0 and 1.0 to set the color of the background of the needle.
Needle Style Select Normal or Pointed as a needle style. For Pointed, enter Base Width and Top Width values.

Color

Optionally, you can specify one or more colors for the chart background and for the foreground elements (bars, columns, slices, and so on).

Colors are defined by the HTML standard of three pairs of hexadecimal digits representing red, green, and blue. You can type the digits representing the color you want, or use the Windows color picker installed on your workstation.

For arrays, click the + icon below the array to add a row.

Field Description
Background Color Optional. Identify a background color. Leave blank for a default transparent background.

Click the icon to the right of the field to access a color picker dialog box.

If you enter two or more colors in this array, the chart includes a background with a gradient in the order the colors are listed. Typically, specify only one or two background colors.

Foreground Color Optional. Leave blank to accept default colors for chart elements.

Complete this array to control colors for the pie wedges, bars, columns or other elements in the chart. For column or bar charts, specify only one foreground color. Click the + icon below the array to add a row.

For pie charts, order is significant: the first color listed is used for the top category (largest slice), and so on.

Identify a foreground color. Click the icon to the right of the field to access a color picker dialog box.
Conditional Foreground Color Optional. For bar, column, and pie charts, you can associate a color with each category value. This assures color consistency from run to run of the report, in that a category value that is green on January 1 appears as green again when the summary view rule is rerun on January 20.

Leave the Foreground Color array blank if you complete this array.

Identify a category for the pie chart.
() Select a comparator.
Enter a value of that category.
Identify a foreground color for the slice that represents the value. Click Color to access a color picker dialog box.
Gauge Color Settings
Major Tick Specify a color for the major tick marks.
Minor Tick Specify a color for the minor tick marks.
Border Specify a color for the border.
Cover Specify a color for the gauge cover.
Cover Border Specify a color for the border of the gauge cover.
Needle Specify a color for the needle.

  • Chart tab on the Summary View form

    Complete this optional tab to present summary view data as a chart. The Pega Platform supports both image charts (a static image) and interactive charts.

  • Summary views

    Use the Summary View rule form to define a custom or personal query. This rule generates HTML that provides an interactive display or chart.

Did you find this content helpful?

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.

Ready to crush complexity?

Experience the benefits of Pega Community when you log in.

We'd prefer it if you saw us at our best.

Pega Community has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice
Contact us