BusinessGraphics
The BusinessGraphics UI element provides several chart types, such as vertical bar charts or pie charts, that can be used for the graphical illustration of data and data relationships. Other more complex chart types are available too, such as portfolio and gantt. These can help the user of your Web application to make decisions for corporate planning or find information in general.
You can use the Chart Designer to modify the UI element properties and additional properties, known as the chart elements, and adapt them to suit your requirements. For detailed information on this tool, see: Calling the Chart Designer.
For further information about the chart types such as the three-dimensional pie chart below, and detailed documentation about Internet Graphics Service (IGS), see the SAP library under SAP Graphics.
Use
For accessibility reasons, you should always display this UI element together with a Label UI element when using a business graphic.
Description of UI Element Properties
● alwaysDisplayGraphic
deprecated. For existing applications you can define whether the Graphic is displayed as a table in accessibility mode. For new applications you can define the data presentation in accessibility mode on your own.
● backgroundColor
Specifies the background color of a BusinessGraphics UI element.
● chartType
Specifies the chart type. The following chart types are available:
Chart Type |
Description |
Example |
area |
Describes a surface diagram. |
|
bars |
Describes a bar chart |
|
columns |
Describes a vertical bar chart. |
|
doughnut |
Describes a ring chart. |
|
gantt |
Describes a chart of type Gantt. |
|
lines |
Describes a line chart. |
|
pie |
Describes a pie chart. |
|
pipeline |
Describes a chart of type pipeline. |
|
polar |
Describes a chart of type polar. |
|
portfolio |
Describes a chart of type portfolio. This chart type can be used as an analytical tool in strategic corporate planning. It can be used to provide a visual display of a company’s competitiveness, for example. |
|
profile_area |
Describes a chart of type profile_area. |
|
profiles |
Describes a chart of type profiles. |
|
radar |
Describes a chart of type radar. |
|
scatter |
Describes a chart of type scatter. |
|
speedometer |
Describes a chart of the type speedometer. |
|
split_pie |
Describes a chart of type split_pie. |
|
stacked_area |
Describes a chart of type stacked_area. |
|
stacked_bars |
Describes a chart of type stacked_bars. |
|
stacked_columns |
Describes a chart of type stacked_columns. |
|
stacked_lines |
Describes a chart of type stacked_lines. |
|
stacked_profile_area |
Describes a chart of type stacked_profile_area. |
|
stacked_profiles |
Describes a chart of type stacked_profiles. |
|
stacked_radar |
Describes a chart of type stacked_radar. |
|
● customizing
Describes how the chart is displayed on the screen. This property is assigned to a Web address (URL) linking to an XML file that describes the appearance of the business graphic on the screen – for example, the graphic color, the background color, fonts, and so on. It also specifies whether or not the graphic displays a legend. You can make these settings directly in the SAP NetWeaver Developer Studio using the Chart Designer tool. To call the tool, place the cursor on the UI element, click the right mouse button, and select the Start Chart Designer menu option in the context menu.
The BusinessGraphics properties dimension and fontFamily are provided by the meta model itself. They overwrite the Customizing settings if they differ from meta model settings.
● seriesSource
Describes the path to the context node in the hierarchical structure of the context that provides the data.
● dimension
Describes the dimensions of the chart. The following dimensions are available:
pseudo_three |
A pseudo-three-dimensional chart, the z-axis is not displayed. |
three |
A real three-dimensional chart. |
two |
A two-dimensional chart (surface diagram). |
● fontFamily
Specifies the font for the graphic elements.
● height
Specifies the height of the chart in relative CSS units like em or ex.
● igsUrl
This property can be used to specify the Web address (URL) of the server on which the Internet Graphics Service should run. This allows you to overwrite the global URL for Web Dynpro System Configuration in the default properties.
● transparentColor
Specifies the color to be used as transparent color. You can specify the colors in RGB, HSB, or X11 - for example, rgb(255,0,0), or slateblue.
● width
Specifies the width of the chart in relative CSS units like em, ex, or percentage.
Properties Overview
Name |
Interface |
Type |
Initial Value |
Bindable |
alwaysDisplayGraphic |
IWDBusinessGraphics |
boolean |
false |
bindable |
backgroundColor |
IWDBusinessGraphics |
String |
|
not_bindable |
chartType |
IWDBusinessGraphics |
WDBusinessGraphicsType |
Columns |
not_bindable |
customizing |
IWDBusinessGraphics |
String |
|
not_bindable |
seriesSource |
IWDBusinessGraphics |
Object |
|
bindable_mandatory |
dimension |
IWDBusinessGraphics |
WDBusinessGraphicsDimension |
two |
not_bindable |
enabled |
IWDUIElement |
boolean |
true |
bindable |
fontFamiliy |
IWDBusinessGraphics |
String |
|
not_bindable |
height |
IWDBusinessGraphics |
String |
300 |
not_bindable |
igsUrl |
IWDBusinessGraphics |
String |
|
not_bindable |
tooltip |
IWDUIElement |
String (TranslatableText) |
|
bindable |
transparentColor |
IWDBusinessGraphics |
String |
|
not_bindable |
visible |
IWDUIElement |
WDVisibility |
visible |
bindable |
width |
IWDBusinessGraphics |
String |
300 |
not_bindable |
Events
● onAction (String id)
This event is triggered when the user selects a certain area of the business graphic. The parameter is the id of the selected UI element.