Kentico CMS 6.0 Context Help

New/Edit HTML graph button

New/Edit HTML graph button

Previous topic Next topic Mail us feedback on this topic!  

New/Edit HTML graph button

Previous topic Next topic JavaScript is required for the print function  

This form is used for defining HTML graphs for reports. This type of graph is not image-based, but rather composed purely of HTML (table and DIV elements). As a result, it can be dynamically scaled to display any amount of data.

 

You can switch to the Preview tab at any time to see the graph as it is currently configured. The descriptions of particular graph properties are in the following tables:

 

Default:

 

Display name

Display name of the graph shown in the user interface.

Code name

Code name of the graph.

Enable export

If enabled, users who view the graph will be able to export the displayed data to external files using the Microsoft Excel (XLSX), CSV or XML format. The data export feature may be accessed by right‑clicking the graph in the report, which will open a context menu with possible export actions.

 

Query:

 

Query

Database query that extracts the data that will be displayed in the graph. It must return at least two columns: first one for categories, the other columns are used for values.

 

By default, data is displayed with the newest items at the top of the graph, i.e. in descending order.

 

For security reasons, the Edit SQL queries permission for the Reporting module is necessary to edit this property.

Is stored procedure

Indicates if the specified query is a stored procedure.

No record text

Text to be displayed if the query doesn't return any data.

 

Title:

 

Title

Sets the title of the graph.

 

Legend:

 

Legend title

Sets the text caption of the legend.

Display legend

Indicates if the legend should be displayed.

 

Series:

 

Item name format

Can be used to specify the format of item descriptions on the X axis that are in numerical or date‑time format.

 

Numeric formatting:

 

Numbers can be formatted using .NET Custom numeric format strings.

 

Examples:

 

Item # - X axis descriptions will be displayed as Item 1, Item 2 etc.

{0.00} - numeric X axis descriptions will be displayed with precision of two decimal places.

 

Date and time formatting:

 

The format can be set using single‑letter Standard date and time format specifiers without quotes.

 

In addition, any custom formatting can be defined. For example, yyyy - MM - dd - hh:mm would specify a date and time format like: 2010 - 08 - 19 - 12:30

Item value format

Sets the format of the text displaying the values of series items on the Y axis of the graph.

 

This field supports all types of Kentico CMS macro expressions. The following context macros should be used most frequently:

 

{%ser%} - resolves into the name of the current item's series, i.e. the type of the value.

{%xval%} - resolves into the X axis value of the current item.

{%yval%} - resolves into the Y axis value of the current item.

{%pval%} - resolves into the percentage that the value of the current item represents out of the sum of all values in the graph. If there are multiple types of Y axis values, they are all included in the total sum.

 

The format of the values can additionally be specified using the macro parameters listed in the topic linked above.

 

Examples:

 

{%ser%} = {%yval%} - displays the name of the series and its value (e.g. Visits = 287).

{%pval|(todouble)0.0|(format){0:0.0}%}% - displays the item's percentage value rounded to one decimal place (e.g. 5.1%).

 

Item tooltip

Determines the content and format of the tooltip that is displayed when hovering over a series item in the graph. The macro expressions described in the Item value format property can also be used in this field.

Item link

Causes the series items in the graph to serve as links to the specified URL when clicked. The macro expressions described in the Item value format property can also be used in this field.

 

More resources can be found at:

 

Developer's Guide -> Modules -> Reporting -> Overview

Developer's Guide -> Modules -> Reporting -> Creating a new report -> HTML graphs

Developer's Guide -> Modules -> Reporting -> Creating a new report -> Creating a new Graph